vue中计算属性和侦听属性

计算属性
compute是多个输入一个输出。计算属性和方法不同的是计算属性会有缓存,当计算属性里面的变量不发生变化就会调用缓存而不是在执行一遍,例子:当你的table有一列工资。该列对应的值就可以是endSalary。

var vm = new Vue({
  el: '#demo',
  data: {
    basicSalary: 2000,
    tax: 200
  },
  computed: {
    endSalary: function () {
      return this.basicSalary  -  this.tax;
    }
  }
})

侦听属性
watch 当侦听的属性firstName发生变化,其 侦听属性对应的方法就会执行,对应的fullName也会发生变化。

var vm = new Vue({
  el: '#demo',
  data: {
    firstName: 'Foo',
    lastName: 'Bar',
    fullName: 'Foo Bar'
  },
  watch: {
    firstName: function (val) {
      this.fullName = val + ' ' + this.lastName
    },
    lastName: function (val) {
      this.fullName = this.firstName + ' ' + val
    }
  }
})
发布了7 篇原创文章 · 获赞 2 · 访问量 220
展开阅读全文

没有更多推荐了,返回首页

©️2019 CSDN 皮肤主题: 大白 设计师: CSDN官方博客

分享到微信朋友圈

×

扫一扫,手机浏览