javascript - vue에서 구성 요소를 합리적으로 분할하는 방법은 무엇입니까? 어떤 종류의 모듈이 별도의 구성 요소가 되어야 합니까?

Question

최근에 저는 메인 인터페이스와 채팅 페이지가 포함된 작은 웹 채팅 애플리케이션을 작성하고 있습니다. 내용은 복잡하지 않습니다. 처음 Vue로 글을 쓰려고 했을 때 메인 인터페이스 상단에 개인정보, 중간에 목록, 하단에 친구 카테고리 전환, 목록을 클릭하면 열리는 채팅 인터페이스의 텍스트로 구분되어 있었습니다. 항목, 메시지 패널 등을 모두 별도의 구성 요소로 분리합니다.
하지만 이로 인해 자식-부모 컴포넌트 통신이 더 많이 발생하는 것 같습니다. 리더는 이것을 별도의 컴포넌트로 작성할 필요가 없다고 말했습니다. 컴포넌트의 아이디어는 재사용할 필요가 없습니다. 하지만 인터넷에서 데모를 보면 다양한 기능 모듈이 개별 구성 요소로 분리되어 있습니다.

---

그래서 이 채팅 기능의 구성 요소 분할을 최적화하는 방법과 논리를 파악하는 데 도움을 주셨으면 좋겠습니다. 구성 요소 재사용에 대한 아이디어를 이해하는 방법은 무엇입니까?

Answer 1

제가 이해한 바는 컴포넌트로 작성되었기 때문에 이 컴포넌트가 다른 곳에서 사용될 것이라는 의미입니다. 그렇지 않으면 꺼내도 소용이 없고 스스로에게 더 많은 문제를 야기할 것입니다. 페이지에 내용이 많다고 생각되면 CSS, JS를 추출하여 작성하시면 됩니다.