vu3官方文档

vue3 api中文文档

vue3教程-官方

vue3生命周期图示

image.png

Vue3教程视频

Vue3教程视频
如果需要课程源码,或者需要添加江哥微信交流群可以添加小渔微信 : it666-01
感觉微信小程序就是类似vue3

vue3项目结构

Vue模板浏览

Vue3 模板浏览

Vue3 模板浏览

Vue3对Vue2的提升

• Diff 算法优化，添加静态标记PatchPlag
• hoistaStatic静态提升
• cacheHandlers事件侦听器缓存
• ssr渲染

标记PatchPlag

Vue3.0 创建的3中方式

• Vue-Cli
• Webpack
• Vite (作者意图取代webpack的工具)

webpack Vite步骤

vue3入口main.js

vue3入口main.js

vue3提供监听数据的变化，数据双向绑定

P6-P8课程

• ref 函数：只能监听简单数据类型的变化，不能监听复杂类型的变化（对象/数组）
• reactive:监听复杂数据的变化
• Vue3中使用组合API，解决Vue2中数据和业务逻辑分离的问题

功能api放在独立js中暴露出去 导入功能（存放再独立模块中） let一下

组合API Compostion API和Option API 混合使用

P10课程

其中Option API 就是Vue2.x中的api，vue2.x中给对象添加可选的配置就是Option

• 组合API Compostion API和Option API 混合使用 P10课程
• Composition API本质（组合API/注入API）
• setup执行时机 P11课程
• setup注意点 P11课程

setup执行时机和注意点 image.png vue2.x组件生命周期

vue3中的reactive响应式数据的方法、及reactive注意点 P12课程

reactive：只能接受对象，才能数据绑定

reactive注意点 不是json、arr对象，需要重新赋值

ref本质与注意点

p13 视频

image.png ref本质与注意点
ref使用

ref 和reactive区别

p14视频

image.png image.png image.png