Vue重要知識小結

vue

sync修飾（1）雙向資料繫結，父子元件之間資訊的互動

1⃣️在自元件中使用this.emmit('toFather'),子元件產生一個tofather事件，然後在父元件中通過@進行監聽，那麼可以實現通訊過程 2⃣️使用簡單的方式傳遞，如上圖中emmit(utate:title),然後在v-bind:title.sync='title',從而實現雙向資料繫結

（2）雙向資料繫結，使用v-model

通過在自元件中使用model 定義 prop event ，從而可以實現父子元件之間通過v-model實現通訊，或者不定義model ，使用預設的的prop：value，enent：input
keep-alive 可以實現快取
作用域插槽這個其實就是可以使用自元件中的資料，使用slot-scope接受自元件中的資料
自元件訪問父級元件 1⃣️ let father = this.$parent 2⃣️通過依賴注入
計算屬性剛開始在學習計算屬性的時候，一直預設的認為是一個函式，但是在呼叫的時候，是不用加（）的，這樣的話，在認為是一個函式就不對了，其實就是類似於 data中的資料，只不過會有快取和更新。例如使用的時候直接{{computed}},通俗的說，可以單純的將它作為一個data值
method方法呼叫方法的時候，如果不傳遞值的話，那麼可以不用加入（）
混入 minxins

自定義指令通過Vue.directive(name,{}) Vuex

三部分構成 state actions mutations
state 此部分存放資料，可以通過mapStated獲取到資料。
actions 可以使用非同步，通過this.$store.dispathc()觸發
mutatios

mutatios 必須是同步，通過this.emmit()觸發
步驟：

Vue.use(Vuex)
 
const store = new Vuex.Store({
  state: { //前端全棧交流學習圈：886109386
    count: //針對一到五年前端開發人員
  },        //幫助突破技術瓶頸，提升思維能力。
  mutations: {
    increment (state) {
      state.count++
    }
  },
  actions: {
    increment (context) {
      context.commit('increment')
    }
  }
})
複製程式碼

Vue重要知識小結

相關文章