Vue x 筆記 x 速查表(更新中~)

Post Directory

Vue 感覺猛猛Der

原本想寫篇 Vue 系列筆記,不過中文文件太詳細啦(廢話~)

再加上小弟文筆不好,筆記做到最後都快變成全抄了 ╮(╯_╰)╭

所以以語法速查的方法來寫啦!!

因為也還在學習中,所以這篇先發上來,再慢慢補齊 XD

var vm = new Vue({
  el: '#example',
  data: {
    message: 'Hello'
  },
  // Method
  Method: {
    myPrint: function() {
      console.log('message is: ' + this.message)
    }
  },
  // 生命週期呼叫函式,mounted、 updated 、destroyed
  created: function () {  
    // `this` 指向 vm 实例
    console.log('message is: ' + this.message)
  },
  // 過濾器,可以對 mustache 插值和 v-bind 表達式過濾
  filters: {
    capitalize: function (value) {
      if (!value) return '';
      value = value.toString();
      return value.charAt(0).toUpperCase() + value.slice(1);
    }
  }
  // 計算屬性,跟 Method 相比多了快取
  computed: {
    reversedMessage: function () {
      // `this` points to the vm instance
      return this.message.split('').reverse().join('');
    }
  }
  // 監聽,適用於在數據變化時執行非同步,或執行較長的操作
  watch: {
    // 如果 question 发生改变,这个函数就会运行
    question: function (newQuestion) {
      this.answer = 'Waiting for you to stop typing...'
      this.getAnswer()
    }
  },
})
Tweet