（7）打鸡儿教你Vue.js

计算属性
computed

<div id="app">  {{ message.split('').reverse().join('') }}</div>

计算属性的实例：

<div id="app">  <p>{{ message }}</p>  <p>{{ reversedMessage }}</p></div> <script>var vm = new Vue({  el: '#app',  data: {    message: 'dashu!'  },  computed: {    reversedMessage: function () {      return this.message.split('').reverse().join('')    }  }})</script>

methods: {  reversedMessage2: function () {    return this.message.split('').reverse().join('')  }}

var vm = new Vue({  el: '#app',  data: {    name: 'Google',    url: 'http://www.google.com'  },  computed: {    site: {      // getter      get: function () {        return this.name + ' ' + this.url      },      // setter      set: function (newValue) {        var names = newValue.split(' ')        this.name = names[0]        this.url = names[names.length - 1]      }    }  }})

computer 属性“依赖缓存”的概念
method 的概念

有缓存，不会发生改变，于是界面渲染就直接用这个值，不再重复执行代码

没有缓存，只需用一次，函数代码就执行一次

请点赞！由于你的鼓励是我写作的最大动力！

官方微信公众号

吹逼交流群：711613774

吹逼交流群