您好,欢迎访问一九零五行业门户网

vue.js什么是混入

vue.js混入是定义了一部分可复用的方法或者计算属性,混入对象可以包含任意组件选项,当组件使用混入对象时,所有混入对象的选项将被混入该组件本身的选项。
本教程操作环境:windows10系统、vue2.4.2,本文适用于所有品牌的电脑。
【相关文章推荐:vue.js】
混入 (mixins)定义了一部分可复用的方法或者计算属性。混入对象可以包含任意组件选项。当组件使用混入对象时,所有混入对象的选项将被混入该组件本身的选项。
来看一个简单的实例:
<!doctype html><html><head><meta charset="utf-8"><title>vue 测试实例</title><script src="https://cdn.staticfile.org/vue/2.4.2/vue.min.js"></script></head><body><div id = "databinding"></div><script type = "text/javascript">var vm = new vue({el: '#databinding',data: {},methods : {},});// 定义一个混入对象var mymixin = {created: function () {this.startmixin()},methods: {startmixin: function () {document.write("欢迎来到混入实例");}}};var component = vue.extend({mixins: [mymixin]})var component = new component();</script></body></html>
选项合并:
当组件和混入对象含有同名选项时,这些选项将以恰当的方式混合。
比如,数据对象在内部会进行递归合并,在和组件的数据发生冲突时以组件数据优先。
注意点:
(1)就是 混入对象中 你设置了个data属性,里面各种属性值, 组件里也有个data属性,那么混入对象和组件对象的data值会进行合并,重名的以组件数据有限;
(2)同名钩子函数,都会被调用,而且混入对象的钩子在组件自身钩子之前调用;
全局混入
格式为:
vue.mixin({ // 混入函数 })
注意! 慎用,一旦使用全局混入对象,会影响到所有之后创建的vue实例。使用恰当时,可以为自定义对象注入处理逻辑。
相关免费学习推荐:javascript(视频)
以上就是vue.js什么是混入的详细内容。
其它类似信息

推荐信息