业务场景,逻辑在子组件中,子组件的数据变化必须传递给父组件。只是在初始化的时候,父组件必须传递一个初始状态给子组件(异步传入),子组件进行一次状态改变。在这种情况下,只需要第一次初始化状态(执行状态改变),之后,子组件的状态改变被提交给父组件。提交后,父子组件状态一致,无需手动进行状态更改。因此,只需要监听第一次数据变化,手动执行状态变化逻辑即可。最基本的手表实现如下exportdefault{data:{isDone:false,needWatch:"string",},watch:{needWatch(val){if(!isDone){//处理业务逻辑//然后改变isDone的状态this.isDone=true;}},},};上述做法的思路是将isDone作为标志。倾听者永远存在。如果完成,业务逻辑将不再在手表中执行。上面的方式(声明式监听)虽然实现了功能,但是监听器始终存在。下面使用命令式监控,只监控一处数据变化,数据变化后取消监控。exportdefault{data:{needWatch:"string",},mounted(){constunwatch=this.$watch("needWatch",function(val){//处理业务逻辑//然后调用unwatch,unwatchunwatch();});},};正文到此为止。补充:简单介绍一下declarativewatch的语法。vm.$watch(expOrFn,callback,[options])第一个参数是被监控的变量或函数。第二个参数是回调函数,业务逻辑要写在回调函数中。第三个参数是配置项,可选。配置项:{immediate:true,deep:true}vm.$watch()返回一个unwatch函数,执行unwatch可以取消监听。需要注意的是,如果options中开启了immediate:true,那么第一次回调时不能取消给定属性的监听,否则会报错。(以下写法会报错)this.$watch(needWatch,function(val){doSomething()unwatch()},{immediate:true})同步更新到自己的语雀https://www.yuque.com/迪拉克...
