更新時間:2022-02-11 來源:黑馬程序員 瀏覽量:
mixins是一種分發(fā)Vue組件中可復(fù)用功能的方式。mixins對象可以包含任何組件選項,當組件使用mixins時,將定義的mixins對象引人組件中即可使用,mixins中的所有選項將會混入到組件自己的選項中。下面我們通過例3-16進行演示。
【例3-16 】
(1)創(chuàng)建C:\vuelchapter03\demo16.html文件,具體代碼如下:
<script> // 定義myMixin對象 var myMixin = { created () { this.hello() }, methods: { hello () { console.log( 'hello from mixin!') } } } var Component = Vue.extend({ mixins: [myMixin] }) var component = new Component() </script>
在上述代碼中,組件中的mixins屬性用來配置組件選項,其值為自定義選項。第13行通過Vue.extend()創(chuàng)建實例構(gòu)造器Component;第14行將自定義的myMixin對象混入到Component中;第16行通過new方式完成組件實例化。