vue watch handler

作者：寂寞带点伤发布日期:2025-02-20 浏览:52

// Vue 2 示例代码

new Vue({
  el: '#app',
  data: {
    message: 'Hello Vue!'
  },
  watch: {
    // 监听 message 的变化
    message: function (newVal, oldVal) {
      console.log('新的值为:', newVal);
      console.log('旧的值为:', oldVal);
      // 在这里可以执行其他逻辑，比如更新 DOM 或发送网络请求等
    }
  }
});

// 解释说明：
// 在 Vue 中，`watch` 选项用于观察和响应 Vue 实例上的数据变动。上面的代码展示了如何监听 `message` 属性的变化。
// 当 `message` 发生变化时，会触发相应的 handler 函数，并传入新值和旧值作为参数。
// 这种方式非常适合处理异步操作或开销较大的计算任务，避免在 `computed` 计算属性中进行复杂运算。

上一篇：vue引入字体

下一篇：vue query传参