Question

每次在Vue.js中（重新）附加<canvas>元素后，如何触发函数？

模板：

<div class="article" v-if="displayArticle">
    [...]
    <div v-if="sample">
        <canvas></canvas>
    </div>
</div>

我希望每次移除canvas元素然后从DOM重新悬浮时触发特定函数，例如当sample变量设置为 false 然后再< em> true ，我想调用一个特定的函数来绘制画布上的东西。

Answer 1

在sample上创建一个观察者。例如：

export default {
  el: '#yourEl',
  data() {
    return {
      sample: false,
      /* other vm data properties */
    }
  },
  watch: {
    sample(newVal, oldVal) {
      /* code that is executed whenever sample changes 
         the current value of sample gets passed in newVal, 
         the value it had before the change occurred comes in as oldVal
      */
    }
  }
}

观察程序只是watch实例的Vue属性中的命名函数。按照惯例，它使用与监视属性相同的名称。

参考：

https://vuejs.org/v2/guide/computed.html#Watchers

每次附加特定元素时，Vue.js触发函数

1 个答案: