vue 데이터에 값이 있지만 페이지 {}} 값을 찾을 수 없습니다.

나의 문제는 js가 도입한 순서가 틀려서 vue의 값을 정상적으로 표시할 수 없다는 것이다
정확한 순서는 다음과 같다.
먼저 vue의 js-----html 코드-----마지막으로 자신이 쓴 js를 도입한다
보충 지식: vue 하위 구성 요소의created,mounted 생명주기 갈고리에서props의 값을 얻지 못하는 문제
상위 어셈블리 통신
이것은 매우 간단합니다. 부모 구성 요소에서 v-bind 귀속 전송을 사용하고 하위 구성 요소는props로 수신하면 됩니다.
예: 상위 어셈블리에서

<template>
 <div>
  <div :Data="Data"></div>
 </div>
</template>

<script>
 data(){
   return {
    Data: [10,20,30]
   }
  },
</script>

서브어셈블리:

export default{
 props:{
 type:Array,
 default(){
 return []
 }
 }
}

이 경우 당신의 데이터 값은 고정되어 있습니다. 하위 구성 요소의 methods에서props의 값을 찾으려면this를 사용하십시오.chartData만 있으면 됩니다.
그러나 어떤 경우, 당신의 데이터 안의 값은 고정된 것이 아니라 동적으로 얻어진 것입니다. 이런 경우, methods에서 당신의 데이터를 찾을 수 없거나 기본값을 찾을 수 없습니다.
해결 방법:
이런 경우 저는 watch로 처리합니다.
데이터의 값을 감청하면 비어 있을 때 촉발됩니다. 이때 찾을 수 있습니다. 값을 받은 후에 처리해야 할 처리 방법도watch에서 실행해야 합니다.

export default {
 props: ['Data'],
  data(){
   return {
    cData: []
   }
  },
  watch: {
   //  Data    
   chartData: function(newVal,oldVal){
    this.cData = newVal; //newVal chartData
    newVa l&& this.draw(); //newVal draw 
   }
  },
  methods: {
   draw(){
    // 
   }
  },
　　　　　
  mounted() {
   // created、mounted ,   this.Data ,  
  }
 }

//요약
이러한 상황이 발생하는 이유는 부모 구성 요소에서 전달될props 속성은 aax 요청이 발생하면서 돌아오는 것이기 때문에 요청한 이 과정은 시간이 필요하지만 하위 구성 요소의 렌더링은 aax 요청 과정보다 빠르기 때문에 이때created,mounted 같은 것은 한 번만 실행되는 생명주기 갈고리입니다. 이미 실행되었지만 props가 아직 들어오지 않았기 때문에 기본값만 받을 수 있습니다.
이상의 이 vue 데이터는 값이 있지만 페이지 {{}}에서 값을 찾을 수 없는 해결은 바로 편집자가 여러분에게 공유한 모든 내용입니다. 여러분에게 참고가 되고 저희를 많이 사랑해 주십시오.