Vue的mixins(混入)是一种非常灵活的方式,用于分发可复用功能到Vue组件中。mixins是一个JavaScript对象,可以包含组件中的任意功能选项,如data、components、methods、created、computed等。通过将公用的功能以对象的方式传入mixins选项中,组件使用mixins对象后,mixins对象的选项将被扩展到组件本身的选项中,从而提高代码的重用性和可维护性。
使用方法如下:
注意事项:
示例代码:
// mixins.js
export default {
created() {
console.log('嘎嘎')
},
data() {
return {
title: '标题'
}
},
methods: {
sayHi() {
console.log('你好')
}
}
}
// MyComponent.vue
import mixins from '@/mixins/mixins'
export default {
mixins: [mixins],
// 其他组件选项...
}在MyComponent组件中,可以通过this.title和this.sayHi()来访问混入的数据和方法。