当前第2页 返回上一页
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 | var mixin={
methods:{
foo:function(){
console.log('foo')
},
conflicting:function(){
console.log('from mixin')
}
}
}
var vm = new Vue({
mixins:[mixin],
methods:{
bar:function(){
console.log('bar')
},
conflicting:function(){
console.log('from self')
}
}
})
vm.foo()
vm.bar()
vm.conflicting()
|
全局混入
也可以全局注册混入对象。注意使用！一旦使用全局混入对象，将会影响到所有之后创建的Vue实例。使用恰当时，可以为自定义对象注入处理逻辑。
1 2 3 4 5 6 7 8 9 10 11 12 | Vue.mixin({
creted:function(){
var myOption = this.$options.myOption;
if(myOption){
console.log(myOption)
}
}
})
new Vue({
myOption:'hello'
})
|
谨慎使用全局混入对象，因为会影响到每个单独创建Vue实例（包括第三方模板）。大多数情况下，只应当应用于自定义选项，就像上面示例一样。也可以将其用作Plugins以避免产生重复作用。
自定义选项合并策略
自定义选项将使用默认策略，即简单的覆盖已有值。如果想让自定义选项以自定义逻辑合并，可以向Vue.config.optionMergeStrategies添加一个函数：
1 2 3 | Vue.config.optionMergeStrategies.myOption=function(toVal,fromVal){
return mergedVal
}
|
对于大多数对象选项，可以使用methods的合并策略：
1 2 | var strategies = Vue.config.optionMergeStrategies;
strategies.myOption = strategies.methods
|
本篇文章到这里就已经全部结束了，更多其他精彩内容可以关注PHP中文网的JavaScript视频教程栏目！
以上就是vue混入的相关操作介绍（附示例）的详细内容，更多文章请关注木庄网络博客！
返回前面的内容
相关阅读 >>
javascript如何设置只能输入数字
javascript怎么修改style样式
如何理解javascript是动态语言
详解javascript中的service workers！
js中splice()方法是什么？
小总结 javascript 开发中常见错误解决
javascript有没有集合
不属于javascript的数据类型是什么
javascript怎么控制页面跳转
es6生成器用法介绍（附示例）
更多相关阅读请进入《javascript》频道 >>
人民邮电出版社
本书对 Vue.js 3 技术细节的分析非常可靠，对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪，Vue.js作者
转载请注明出处：木庄网络博客 » vue混入的相关操作介绍（附示例）
