VUE项目开发中使用mixins
一、mixins(混入)的认识请参考官方文档二、mixins的使用个人理解mixins就是定义一部分公共的方法或者计算属性,然后混入到各个组件中使用,方便管理与统一修改1、在assets文件夹下创建一个js文件// 创建一个需要混入的对象export const mixinTest1 = {created() {this.hello();},
·
一、mixins
(混入)的认识
请参考官方文档
二、mixins
的使用
个人理解
mixins
就是定义一部分公共的方法或者计算属性,然后混入到各个组件中使用,方便管理与统一修改
1、在
assets
文件夹下创建一个js
文件// 创建一个需要混入的对象 export const mixinTest1 = { created() { this.hello(); }, methods: { hello() { console.log('mixinTest1'); } } };
2、在组件中使用刚刚创建的混入
import {mixinTest1} from './../assets/js/mixin'; export default { mixins:[mixinTest1], name: 'hello', data () { return { msg: 'Welcome to Your Vue.js App' } } }
这样就可以直接调用到混入对象中的
hello
方法3、如果组件中定义的方法与混入对象中的方法/属性一样,组件中的优先级大于混入对象中的(方法会调用多次)
4、混入对象中可以定义抽象方法,使用混入的组件必须重写该方法
... methods: { handlePlaylist() { throw new Error('component must implement handlePlaylist method') } } ...
更多推荐
已为社区贡献22条内容
所有评论(0)