Vue之mixin混入详解
更新时间:2021年11月21日 11:33:56 作者:王同学要努力
这篇文章主要为大家介绍了Vue之mixin混入,具有一定的参考价值,感兴趣的小伙伴们可以参考一下,希望能够给你带来帮助
(福利推荐:【腾讯云】服务器最新限时优惠活动,云服务器1核2G仅99元/年、2核4G仅768元/3年,立即抢购>>>:9i0i.cn/qcloud)
(福利推荐:你还在原价购买阿里云服务器?现在阿里云0.8折限时抢购活动来啦!4核8G企业云服务器仅2998元/3年,立即抢购>>>:9i0i.cn/aliyun)
?
局部混入
<template> <div> <h2 @click="showName">学生姓名:{{name}}</h2> <h2>学生性别:{{sex}}</h2> </div> </template> <script> //引入一个混合 import { hunhe,hunhe2 } from '../mixin' export default { name: 'Student', data() { return { name: '张三', sex: '男' } }, mixins: [hunhe,hunhe2] } </script>
export const hunhe = { methods: { showName() { alert(this.name) } } } export const hunhe2 = { data() { return { x: 100, y: 200 } } }
全局混入
import { hunhe, hunhe2 } from './mixin' Vue.mixin(hunhe) Vue.mixin(hunhe2)
总结
本篇文章就到这里了,希望能够给你带来帮助,也希望您能够多多关注程序员之家的更多内容!
相关文章
VUE-Table上绑定Input通过render实现双向绑定数据的示例
今天小编就为大家分享一篇VUE-Table上绑定Input通过render实现双向绑定数据的示例,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧2018-08-08vue3利用v-model实现父子组件之间数据同步的代码详解
在Vue 3中,v-model这一指令也得到了升级,使得父子组件之间的数据同步变得更加容易和灵活,本文将探讨一下Vue 3中如何利用v-model来实现父子组件之间的数据同步,需要的朋友可以参考下2024-03-03
最新评论