前言
VCA是Vue3中最重要的特性之一,和Hooks一样的函数式编程思想使得VCA可以很好的支持类型系统,更好的性能,以及更方便的开发。
使用
很简单,在2.x中直接作为插件即可:
import Vue from 'vue';
import VueCompositionApi from '@vue/composition-api';
Vue.use(VueCompositionApi);
使用TS的话,需要使用:
import {
defineComponent } from '@vue/composition-api';
export default defineComponent({
...
});
下文会将Hooks和VCA比较起来使用,我们主要需要注意三个点,一是是否是不可变数据,二是是否会重复渲染,三是对待生命周期函数的态度。
ref、reactive、computed和toRefs
和React Hooks的useState一样,这两个是用来管理状态的,不同的是ref接收一个值类型,而reactive接收一个引用类型,需要注意的是,其实ref和reactive的使用模式相同,所以下两端其实是相通的:
const state = ref(0)
const