VUE----混入

vue存在一个叫做混入的东西,官方文档给的解释是:
混入 (mixin) 提供了一种非常灵活的方式,来分发 Vue 组件中的可复用功能。一个混入对象可以包含任意组件选项。当组件使用混入对象时,所有混入对象的选项将被“混合”进入该组件本身的选项
我对它的理解是继承,就像extends一样,只不过vue在组件中使用关键字mixins,所以我就用继承的特点来理解混入

1.子类可以使用父类的属性或方法:

组件的“父类”中定义一个data、methods、computed等,只要组件中混入了这个父类,那么就可以在组件中使用父类相应的方法或属性

2.子类将会覆盖父类的同名属性或方法:

组件中定义一个方法,然而它混入的“父类”中已经定义了这个方法,那么子类将会覆盖“父类”的这个方法,这个就像css中定义了一个class但是在元素上又定义了一个style,那么style中的属性将会覆盖class中的同名属性

3.子类的构造函数和父类的构造函数都会触发

在组件中有个很重要的东西叫做钩子函数,这个就像类中的构造函数,子类和父类中都有构造函数,当调用这个子类时,子类的构造函数和父类的构造函数就都会触发,并且父类的构造函数将会在子类的构造函数之前触发。

4.类的基类

假如所有的组件中都需要某个方法或数值,那么我们在所有的组件中都混入会不会感觉很繁琐?这个时候我们可以使用全局混入

Vue.mixin({
    methods or data
})

它就像定义了一个基类,然后我们所有使用的类都默认继承于它,这样就不用再一次次的重复引入。

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

友情链接更多精彩内容