vue中的mixins(混入)使用場景介紹

什麼是mixins(混入)?
mixins是對vue組件的一種擴展,將一些公用的常用數據或者方法,構建一個可被混入的數據結構,被不同的vue組件進行合併,就可以在不同的vue組件中使用相同的方法或者基礎數據。

稍微有點理解vue混入的同學,可能會感到困惑,mixins和vue的公共組件或者vuex很相似。

mixins和vuex的區別。
vuex公共狀態管理,在一個組件被引入後,如果該組件改變了vuex裏面的數據狀態,其他引入vuex數據的組件也會對應修改,所有的vue組件應用的都是同一份vuex數據。(在js中,有點類似於淺拷貝)
vue引入mixins數據,mixins數據或方法,在每一個組件中都是獨立的,互不干擾的,都屬於vue組件自身。(在js中,有點類似於深度拷貝)

mixins和公共組件的區別
通用的數據和方法,確實可以提出一個通用的組件,由父子組件傳參的形式進行分享公用。

公共組件
父組件通過props接收來自子組件(公共組件)的參數或者方法,但vue不建議,父組件直接修改props接收到的子組件的數據。需要在父組件的data中或者computed中定義一個字段來接收。(有點麻煩)
公共組件最主要的作用還是複用相同的vue組件(有視圖,有方法,有狀態
)。

mixins
如果只是提取公用的數據或者通用的方法,並且這些數據或者方法,不需要組件間進行維護,就可以使用mixins。(類似於js中封裝的一些公用的方法)

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章