Vue重要知識小結

vue

• sync修飾 （1）雙向數據綁定，父子組件之間信息的交互

  1⃣️在自組件中使用this.emmit('toFather'),子組件產生一個tofather事件，而後在父組件中經過@進行監聽，那麼能夠實現通訊過程  2⃣️使用簡單的方式傳遞，如上圖中emmit(update:title),而後在v-bind:title.sync='title',從而實現雙向數據綁定

  （2）雙向數據綁定，使用v-model

  經過在自組件中使用model 定義 prop event ，從而能夠實現父子組件之間經過v-model實現通訊，或者不定義model ，使用默認的的prop：value，enent：input

• keep-alive <keep-alive><My-component /> <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')
    }
  }
})