Vue在进行数值/对象等复杂数据类型的深度侦听时，如果不稍加处理，深度侦听的新旧值会一模一样，影响有些业务的处理。
在上一篇博客中我已经把场景阐述清楚了，这期就只写处理办法，沿用上期代码。
只需要添加一个计算属性即可。

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

html" title=javascript>javascript">  <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>

只是给大家提供一个解决的办法，确实在有些场景下必须用到旧值进行一些处理。
如果不是一定要用的旧值，不要随便这样处理，这样会强行破坏原型链，而且多添加一步计算属性也会影响性能。

没看懂干嘛的可以看一下上期的博客，上期留了一个小问题，因为篇幅较长了，就单独发了一期解决办法。

有微信小程序课设、毕设需求联系个人QQ：505417246

关注下面微信公众号，可以领取微信小程序、Vue、TypeScript、前端、uni-app、全栈、Nodejs、Python等实战学习资料
最新最全的前端知识总结和项目源码都会第一时间发布到微信公众号，请大家多多关注，谢谢！