更新时间:2022-02-11 来源:黑马程序员 浏览量:
mixins是一种分发Vue组件中可复用功能的方式。mixins对象可以包含任何组件选项,当组件使用mixins时,将定义的mixins对象引人组件中即可使用,mixins中的所有选项将会混入到组件自己的选项中。下面我们通过例3-16进行演示。
【例3-16 】
(1)创建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()创建实例构造器Component;第14行将自定义的myMixin对象混入到Component中;第16行通过new方式完成组件实例化。