谈谈vue中mixin的一点理解
vue中提供了一种混合机制--mixins，用来更高效的实现组件内容的复用。最开始我一度认为这个和组件好像没啥区别。。后来发现错了。下面我们来看看mixins和普通情况下引入组件有什么区别？
组件在引用之后相当于在父组件内开辟了一块单独的空间，来根据父组件props过来的值进行相应的操作，单本质上两者还是泾渭分明，相对独立。
而mixins则是在引入组件之后，则是将组件内部的内容如data等方法、method等属性与父组件相应内容进行合并。相当于在引入后，父组件的各种属性方法都被扩充了。
单纯组件引用：
父组件 + 子组件 >>> 父组件 + 子组件
mixins：
父组件 + 子组件 >>> new父组件
值得注意的是，在使用mixins时，父组件和子组件同时拥有着子组件内的各种属性方法，但这并不意味着他们同时共享、同时处理这些变量，两者之间除了合并，是不会进行任何通信的。最开始看到mixins的时候，天真的我似乎看到了一种向下的类似vuex的数据共享方案，心情十分激动啊。
下面给大家介绍下Vue中的mixin
一，mixin是什么
mixin文件是一个对象，可以包含vue组件的任意成分。是分发Vue组件可复用功能的非常灵活的方式，当mixin被组件使用时，所有minxin里的属性/方法会与组件里的属性/方法混合。
二，mixin使用
在Vue组件中可以有mixins属性，该属性值类型为数组。将mixin引入，作为mixins数组的元素mixins: [mixin]
组件A应用了mixin，两者的属性如methods,components和directives，将被混合为同一个对象，如果methods,components和directives中有同名的属性，则mixin中的将会被忽略。同名钩子函数会组成数组并都会被调用，并且mixin的钩子函数会比组件的钩子函数先被调用。
总结
以上所述是小编给大家介绍的vue中mixin，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持！
相关文章
利用Vue3+Element-plus实现大文件分片上传组件
在开发中如果上传的文件过大,可以考虑分片上传,分片就是说将文件拆分来进行上传,将各个文件的切片传递给后台,然后后台再进行合并,下面这篇文章主要给大家介绍了关于利用Vue3+Element-plus实现大文件分片上传组件的相关资料,需要的朋友可以参考下2023-01-01
这篇文章主要介绍了VUE el-tree组件左边勾选，右边清除交互问题，具有很好的参考价值，希望对大家有所帮助。2023-04-04
作为一个AI模型,人脸识别涉及到多个技术领域,下面这篇文章主要给大家介绍了关于vue使用tracking实现人脸识别/人脸侦测的相关资料,文中通过代码介绍的非常详细,需要的朋友可以参考下2023-09-09
这篇文章主要介绍了vue中如何引入html静态页面，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2023-01-01
本篇文章主要介绍了Vue 组件间的样式冲突污染，当多个样式出现时，就会导致样式冲突，本文介绍了具体解决方法2017-08-08
这篇文章主要介绍了vue过滤器实现日期格式化的案例分析，本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下2020-07-07
这篇文章主要介绍了Vue源码解析之Template转化为AST的实现方法，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2018-12-12
vue3+vite多项目多模块打包(基于vite-plugin-html插件)
这篇文章主要给大家介绍了关于vue3+vite基于vite-plugin-html插件实现多项目多模块打包的相关资料,现在很多小伙伴都已经使用Vite+Vue3开发项目了,文中通过实例代码介绍的非常详细,需要的朋友可以参考下2023-07-07
这篇文章主要为大家详细介绍了Vue3中useLocalStorage用法的相关知识,文中的示例代码讲解详细,具有一定的学习价值,感兴趣的小伙伴可以了解一下2023-10-10
最近学习了hooks,特地写一篇文章加深一下印象,下面这篇文章主要给大家介绍了关于vue3 hook自动导入原理及使用的相关资料,文中通过实例代码介绍的非常详细,需要的朋友可以参考下2022-10-10
最新评论