vue2에서component 부자 구성 요소 전달 데이터props 사용

하위 구성 요소는 아버지께서 보내신 데이터를 사용합니다. 하위 구성 요소의props 옵션을 통과해야 합니다.
구성 요소 실례의 역할 영역은 고립되어 있습니다. 하위 구성 요소의 템플릿에서 부모 구성 요소의 데이터를 직접 인용할 수 없습니다.아버지가 보내주신 프로포즈 데이터를 수정할 때 아버지는 반드시 대상을 전달해야 합니다. 그렇지 않으면 수정할 수 없습니다.
지금은 전달 대상의 문법 앱입니다.vue(상위 어셈블리):

<span style="color:#000000;">
    import zujian from </span>'./components/zujian.vue'<span style="color:#000000;">
    export </span><span style="color:#0000ff;">default</span><span style="color:#000000;">{
        data(){
            </span><span style="color:#0000ff;">return</span><span style="color:#000000;">{
               <span style="color:#ff0000;"> data:{
                    a:</span></span><span style="color:#ff0000;">1</span><span style="color:#000000;"><span style="color:#ff0000;">
                }</span>
            }
        },
        components:{
            <span style="color:#ff0000;">zujian</span>
        }
    }
</span>

zujian.vue(서브어셈블리):

<span style="color:#000000;">
    export </span><span style="color:#0000ff;">default</span><span style="color:#000000;">{
       <strong><span style="color:#ff0000;"> props:[</span></strong></span><strong><span style="color:#ff0000;">"data"</span></strong><span style="color:#000000;"><strong><span style="color:#ff0000;">], //    （ ）</span></strong>
        data(){
            </span><span style="color:#0000ff;">return</span><span style="color:#000000;">{
                 
            }
        },
        methods:{
            <span style="color:#ff0000;">jia(){
                console.log(</span></span><span style="color:#ff0000;">this.data);
                this.data.a++；</span><span style="color:#000000;"><span style="color:#ff0000;">
            }</span>
        }
    }
</span>

 
전재 대상:https://www.cnblogs.com/lxy1123/p/7172255.html