source

이것을 사용하는 것의 단점은 무엇입니까?vue 컴포넌트의 $root?

gigabyte 2022. 8. 21. 19:48
반응형

이것을 사용하는 것의 단점은 무엇입니까?vue 컴포넌트의 $root?

vue의 공식 문서에서 다음 사용법을 찾았습니다.$root엣지 케이스 섹션에 있습니다.'엣지 케이스'를 사용하면this.$root(또는this.$parent)의 경우 자 컴포넌트에서 루트인스턴스의 데이터를 변환하는 방법은 일반적이지 않으며 권장되지 않습니다.

vuex는 규모가 크고 복잡한 vue 애플리케이션에 가장 적합한 상태 관리 옵션이며 더 고급 기능을 갖추고 있어 디버깅에 적합합니다.하지만 그게 날 확신시키진 못해this.$root좋지 않아요.

의사 말처럼this.$root루트 데이터를 변환하는 것은 데이터 변경이 발생한 시기와 장소를 추적할 수 없기 때문에 디버깅에 적합하지 않습니다.하지만 내가 알고 싶은 건

this.$root접근법에는 디버깅에 관한 단점만 있습니까?관련 문제를 디버깅하는 것 에 다른 문제는 없습니까?this.$root루트 데이터를 변환하는 방법?만약 그렇다면, 그 문제를 보여주는 작은 예를 들 수 있습니다.왜냐하면 저는 그것을 사용하지 않을 수 없기 때문입니다(vue app이 그렇게 크고 복잡하지 않다면).잘 부탁드립니다!

이것은 모두 좋은 건축과 나쁜 건축에 관한 것입니다.가능한 한 최소한의 데이터를 공유할 수 있도록 항상 코드를 설계해야 합니다(이것은 Vue와는 관련이 없습니다).

vue 구성 요소에는 개인 및 공용 메서드와 필드가 있습니다.컴포넌트의 모든 메서드는 비공개로 간주합니다.그리고 공공장소에 대한 $emit과 소품들.개인 메서드 및 필드에 액세스하는 것은 항상 좋지 않습니다. 이유는 무엇입니까?

  • 누가 주를 바꿨는지는 확실하지 않다.@click some deep child와 같은 기능이 있는 경우 변경을 원할 수 있기 때문에 컴포넌트 트리 전체가 재렌더될 수 있습니다.data뿌리의 안쪽.
  • 구성 요소를 어떻게 테스트하시겠습니까?항상 루트를 부착해야 합니다.
  • 예를 들어, 대규모 엔터프라이즈 애플리케이션을 사용한다고 가정해 보십시오.또한 $root에는 여러 곳에서 액세스할 수 있습니다.이제 새로운 개발자가 와서 컴포넌트 중 하나를 사용하여 콜시그니처를 변경했는데 다른 컴포넌트에서 변경하는 것을 잊었습니다.당신은 결국 고장난 앱이 될 것입니다.vuex와 어떻게 다른가요?vuex에는 모듈이 있어야 모든 컴포넌트가 액세스할 수 있습니다.
  • 는 추적하지 않습니다vue-devtools는 vuex를 사용합니다.컴포넌트의 데이터가 마법처럼 변화한다고 가정해 보겠습니다.가 하다, 하다, 하다, 하다, 이런 걸 했기 이죠.setInterval(() => $root.setDataTime( 시각 ${은(는) ${Date.now()}), 1000)변경 내용을 확인해도 vuex나 컴포넌트에는 커밋이 없습니다.

언급URL : https://stackoverflow.com/questions/57105601/what-is-the-disadvantage-of-using-this-root-in-vue-components

반응형