标签：11 插件 Vue .... 混入 mixin hunhe
目录
一、mixin混入
1.功能
可以把多个组件功用的配置提取成一个混入对象
2.使用方式
第一步：定义混合，例如：
{
data () { ... },
methods : { ... }
...
}
export const mixin = {
methods:{
showName(){
alert(this.name)
}
},
}
export const hunhe = {
mounted(){
console.log('你好啊！！！！');
}
}第二步：使用混入，例如：
(1).全局混入：Vue.mixin ( xxx ) （在main.js文件中）
import {mixin,hunhe} from './mixin'
Vue.mixin(mixin)
Vue.mixin(hunhe)(2).局部混入：mixins : [ 'xxx' ]
<script>
//引入一个混合
import {mixin,hunhe} from '../mixin'
export default {
mixins:[mixin,hunhe]
}
</script>二、插件
1.功能
用于增强Vue
2.本质
插件是包含install方法的一个对象，install的第一个参数是Vue，第二个以后的参数是插件使用者传递的数据
3.定义插件
对象.install = function (Vue,options){
//1.添加全局过滤器
Vue.filter(....)
//2.添加全局指令
Vue.directive(....)
//3.配置全局混入（合）
Vue.mixin(....)
//4.添加实例方法
Vue.prototype.$myMethods = function(){....}
Vue.prototype.$myProperty = xxxx
}4.使用插件
Vue.use()三、scoped样式
1.作用
让样式在局部生效，防止冲突
2.写法
<style scoped>
3.案例
如下，有效避免了两个组件的样式命名冲突
标签：11,插件,Vue,....,混入,mixin,hunhe 来源： https://blog.csdn.net/m0_59897687/article/details/121924043
本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享； 2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关； 3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关； 4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除； 5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。