vue3视频观看笔记-vue2.x与vue3变化-1

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

你可能感兴趣的:(vue3视频观看笔记-vue2.x与vue3变化-1)