03 | 新特性：初探Vue 3新特性
该思维导图由 AI 生成，仅供参考
Vue 2 的核心模块和历史遗留问题
荧光笔
直线
曲线- 深入了解
- 翻译
- 解释
- 总结
Vue 3的新特性是本文的重点，文章从Vue 2的核心模块和历史遗留问题出发，指出了Vue 2存在的一些缺陷，如类型校验、跨端方案问题以及响应式机制的不足。接着，文章详细介绍了Vue 3的七大新特性，包括RFC机制、响应式系统、自定义渲染器等。其中，RFC机制让Vue社区更加开放，响应式系统的升级采用了Proxy代理，自定义渲染器则实现了响应式、编译和运行时的独立，使得Vue 3更具灵活性和扩展性。总的来说，Vue 3是一个拥抱未来的前端框架，通过重新设计解决了Vue 2的历史包袱，为读者提供了对Vue 3新特性的全面了解。 Vue 3的新特性包括全模块使用TypeScript重构，Composition API组合语法，新的组件（Fragment、Teleport和Suspense），以及新一代工程化工具Vite。全模块使用TypeScript重构带来更方便的提示和更健壮的代码，而Composition API则提供更好的组织代码形式和更好的代码复用性。新的组件和工程化工具Vite则分别提供了更灵活的组件渲染和更流畅的调试体验。这些新特性使Vue 3在性能、体积、开发体验和可维护性方面都有了显著的提升，为前端开发者带来更快、更强、更易于扩展的开发体验。 总的来说，Vue 3的新特性使其成为一个更加现代化、灵活和强大的前端框架，为开发者提供了更多的可能性和便利性。
《玩转 Vue 3 全家桶》，新⼈⾸单¥68
全部留言(76)
- 最新
- 精选
cwang非常感谢大圣老师的讲解，让我对Vue3有了一些深刻理解。说起Vue2开发，我遇到最头疼的问题便是Option API，如文章所言，一个1000行的代码单页面，维护起来太困难了，经常是反复横跳。这导致的问题是，换一个人过来维护，所花费时间成本迅速增高，因此，我也非常期待Composition API的使用。 其次，项目大了以后，引用的模块也越来越多，导致编译调试需要等待很长的时间。如果再加上代码校验Eslint等，那运行前的编译就更长时间了。所以，我们一般都把Eslint给去掉了。那么此次的Vite，也是我非常期待的一个新工具。不过要真正使用起来，也要等vue3项目做起来以后了。 还有类型检查TS，以前我学习的是C#、网页知识也讲一些，C#本来就是强类型语言。当时老师还给我们说JS，说弱类型有多好，多方便。但显然项目大了以后，特别是生命周期长的项目，就变得特别不好维护。不禁感叹，用了这么多年弱类型语言，现在又回到强类型那边去了。 说完我的感受，我想制定一个Vue3源码阅读计划，就以老师的课程为起始点，把我带进门。但是前途的路不知道怎么样，为了阅读源码计划顺利，想请教下大圣老师，想要完成Vue3源码阅读，需要至少哪些底子呢？谢谢！作者回复: 你好，非常棒的分享， 像阅读完vue3源码的话，先把ts和es6学好，跟着专栏里的节奏先手写一个mini版，再去看实际的代码，会效率很高
2021-10-22852
Banbri使用 VS Code 开发的时候可以用 Todo Tree 插件在 data 返回的对象末尾和 methods 对象的末尾添加一个 TODO ，这样就可以迅速定位到 data 或者 methods 的末尾来添加变量 / 方法，解决了上下反复横跳的痛苦。 另：也可以使用 Bookmarks 插件在相应的位置添加书签，之后使用快捷键来实现迅速定位到 data / methods 的最下方。作者回复: 给你这个操作点赞，我确实没想过还可以这么玩，不过Composition还是有很多有点的，比如替代mixin
2021-10-22838
人生如戏看了大圣老师的课程，感觉讲课思路挺好的，让人了解的很全面并且通俗易懂。nice～ 使用vue3开发项目简直不要太爽。项目更好维护，也提高了代码复用。唯一的就是公司不让用🙈作者回复: 公司不让用问题不大，学好了有的是好工作
2021-10-2417
ll
为大圣点个赞， 内容对我都很有启发，之前学过许多的前端和vue的知识，通过文章“闪回”，怎么说呢，就是“哦吼”的感觉，想通了。 这节题为新特性初探，实际也是对旧的回顾，因为不知旧何来新，这么一对比，收获很大。 另外composition API 和 react hooks 很相似，感觉现在框架发展的趋势是“解耦”，都在面向组合而非继承的方向走。作者回复: 很高兴对你有帮助，这个“哦吼”感觉你发了个语音 组合优于继承，是设计模式书里写好的最佳实践，现在框架在实践
2021-10-2217
Mingy突然发现很多特性 react 早已实现，比如 custom render 对标 reconciler ，hostConfig， composition 对标 hooks，只是 mutable 和 inmutable 的区别作者回复: 是这样的，在整体的设计和工程体系来说，React一直都是领先的
2021-10-2414
CondorHeroVue 2 的核心模块和历史遗留问题，我能想到还有一个： 根据 [Vue2 的生命周期图示](https://cn.vuejs.org/v2/guide/instance.html#%E7%94%9F%E5%91%BD%E5%91%A8%E6%9C%9F%E5%9B%BE%E7%A4%BA) 当我 `new Vue` 的时候，同时不给 el 或 $mount 让组件挂载，这时，beforeCreate 和 Create 依然会被执行，不合理。 但在 Vue3 中，只有 CreateApp 然后立刻调用 mount API，才会进入生命周期执行流程，更加合理。作者回复: 赞 善于发现问题是进步的一个方式
2021-10-22311
铁脑壳壳学习vue3书籍和GitHub项目有没有好的推荐？作者回复: 现在还没有书籍，github的话我推荐naive-ui，element3，antd-vue等组件库学习
2021-10-2210
ch3cknull组合式API 配合 VueUse 太香了作者回复: VueUse用户+1
2021-10-228
肉球之前只是看了文档，感觉用起来不如VUE2习惯。。。作者回复: Vue2的option确实更符合直觉， composition api带来了更适合复杂组件组织代码的方式，可以多尝试尝试
2021-10-227- Geek_a84b8d思考题 最喜欢 <script setup> 因为不用return
作者回复: 赞，看来你也是代码简洁党
2021-10-227