日常
1、监听路由
watch:{"$route":funtion(to,form){// to: 代表当前界面的路径信息, from: 代表要去往的界面的地址信息if(to.path === '/XXX/XX'){// 你所期望的操作}}
}
2、监听数据变化
watch:{"name" | name: (val)=>{// 需要进行的操作,比如数据的变化immediate: true //表示在watch监听中首次进行数据绑定的时候是否立即执行一边的handler函数,如果值为true,则表示立即监听,如果值为false,则表示只有在数据发生变化的时候才进行监听deep:true //开启深度监听 因为vue不能够检测到对象属性的添加或者删除 }
}watch:{"name": function(val){// 进行数据的操作,监听到数据变化之后,进行的操作}
}unWatch(); // 手动注销watch
为什么要注销 watch?因为我们的组件是经常要被销毁的,比如我们跳一个路由,从一个页面跳到另外一个页面,那么原来的页面的 watch 其实就没用了,这时候我们应该注销掉原来页面的 watch 的,不然的话可能会导致内置溢出。
目前接触的就只有这两个,以后在遇到新的会及时更新 !
日常
1、监听路由
watch:{"$route":funtion(to,form){// to: 代表当前界面的路径信息, from: 代表要去往的界面的地址信息if(to.path === '/XXX/XX'){// 你所期望的操作}}
}
2、监听数据变化
watch:{"name" | name: (val)=>{// 需要进行的操作,比如数据的变化immediate: true //表示在watch监听中首次进行数据绑定的时候是否立即执行一边的handler函数,如果值为true,则表示立即监听,如果值为false,则表示只有在数据发生变化的时候才进行监听deep:true //开启深度监听 因为vue不能够检测到对象属性的添加或者删除 }
}watch:{"name": function(val){// 进行数据的操作,监听到数据变化之后,进行的操作}
}unWatch(); // 手动注销watch
为什么要注销 watch?因为我们的组件是经常要被销毁的,比如我们跳一个路由,从一个页面跳到另外一个页面,那么原来的页面的 watch 其实就没用了,这时候我们应该注销掉原来页面的 watch 的,不然的话可能会导致内置溢出。
目前接触的就只有这两个,以后在遇到新的会及时更新 !