Über „Requisiten sollten nicht innerhalb untergeordneter Komponenten geändert werden“

Question

Offizielle Dokumentation besagt, dass Requisiten nicht innerhalb untergeordneter Komponenten geändert werden sollten

Vue.component('todo-list',{
    props:['msg'],
    template:'<li>{{msg.text}}<button @click="fun">click</button></li>',
    methods:{
        fun:function(){
            alert(this.msg.text='芒果');
        }
    }
});
        
new Vue({
    el:'#app',
    data:{
        grocery:[
            {text:'苹果'},
            {text:'香蕉'},
            {text:'菠萝'}
        ]
    }
});

<p id="app">
    <ol>
        <todo-list v-for="(item,index) in grocery" key="index" :msg="item"></todo-list>
    </ol>
</p>

Ich weiß nicht, ob ich die Requisite innerhalb der Unterkomponente so ändere? Es wurde jedenfalls kein Fehler gemeldet.
Was meinst du also mit dem Ändern von Requisiten innerhalb einer Unterkomponente?

---

Manche Leute sagen, dass der Wert der übergeordneten Komponente nicht geändert wird

Vue.component('todo-list',{
    props:['msg'],
    template:'<li @click="funn">{{msg.text}}<button @click.stop="fun">click</button></li>',
    methods:{
        fun:function(){
            alert(this.msg.text='芒果');
        },
        funn:function(n){
            alert(this.msg.text);
        }
    }
});

Ich werde immer verwirrter, hat sich das nicht geändert? Bitte erläutern Sie die konkreten Punkte

Answer 1

算是修改父组件的数据，可以用在一些不想写 $emit 的场合

官方不严格反对这种方式

Answer 2

父组件里面的item并不会改变。。。改msg意义何在？
如果能再调用的情况下。。。下次调用msg还是会等于item

Answer 3

Answer 4

只是个表象而已，原来传入的item值没有任何变化。在vue1.0中可以用dispatch进行传值去改变item的值和状态