Vue3基础

Vue 3 基础

setup 语法糖

Setup函数是在beforecreate生命周期函数之前执行，无this指向。使用setup不是响应式数据。

响应式API

1.ref关键字
vue3中使用ref之前需要先引入，使用时需要其value属性，可以正常对数组、对象操作
2. reactive 关键字
reactive使用之前也需要引入，但无需写value属性，reactive必须为对象结构。深度响应式数据，reactive创建的数据内部对象的数据也是响应式数据。
3. shallowReactive 关键字
只能对对象的一层属性检测响应式数据，与reactive相同操作对象
4. readonly 和shallowReadonly关键字
创建对象的只读代理，内部的对象也是只读。可以操作基本数据类型和数组。shallowReadonly操作只能对第一层对象设置只读操作

检测方法

1. isReactive()方法
   用于检测是否是由reactive创建，shallowReactive定义的变量也会被isReactive()检验为true。

const dataList = reactive({
	const: 0
})
const dataList1 = shallowReactive({ const: 0 })
console.log(dataList.isReactive()) //true
console.log(dataList1.isReactive()) //true

2. isReadonly()方法
3. isProxy()方法