私はそれ自体でデータを変更するメソッドを持っています、簡単な例:
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?または、コンポーネントでウォッチするプロップを使用する必要がありますか?
Vueコンポーネントは、オブジェクトであるwatch
プロパティを持つことができます。オブジェクトキーは、監視する必要がある小道具またはデータの名前である必要があり、値は、データが変更されたときに呼び出される関数です。
https://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();
}
}
}
});