vue2 mixin 和 vue3 hook
mixin
1.逻辑函数的复用
2 vue 组件中的选项式API(例如:data,computed,watch)或者组件的生命周期钩子(created、mounted、destroyed)
使用方法
mixins: [mixins], // 注册mixin,这样mixin中所有的钩子函数等同于组件中钩子
1 mixin中的生命周期函数会和组件的生命周期函数一起合并执行。
2 mixin中的data数据在组件中也可以使用。
3 mixin中的方法在组件内部可以直接调用。
4 生命周期函数合并后执行顺序:先执行mixin中的,后执行组件的。
5 同名函数冲突问题,本组件中优先级高于mixin
hook
1.vue3 的 hook函数 相当于 vue2 的 mixin(对象), 但是 hooks 是函数
2.vue3 的 hook函数 可以帮助我们提高代码的复用性, 让我们能在不同的组件中都利用 hooks 函数
import { name_hooks } from './name_hooks'
const { name, setName } = name_hooks() // 注意: 通常需要通过解构赋值将需要的属性方法添加进组件中,解构时需要注意响应式丢失的问题
参考文献 https://blog.csdn.net/qq_41370833/article/details/132579179
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 震惊!C++程序真的从main开始吗?99%的程序员都答错了
· 别再用vector<bool>了!Google高级工程师:这可能是STL最大的设计失误
· 单元测试从入门到精通
· 【硬核科普】Trae如何「偷看」你的代码?零基础破解AI编程运行原理
· 上周热点回顾(3.3-3.9)