mixins 將兩個(gè)的對(duì)象的混合為一個(gè)數(shù)組，彼此都可以被調(diào)用,下面為演示代碼及其結(jié)果

ps:當(dāng)對(duì)象鍵值對(duì) 鍵名沖突時(shí)，保留非mixin對(duì)象的鍵值對(duì)

<div id="app"></div> <script> var myMixin={ template:'<h1>holle mixin</h1>', methods:{ hello:function(){ console.log('this is mixin') }, say:function(){ console.log('I am mixin') } } }; var Component=Vue.extend({ mixins:[myMixin], methods:{ lsit:function(){ console.log('I am lsit') }, say:function(){ console.log('I am not mixin say') } } }); var newcom=new Component().$mount('#app') newcom.hello(); newcom.lsit(); newcom.say(); </script>

全局的混合

<div id="app"></div> <script> Vue.mixin({ created:function(){ this.hello() }, methods:{ hello:function(){ console.log('this is mixin') }, say:function(){ console.log('I am mixin') } } }); var app=new Vue({ el:"#app", methods:{ lsit:function(){ console.log('I am lsit') }, say:function(){ console.log('I am mixin say') } } }); app.hello(); app.lsit(); app.say(); </script>

比如項(xiàng)目中多處的view層使用到下拉刷新以及自動(dòng)加載功能，處理這些相同的邏輯，每一個(gè)view層都要寫一遍是浪費(fèi)生命的。這種情況就很適合使用mixin。

轉(zhuǎn)載于:https://www.cnblogs.com/jeremy123/p/7575978.html

總結(jié)

以上是生活随笔為你收集整理的mixin使用场景的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。