vue侦听器watcher的immediate选项
比较常见的场景,在初始化钩子中需要执行一段方法,当数据变动时,需要再次执行这个方法,例如搜索功能。
export default {
data() {
return {
input: ""
};
},
created() {
this.getSearchResults();
},
methods: {
getSearchResults() {
// handle search
}
},
watch: {
input() {
this.getSearchResults();
}
}
};
虽然可以实现功能,其实可以更精简。
vue 的 watcher 中可以指定immediate: true
选项,表示组件创建时立即执行。那么,可以对 watcher 进行改写。
watch: {
input: {
handler() {
this.getSearchResults();
},
immediate: true,
}
}
这时,就不需要在created
钩子中再次调用了。
如果您觉得本文对您有用,欢迎捐赠或留言~
- 本博客所有文章除特别声明外,均可转载和分享,转载请注明出处!
- 本文地址:https://www.leevii.com/?p=1787