Vue3组合api setup超简单讲解

目录

组合api特点

setup（）

ref 值类型 响应对象

reactive 引用类型 响应式

watch 监听

watchEffect 监听效果

computed 计算

生命周期

全局配置

setup使用vuex

setup 使用路由

setup(props,context) 参数

---

组合api特点

1. 更加直观，接近原生js

2. 按需加载

3. 没有this，降低了耦合性，提高复用性

setup（）

1.相当于created生命周期

2.需要 return 返回，在模板中使用

ref 值类型 响应对象

1       const count = ref(5)

        在setup访问count值
        count.value 来访问

2        可以作为dom引用
        const inp  = ref(null)
        <p ref="inp">
        inp.value.innerText

reactive 引用类型 响应式

const list = reactive(默认值)
x  list = xxx  直接赋值破坏了引用
√ list.push(xxx)

watch 监听

watch("count&#