created() 完成后启动 watcher

Question

我的目标是在创建组件时最初设置数据属性，然后在此属性上设置观察者。我正在努力解决的问题是观察者在创建的方法中捕获初始属性更改，但这不是我想要的。我宁愿只在属性 在 created() 中进行初始更改后 观看数据。

export default {
 name: 'testComponent',

 data() {
  return {
   testValue: 1;
  }
 },

 watch: {
  testValue() {
   console.log('watcher catches!');
  },

 created() {
   console.log(this.testValue);
   this.testValue = 2;
   console.log(this.testValue);
 }
}

// CONSOLE OUTPUT:  1 -> watcher catches! -> 2

你能告诉我如何实现这样的行为吗？

Answer 1

不知道你为什么想要那个，但你可以简单地这样做：

export default {
 name: 'testComponent',

 data() {
  return {
   ready: false,
   testValue: 1
  }
 },

 watch: {
  testValue() {
   if (!this.ready) return;
   console.log('watcher catches!');
  },

 created() {
   this.testValue = 2;
   this.ready = true;
 }
}

created() 完成后启动 watcher

Start watcher after created() is done

vue.js

vue-component

vuejs3