vue中methods，computed,watch方法的區別

vue中mothods，computed,watch方法的區別

對於一些須要變更的值，好比最初的時候有一個值，在以後咱們要將他進行改變。
可選的思路：
1.經過change或者click等這類事件來觸發一個函數，在函數內部去修改一個變量。
2.經過watch的方法，監聽被改變的變量，而後在watch的那個變量命名的函數中去對咱們要修改的值進行從新的賦值，或者是觸發一次更新。
3.使用computed的方法，監聽一個變量，經過return一個新的變量的方式來更新一個變量的數據。

執行的不一樣點

1.methods的方法是經過觸發一個事件或者函數的回調來實現數據的更新，他的執行，依賴於事件的觸發。
2.watch的相似於emit與on這種觸發的方式，經過vue的$watch實例監聽值得改變來自動的觸發一個函數的執行。
3.computed函數的執行最快也是執行最靠前的，在html渲染開始，就已經執行了。

應用場景

methods事件的觸發就不說了，直接回調或者是綁定的@這樣的事件來觸發。
而watch的觸發消耗也大，每次數據的改變就要觸發一次函數的執行，要節省着點用啊。
computed用在改變一個變量的顯示，和data對象裏的數據屬性是同一類的。返回的值直接就修改掉了原先的值，最大的優勢在於簡潔速度快也能夠做爲一個過濾器用也能夠起到data中聲明一個變量的做用，依賴別的變量來顯示新的變量。

<p>Computed reversed message: "{{ reversedMessage }}"</p>
<p>Computed reversed message: "{{message.split('').reverse().join('')}}"</p> 
 var vm = new Vue({
  el: '#example',
  data: {
      message: 'Hello'
         },
  computed: {
  reversedMessage: function () {
        //代替上邊的模板的表達式
       return this.message.split('').reverse().join('')
  }}})