Vue中的mixin
创始人
2025-06-01 01:52:28
0次

其实，Mixin并不是Vue专属的，可以理解成一种思想，翻译过来就是 混入 的意思。在很多框架里其实都有Mixin（混入）

对于Mixin而言，官方解释为：

混入 (mixin) 提供了一种非常灵活的方式，来分发 Vue 组件中的可复用功能。一个混入对象可以包含任意组件选项。当组件使用混入对象时，所有混入对象的选项将被“混合”进入该组件本身的选项。

如果要用大白话解释的话，就是 我们可以将组件的公共逻辑或者配置提取出来，哪个组件需要用到时，直接将提取的这部分混入到组件内部即可。这样做的好处是，可以减少代码冗余并使得后期维护更容易。

Mixin的定义

定义mixin其实很简单，因为它就是一个对象而已，只不过它可以包含Vue组件的一些常见配置，比如data、method或是钩子函数等等。

定义mixin.js

let mixin = {created() {console.log("我是mixin里面的created!")},methods: {hello() {console.log("hello from mixin!")}}
}export default mixin

组件中使用mixin

由于在Vue2时，没有组合式API这一说法，所以mixin可能会更好解决很多问题。但是到了Vue3，这种方式已经不被推荐了

如果硬要用也是可以的，例如

let mixin = {methods:{hello(){console.log("Hello Mixin");}}
}
export default mixin

最后就是公共的mixin定义好以后，可以根据不同的业务场景，能分为两种：局部混入和全局混入。

局部混入的话，和组件的按需加载是差不多的，需要用的再引入

全局混入的话，代表在项目的任何组件中都可以使用mixin

总结：

  • mixin中的生命周期函数会和组件的生命周期函数一起合并执行

  • mixin中的data数据在组件中也可以使用

  • mixin中的方法在组件内部可以直接调用

  • 生命周期函数合并后执行顺序：先执行mixin中的，后执行组件的

词库加载错误:未能找到文件“E:\highferrum_mysql\Configuration\Dict_Stopwords.txt”。

上一篇：【瑞萨 MCU】开发环境搭建之 e2 studio 安装

下一篇：Pytorch模型转Caffe

相关内容

热门资讯

雅江超级工程核心受益标的建材E... 受“雅江”1.2万亿超级工程利好催化，建材ETF（159745）今日开盘再度大涨近3%，昨日收盘也同...
刚一字涨停，又曝利好！ 【导读】刚因雅下水电概念涨停，中国电建公告上半年水电新签合同额暴增66% 中国基金报记者 南深 7月...
银行板块短线跳水，厦门银行跌超... 银行板块短线跳水， 厦门银行跌超4%， 渝农商行跌超3%， 西安银行、 江苏银行、 重庆银行、 民生...
【网金基金研究中心】壹佰金每周... 壹佰金一周基金市场动态 1、核心资讯一览 Wind数据显示，截至7月18日17时，A股共有1540家...
1.25万亿份，净申购！ 【导读】今年二季度基金整体净申购1.25万亿份，货基和债基为主力军 中国基金报记者 张燕北 公募二季...
骑士乳业及董事长党涌涛等被罚3... 具体来看，2024年，骑士乳业开展了豆粕、白糖、尿素等期货交易业务。截至2024年1月17日，骑士乳...
现货黄金突破3400美元关口 ... 财联社7月22日讯（编辑 牛占林）周一美盘交易时段，现货黄金突破3400美元/盎司，为6月17日以来...
摩根大通：人工智能和动量交易过... 市场中最具投机性的领域可能变得过于热门，且热度攀升速度过快。 摩根大通在周一发布的一份研究报告中警告...
“金融科技第一股”退市加速 记者丨曹媛 编辑丨孙超逸 “金融科技第一股”金融壹账通（6638.HK/OCFT.N）正加速退市。 ...
公募管理规模历史首破34万亿！ 公募基金2025年二季报披露完毕。 天相投顾数据显示，公募基金二季度末管理规模历史首次超过34万亿元...
京东旗下首家自营外卖门店“七鲜... 观点网讯：7月21日消息，京东集团旗下首家自营外卖门店“七鲜小厨”已于7月20日在北京正式开业，标志...
企业居民融资成本处低位 7月L... 7月21日，中国人民银行授权全国银行间同业拆借中心公布，1年期贷款市场报价利率（LPR）为3.0%，...
港股“双重优势”吸引QDII基... 本报记者 彭衍菘 随着公募基金二季报陆续披露，QDII基金的区域配置策略调整引发市场关注。Wind资...
夯筑起应对复杂变局的坚实依托 安六高速铁路上的动车组列车驶过贵州省安顺市普定县化处镇。新华社记者 陶亮 摄 ...
“强实名”仍一票难求？遏制技术... 暑期来临，演唱会、音乐节、话剧等演出活动热度飙升。无论手速多快，总是一票难求，让众多消费者叫苦不迭。...
上证红利回报指数上涨0.83%... 金融界7月21日消息，上证指数高开高走，上证红利回报指数 (上红回报，H50019)上涨0.83%，...
为啥股票与基金的走势相反？ 虚位以待！ 平姐姐摄于毛里求斯网红酒店 昨天的文章，标题就很明确，那就是《准备出击》，在半年报不少上...
美加密货币相关法案落地引发三连... 当地时间7月18日，美国总统特朗普在白宫正式签署《指导与建立美国稳定币国家创新法案》（简称《天才法案...
股市必读：湖南黄金（00215... 截至2025年7月21日收盘，湖南黄金(002155)报收于18.33元，上涨2.57%，换手率3....
四川发布六大红色旅游新线路 四川发布六大红色旅游新线路 “锦绣天府·安逸四川”之红色旅游央地媒体联动采访启动 “锦绣天府·安...