Vue.jsの$ eventまたは$ parentを持つ親のデータを操作する

Question

Vue.jsの新機能は、$ parentを使用して親コンポーネントの配列を操作することになりました。

setTitle(title) { 
     this.$parent.items[this.index].name = title; 
     this.editTitle = false; 
} 

代わりの$発するとイベントを放出した後、親にそのためのリスニング：このようにそれをやってで、いくつかの危険性がある場合、私はちょうど思ったんだけど？

これは将来どのような方法で私を焼くことができますか？

私が見たことがないのは、私が出会ったチュートリアルの最初の解決策のように思えたからです。

Answer 1

親を通して子を操作するのと同様に、子を介して親を操作するにはいくつかの危険があります。主な問題は、コードを再利用すると、システム内の別のオブジェクトを操作するコードを削除または変更する必要がある場合、責任と結合の分離につながる傾向があります。

イベントを発行し、親に更新情報を処理させることで、項目を更新する必要のない親がそのイベントを無視することができるため、オブジェクトを修正せずに複数の場所で再利用することができます。

また、配列が更​​新されるのを見るかもしれないが、それを更新する親オブジェクトのコードは見えないので、コードを維持するのが難しくなります。あなたの例では見つけるのは難しくないかもしれませんが、プログラムがより複雑になると、発見したり更新したりデバッグするのに時間がかかることがあります。