Vue3 + TypeScript 初体验

147 阅读2分钟
使用其他的工具
1. vscode工具 (选择)
2. webStrom 工具(占用的东西过于的高 )
这个是一个收费的软件
dff 算法
Vue的一种基础,依然会讲到
在Vue3中没有讲到的内容这里都会讲到
了解这样的一个typescript
能不用any的地方都不会使用到any这样的一个关键字
不喜欢用别人的ui组件库
基础 - > 实战 -> 源码
调试Vue3里面的一个原点
Vue 是一套用于构建用户界面的渐进式框架
在项目模块里面使用这样的一个模块 (这里的邂逅使用到这样的一个问题)
nest.js -> 学习非常的快速
React.js -> 前端工程师都是非常的使用
React 在国内外的市占有率都是非常的高的
Vue在国内市场中占有率是非常的高的
在前端找一份工作是没有太大的问题的
对于小程序也有很多的要求
包括Vue3的进一步稳定
脚手架的一个版本,会问道Vue3的一个问题

image.png

Vue2.x 和 Vue3.x的区别

Vue2.x 是使用FLow来进行类型判断的

Vue3.x 是使用typeScript 来进行重构的

typeScript的逻辑和Javascript 的逻辑是相同的,并且会带着一块讲解

读里面的核心的理解的

image.png

Vue2 的的使用Object.defineProperty 对于数据进行getter 或者是 setter 操作的时候是没有办法进行数据的劫持

在Vue3.x开始,Vue使用Proxy来实现数据的劫持,这个APi后面会精讲的

移除了一些不必要的API 1 移除了实例上的on,on,off 和 $once 2 移除了一些特性: 比如fitter,内联模板等等;

包括编译方面的优化: 生成Block Tree, Slot (插槽)编译的优化,diff算法的优化

它也是有一点不一样的

Composition APi: 可以将相关联的代码放到同一处 进行处理,不需要在Options APi进行使用

使用Hooks函数的增加代码的复用性

image.png

多个mixins 也是由一大堆的Options组成的,并且存在多个mixins命名的重复

在Vue3.x中,我们可以通过Hook函数来将一部分独立的逻辑抽取出去,并且它还是响应式的

比如created中会使用一个method来进行修改