我有自己改变数据的方法,简单的例子:
Vue.component('component', {
template: '#component',
data: function () {
return {
dataToBeWatched: ''
}
},
methods: {
change: function (e) {
var that = this;
setTimeOut(function() {
that.dataToBeWatched = 'data changed';
}, 2000);
},
makeSmthWhenDataChanged: function () {
// ajax request when dataToBeWatched changed or when dataToBeWatched isn't empty
}
}
});
如何使用正确的方法 vue js 创建这样的观察者? 或者我需要使用 Prop 在组件中观看它?
最佳答案
Vue 组件可以有一个 watch
属性,它是一个对象。对象的键需要是需要监视的prop或数据的名称,值是数据变化时调用的函数。
https://v2.vuejs.org/v2/guide/computed.html#Computed-vs-Watched-Property
Vue.component('component', {
template: '#component',
data: function () {
return {
dataToBeWatched: ''
}
},
methods: {
change: function (e) {
var that = this;
setTimeOut(function() {
that.dataToBeWatched = 'data changed';
}, 2000);
},
makeSmthWhenDataChanged: function () {
// ajax request when dataToBeWatched changed or when dataToBeWatched isn't empty
}
},
watch: {
dataToBeWatched: function(val) {
//do something when the data changes.
if (val) {
this.makeSmthWhenDataChanged();
}
}
}
});
关于javascript - 如何使用vue js自行检查组件中数据何时发生变化?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47801200/