mixin(混入)

2022-03-29  本文已影响0人  冰点雨

功能:可以把数个组件共用的配置提取成一个混入对象
使用方式:
第一步定义混合。例如:
{
data(){...},
methods:{...},
...
}
第二部使用混入,例如
(1)全局混入:Vue.mixin(xxx)
(2)局部混入:mixins:['xxx']

985194554c9e930bc6fd3707f2f5cab.png

main.js

import Vue from 'vue'
import App from './App.vue'
//引入mixin.js
import {mixin} from './mixin.js'
Vue.config.productionTip = false
///使用mixin
Vue.mixin(mixin)
new Vue({
  render: h => h(App),
}).$mount('#app')

mixin.js

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

使用student.vue

 <h2 @click="showName">学生姓名:{{ name }}</h2>
上一篇 下一篇

猜你喜欢

热点阅读