vue3基础

简介

1.2020年9月18日，vue3发布3.0版本，代号大海贼时代来临，One Piece
2.特点
无需构建步骤，渐进式增强静态的 HTML
在任何页面中作为 Web Components 嵌入
单页应用
全栈 / 服务端渲染
Jamstack / 静态站点生成
开发桌面端、移动端、WebGL，甚至是命令行终端中的界面

安装

vue create mv3
创建一个vue项目，选择自定义配置

选择默认配置
运行项目npm run serve

v2与v3的不同

1.启动方式不同
v2
import Vue from ‘vue’
new Vue({
store,
router,
render:h=>h(App)
}).$mount(“#app”)
v3
import {createApp} from ‘vue’
createApp{App}.use(route}.use{store}.mount（#app")
2.全局挂载
v3
app.config.globalProperties. $say = function(msg){alert(msg)}
v2
Vue.prototype. $say = function(msg){alert(msg)}
3.根节点
v3
beforeDestroy()
组件将要卸载
unmounted
组件已经卸载
v2
beforeDestroy()
destroyed()

setup api

1.ref
创建值类型响应式数据方法
在setup内部需要 value来访问设置值
2.reactive
创建引用类型响应式数据方法
3.defineProps
定义组传的传参props
4.defineEmits
定义组件发送的事件
5.wacth
监听多个数据
6.watch
监听多个数据
7.生命周期
setup中的生命周期，没有beforeCreate与created