Vueがディープリスニングを実行するときに古い値と新しい値が同じであるという問題を解決するにはどうすればよいですか？

Vueが値/オブジェクトなどの複雑なデータ型の詳細なインターセプトを実行しているときに、それを少し処理しないと、詳細なインターセプトの古い値と新しい値がまったく同じになり、の処理に影響しますいくつかの事業。
前回のブログでは、シーンを明確に説明しましたが、今回は処理方法のみを記述し、引き続き前回のコードを使用します。
計算された属性を追加するだけで済みます。

<div id="app">
    <h3>{
   
   {computedObj}}</h3>
    <button @click='obj[0].name = "CreatorRay" '>改变</button>
</div>

  <script>
        var app = new Vue({
    
    
            el:'#app',
            data:{
    
    
                obj:[{
    
    name:'Ray'}]
            },
            computed: {
    
    
                computedObj:function(){
    
    
                    return this.obj[0].name;
                }
            },
            watch:{
    
    
                'computedObj':{
    
    
                    deep:true,
                    handler(newV,oldV){
    
    
                        console.log('newV',newV);
                        console.log('oldV',oldV);
                        
                    },

                }
            }
        });
    </script>

解決策を提供するためだけに、一部のシナリオでは、一部の処理に古い値を使用する必要があります。
使用する必要があるのが古い値でない場合は、気軽に処理しないでください。プロトタイプチェーンが強制的に切断され、計算属性をもう1つ追加するとパフォーマンスにも影響します。

理由がわからない場合は、前号のブログをご覧ください。前号に小さな問題がありました。スペースが長いため、別号を掲載しました。

WeChatミニプログラムコースのデザイン、完全なデザインのニーズがあります。個人のQQに連絡してください：505417246

次のWeChatパブリックアカウントに注意してください。WeChatアプレット、Vue、TypeScript、フロントエンド、ユニアプリ、フルスタック、Nodejs、Python、その他の実用的な学習資料を受け取ることができます。
最新かつ最も完全なフロントエンドの知識の概要とプロジェクトのソースコードは、できるだけ早くWeChatに公開されます。いいえ、ご注意ください。ありがとうございます。