Vue mixin配置项

1.为什么实用混入(混合)?

        组件内部的配置项复用

2.怎么写一个混入?mixin是一个js文件,两个组件都有显示Name的需求

export const mixin={
    methods:{
        showName(){
            alert(this.Name)
        }
    }
}


//可以写多个,每个mixin里面可以写所有的配置项
//export const mixin2={
//     methods:{
//         showName(){
//             alert(this.Name)
//         }
//     },
//     data:{
//         x:600
//     }
// }

3.怎么应用一个混入,(一个js文件可以写多个混入,一个组件可以引入一个js里面的多个混入,也可以引入不同js里的混入)

import {hunhe} from '../mixin.js'
// import {hunhe,hunhe2} from '../mixin.js'
export default {
    name:"School",
    
    data() {
        return {
            name:"lili",
            age:12
        }
    },
    //写maxin配置项
    mixins:[hunhe]
    // mixins:[hunhe,hunhe2]
}

4.冲突处理

会将组件和引入的混合放在一起看,如果互相冲突,则取组件的内容。例如都有data中的x,则使用的是组件中的x。

特殊:如果都有mounted,则两者都保留,两个moubted都会进行

5.全局引入

在main.js文件中引入,则所有的vc和vm都可以用

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值