vue 하위 구성 요소 watch 에서 prop 의 해결 을 듣 지 못 합 니 다.

1584 단어 vue하위 구성 요소watch감청 하 다prop
문제 설명
vue 프로젝트 에서 부모 구성 요소 가 prop 을 통 해 하위 구성 요소 에 값 을 전달 할 때 prop 값 이 서버 에서 가 져 오 면 부모 구성 요소 가 하위 구성 요소 에 기본 값(서버 데이터 가 제때에 가 져 오지 않 았 음)을 전달 할 수 있 습 니 다.그러면 우 리 는 실시 간 으로 이 prop 값 을 watch 해 야 합 니 다.prop 값 이 업데이트 되면 즉시 하위 구성 요소 의 업 데 이 트 를 알 립 니 다.
해결 방안

watch: {
  levelDetail: {
   immediate: true, //    ！！！
   handler (val) {
    this.levelPersonal = !val ? {} : val
    // console.log('action Value:', val, this.levelPersonal)
   }
  }
 },
공식 문서
vue-watch 참고 문서
추가 지식:vue 부모 구성 요소 props 파라미터 가 너무 클 때 하위 구성 요소 created 에서 데 이 터 를 찾 을 수 없습니다-해결 방법
질문:
부모 구성 요소 호출 하위 구성 요소:

그 중의 formList 데 이 터 는 ajax 로 호출 되 었 습 니 다.데이터 가 비교적 크 고 지연 되 었 을 것 입 니 다.
하위 구성 요소 의 created 에서 props 를 호출 할 때 기본 데 이 터 를 출력 합 니 다:

출력:

해결 방법:
첫 번 째:v-if 를 더 해서 데 이 터 를 불 러 오 는 것 이 완 료 된 것 이 라 고 판단 하고 불 러 오 면 렌 더 링 합 니 다.

두 번 째:setTimeout 으로 지연 시 키 지만 이런 방법 은 정확 하지 않 으 므 로 상황 에 따라 사용 해 야 한다.
사실 두 가지 방법 은 모두 상황 에 따라 사용 해 야 한다.
이상 의 vue 서브 구성 요소 watch 가 prop 의 해결 을 듣 지 못 하 는 것 은 바로 편집장 이 여러분 에 게 공유 한 모든 내용 입 니 다.여러분 께 참고 가 되 고 저 희 를 많이 사랑 해 주 셨 으 면 좋 겠 습 니 다.
js 윤 방도 효과 순수 js 이미지 자동 전환 실현
C\#중 Public,private,protect 의 차이 점 에 대한 설명

좋은 웹페이지 즐겨찾기

개발자 우수 사이트 수집

개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다
best100-homepage