SOURCE

Vue.prototype.outterCount = 0
const app = new Vue({
  el:"#app",
  data:{
    firstName:"弗拉基米尔",
    middleName:"伊里奇",
    lastName:"乌里扬诺夫",
    //methodsCount: 0,
    computedCount: 0
  },
  methods:{
    getFullName:function(){
      //this.methodsCount += 1 在html页面中。methods修改data中的变量，会导致页面卡死。
      this.outterCount += 1
      return this.firstName + "·" + this.middleName + "·" + this.lastName
    }
  },
  computed:{
    fullName:function(){
      this.computedCount += 1 
      return this.firstName + "·" + this.middleName + "·" + this.lastName
    }
  }
})

<div id="app">
  <div>methods方法：{{getFullName()}}</div>
  <div>methods方法：{{getFullName()}}</div>
  <div>'methods方法调用2次，运行了' + {{outterCount}} + '次。'</div>
  <br />
  <div>computed计算属性fullName：{{fullName}}</div>
  <div>computed计算属性fullName：{{fullName}}</div>
  <div>'computed计算属性调用2次，运行了' + {{computedCount}} + '次。'</div>
</div>

#app{color:#fff}