vue中的mixins怎么用?
mixins基础概况
vue中的解释是这样的,如果觉得语言枯燥的可以自行跳过嘿~
混入 (mixins): 是一种分发 Vue 组件中可复用功能的非常灵活的方式。混入对象可以包含任意组件选项。当组件使用混入对象时,所有混入对象的选项将被混入该组件本身的选项。
怎么用?
举个栗子:
- 定义一个混入对象
- 把混入对象混入到当前的组件中
用法似不似相当简单呀
mixins的特点
1 方法和参数在各组件中不共享
混合对象中的参数num
组件1中的参数num进行+1的操作
组件2中的参数num未进行操作
看两组件中分别输出的num值
大家可以看到,我在组件1里改变了num里面的值,组件2中的num值还是混入对象里的初始值
2 值为对象的选项,如methods,components等,选项会被合并,键冲突的组件会覆盖混入对象的
混入对象中的方法
组件中的方法
打印台的输出
3 值为函数的选项,如created,mounted等,就会被合并调用,混合对象里的钩子函数在组件里的钩子函数之前调用
混入对象函数中的console
组件函数中的console
打印台的打印
与vuex的区别
经过上面的例子之后,他们之间的区别应该很明显了哈~
vuex:用来做状态管理的,里面定义的变量在每个组件中均可以使用和修改,在任一组件中修改此变量的值之后,其他组件中此变量的值也会随之修改。
Mixins:可以定义共用的变量,在每个组件中使用,引入组件中之后,各个变量是相互独立的,值的修改在组件中不会相互影响。
与公共组件的区别
同样明显的区别来再列一遍哈~
组件:在父组件中引入组件,相当于在父组件中给出一片独立的空间供子组件使用,然后根据props来传值,但本质上两者是相对独立的。
Mixins:则是在引入组件之后与组件中的对象和方法进行合并,相当于扩展了父组件的对象与方法,可以理解为形成了一个新的组件。
来源:简书
简书著作权归作者所有,任何形式的转载都请联系作者获得授权并注明出处。
转载于:https://www.cnblogs.com/zwhbk/p/11128153.html
vue中的mixins怎么用?相关推荐
- 如何在Vue 中管理 Mixins(搞懂这两点就足够了)
转载地址:https://segmentfault.com/a/1190000021772893 当我们的Vue项目功能越来越多时,如果有类似的组件,可能会发现自己一次又一次地复制和粘贴相同的数据.方 ...
- Vue中使用mixins混入
mixins在Vue中的用法 一.mixins混入 混入(mixins)提供了一种非常灵活的方式,来分发vue组件中的可服用功能.一个混入对象可以包含任意的组件选项(vue在script的部分).当组 ...
- vue中的mixins的介绍和使用
文章目录 1. 介绍 2. 简单例子 3. 合并内容 1. data对象 2. 钩子函数 3. 值为对象的选项,例如`method,components,directives等` 4. 全局混入 5. ...
- vue中mixins的使用方法和注意地方
一.什么是Mixins? mixins(混入),官方的描述是一种分发 Vue 组件中可复用功能的非常灵活的方式,mixins是一个js对象,它可以包含我们组件中script项中的任意功能选项,如dat ...
- vue 中 mixins 的使用
本文同步发布在:vue 中 mixins 的使用 mixins(混入)就是定义了一部分公共的方法.计算属性或者钩子函数等 vue 组件中的可复用功能,然后混合进各个组件中使用.下面我们具体来看看怎么使 ...
- 【Vue】Vue中mixins的使用方法及实际项目应用详解
文章目录 (1)mixin基础 (2)mixin特点 1.选项合并 2.方法和参数在各组件中不共享 (3)mixin与vuex的区别 (4)mixin与公共组件的区别 (5)项目实践 (6)总结 (1 ...
- Element组件引发的Vue中mixins使用,写出高复用组件
我们都知道 Vue 采用的是一种组件化开发模式,组件在 Vue 中一个非常重要的核心概念.每个组件都是一个完整的实例,组件的创建,组件间的通讯,组件如何更好的复用,以及整个的生命周期的钩子.所以你会发 ...
- vue中Mixins 与 Hoc
什么是mixins 在官方文档中 混入 (mixins) 是一种分发 Vue 组件中可复用功能的非常灵活的方式.混入对象可以包含任意组件选项.当组件使用混入对象时,所有混入对象的选项将被混入该组件本身 ...
- vue中mixins的使用方法
参考官网以及网上的一些资料,最基本的用法 混入 (mixin) 提供了一种非常灵活的方式,来分发 Vue 组件中的可复用功能.一个混入对象可以包含任意组件选项.当组件使用混入对象时,所有混入对象的选项 ...
最新文章
- python编写用户输入的是q么代码_Python课 #01号作业
- Mysql ID重新排列
- linux反汇编暴力破解,逆向教程之-反编译apk暴力去除弹窗和更新提示(三)
- 3大VR虚拟现实产品PK赛:HTC、Oculus、索尼谁是大哥
- android 时间显示格式,Android setting中修改时间显示格式后,桌面的数字时钟widget小部件显示不更新...
- 有关camshift的知识点
- mac os 开启redis_mac os 命令行安装 启动和停止 redis
- 怎样配置键盘最方便,以及一些设计的思考
- 武汉将投放5亿元消费券,4月19日微信率先开抢
- 为什么要文件名和类名一样php_php文件名和类名相同时include不起作用?
- 5. 公元二OO七年
- VS2010 让你的Javascript代码可以折叠
- 计算机窗口保护颜色,如何设置电脑保护色,教你设置电脑保护色
- Online Calculators (在线计算器) - Math Calculators (数学计算器)
- 思科交换机配置【串口初始配置】
- win10 office提示‘VBE6EXT.OLB不能被加载‘怎么办
- beyond-长城-国语谐音歌词
- 视频教程-微信公众平台深度开发v2.0第3季——二维码、模板消息-微信开发
- FFE均衡技术的原理、作用及特点
- 数据库delete语句菜鸟_MySQL视图