请教一个 vue3 生命周期的问题

[Gaays]

最近看了一下 vue3 ，虽说 Composition API 可以让相关功能的代码更加有序的组合在一起，不会像 vue2 一样，可能新增一块功能同时需要修改 data 、mounted 、methods ，改一个功能在代码里面跳来跳去。 在 vue3 中使用 Composition API 就不会这样，但是如果我想看这个页面初始化的时候执行了哪些方法时，也需要在代码中上下跳转？这个有什么解决办法吗？

感觉 mounted 内容统一写在一起那就违背 Composition API 的设计初衷了，拆开写对了解功能也造成了影响？

另外有优秀的 vue3 项目推荐吗？ vue3 的写法太开放了，如果没有处理好可读性比 vue2 还差，想看看优秀的写法。

[wxsm]

> 但是如果我想看这个页面初始化的时候执行了哪些方法时，也需要在代码中上下跳转？

这个是一个取舍。举个例子，就像一个项目的文件夹怎么划分，是先以业务模块划分再往下划分功能类型呢，还是先划分功能类型再往下划分业务模块呢。选项式 API 和组合式 API 也做了类似的取舍。

> 感觉 mounted 内容统一写在一起那就违背 Composition API 的设计初衷了，拆开写对了解功能也造成了影响？

我觉得你想太多了。怎么舒服怎么来就行了。你觉得有些东西写在一起更方便，那就写在一起。拆开了更方便，那就拆开。设计是死的，人是活的。没有银弹。

[yaphets666]

那他给你提供这个 setup 里的 onMounted 是干嘛用的。composition api 可用可不用，想用，该用那就用，不想用，完全 vue2 写法也不是不行

[renhou]

把能写在一起的根据 composition api 原则写在一起
把需要写在 onMounted 里的写在 onMounted 里
composition api 的设计可以理解为更加有序组合，而不是绝对有序组合

[bojackhorseman]

setup 里 onMounted 可以调一万次

[erhsilence]

https://www.cnblogs.com/goloving/p/15437343.html
可以看看第三点

[wu67]

不至于吧?

目前我是直接用了 setup,
开局 import
然后 const const const let let let, 有变量有 func
可能夹杂着一两个 watch
在最后的</script>之前写一两个 init(), 这里不就是‘打开页面会执行哪些方法’吗, 直接搜这个方法名就是了

[agileago]

来试试 https://github.com/agileago/vue3-oop 让你摆脱选择困难症

[96412hj]

@agileago angular 里 angular 气

[sjhhjx0122]

@96412hj 来看看我这个更 ng 的~https://vdi-docs.vercel.app/guide/module.html

[agileago]

@96412hj 哈哈，我觉得还好吧，就借鉴了一下依赖注入处理状态共享，其他和 angular 差距挺大的，基本已经做到了足够简单了

[agileago]

@sjhhjx0122 感觉好烦琐啊，对比一下我的

[TomPig0216]

推荐项目 vue-vben-admin

[sjhhjx0122]

@agileago 其实就两个 api https://vdi-docs.vercel.app/guide/quick-start.html 就够了