比如从import { reactive, computed } from 'vue'可以看到，我们常用的API可以有：reactive、computed，那么，你知道vue模块到底有多少API？事实上它的API还真的不少，高达113个。
你应当首先关注单文件组件开发下如何使用这些API。
https://v3.cn.vuejs.org/guide/composition-api-setup.html
https://composition-api.vuejs.org/zh/#api-介绍
| 方法/属性 | 用法 |
|---|---|
| BaseTransition | |
| Comment | |
| Fragment | |
| KeepAlive | |
| Static | |
| Suspense | |
| Teleport | |
| Text | |
| Transition | |
| TransitionGroup | |
| callWithAsyncErrorHandling | |
| callWithErrorHandling | |
| camelize | |
| capitalize | |
| cloneVNode | |
| compile$1 as compile | |
| computed$1 as computed | 使用 getter 函数，并为从 getter 返回的值返回一个不变的响应式 ref 对象。或者，它可以使用具有 get 和 set 函数的对象来创建可写的 ref 对象。 |
| createApp | 调用 createApp 返回一个应用实例。该实例提供了一个应用上下文。应用实例挂载的整个组件树共享相同的上下文，该上下文提供了之前在 Vue 2.x 中“全局”的配置。另外，由于 createApp 方法返回应用实例本身，因此可以在其后链式调用其它方法，这些方法可以在以下部分中找到。 |
| createBlock | |
| createCommentVNode | |
| createHydrationRenderer | |
| createRenderer | |
| createSSRApp | |
| createSlots | |
| createStaticVNode | |
| createTextVNode | |
| createVNode | |
| customRef | 高阶知识，创建自定义的 ref，可以对其依赖项跟踪和更新触发进行显式控制。它的参数是个函数，该函数接收 track 和 trigger 函数作为参数，并应返回一个带有 get 和 set 的对象。具体看手册和其他讲解。 |
| defineAsyncComponent | |
| defineComponent | |
| defineEmit | |
| defineProps | |
| devtools | |
| getCurrentInstance | |
| getTransitionRawChildren | |
| h | 返回一个”虚拟节点“，通常缩写为 VNode：一个普通对象，其中包含向 Vue 描述它应在页面上渲染哪种节点的信息，包括所有子节点的描述。它的目的是用于手动编写的渲染函数 |
| handleError | |
| hydrate | |
| initCustomFormatter | |
| inject | |
| isProxy | 检查对象是否是由 reactive 或 readonly 创建的 proxy。 |
| isReactive | 检查对象是否是 reactive创建的响应式 proxy。如果 proxy 是 readonly 创建的，但还包装了由 reactive 创建的另一个 proxy，它也会返回 true。 |
| isReadonly | 检查对象是否是由readonly创建的只读 proxy。 |
| isRef | 检查一个对象是否是Ref对象。 |
| isVNode | |
| markRaw | 标记一个对象，使其永远不能转换为 proxy。它返回对象本身。这种保护只对表层属性有用，对深层属性不保护。有些值不应被设置为响应式的，例如复杂的第三方类实例或 Vue 组件对象，可以用markRaw保护。当渲染具有不可变数据源的大列表时，跳过 proxy 转换可以提高性能。它有一个什么本源危害，需要深入理解。 |
| mergeProps | |
| nextTick | |
| onActivated | |
| onBeforeMount | |
| onBeforeUnmount | |
| onBeforeUpdate | |
| onDeactivated | |
| onErrorCaptured | |
| onMounted | |
| onRenderTracked | |
| onRenderTriggered | |
| onUnmounted | |
| onUpdated | |
| openBlock | |
| popScopeId | |
| provide | |
| proxyRefs | |
| pushScopeId | |
| queuePostFlushCb | |
| reactive | 等价于 2.x 中的 Vue.observable() API |
| readonly | 获取一个对象 (响应式或纯对象) 或 ref 并返回原始 proxy 的只读 proxy。只读 proxy 是深层的：访问的任何嵌套 property 也是只读的。 |
| ref | 接受一个内部值并返回一个响应式且可变的 ref 对象。ref 对象具有指向内部值的单个 property .value。ref应当只对基本数据类型使用。 |
| registerRuntimeCompiler | |
| render | |
| renderList | |
| renderSlot | |
| resolveComponent | |
| resolveDirective | |
| resolveDynamicComponent | |
| resolveTransitionHooks | |
| setBlockTracking | |
| setDevtoolsHook | |
| setTransitionHooks | |
| shallowReactive | 创建一个响应式 proxy，跟踪其自身（也就是表层） property 的响应性，不执行嵌套对象的深度响应式转换。也就是表层响应式。 |
| shallowReadonly | 创建一个 proxy，使其自身（也就是表层）的 property 为只读，但不执行嵌套对象的深度只读转换。 |
| shallowRef | 创建一个 ref，只是表层响应式。shallow中文涵义：浅层。如果value重复值为一个对象，这个对象不具有响应式。 |
| ssrContextKey | |
| ssrUtils | |
| toDisplayString | |
| toHandlerKey | |
| toHandlers | |
| toRaw | 返回 reactive 或 readonly proxy 的原始对象。这是一个转义口，可用于临时读取而不会引起 proxy 访问/跟踪开销，也可用于写入而不会触发更改。不建议保留对原始对象的持久引用。请谨慎使用。 |
| toRef | 与ref的区别在于它只操作一个对象的属性值，将对象中的某个值转化为响应式数据，它接收两个参数，第一个参数为那个对象，第二个参数为对象中的那个属性名。 |
| toRefs | 由于reactive的对象用解构操作会丢失响应式，所以可以用toRefs()，它将reactive()创建出来的响应式对象转换为普通对象，只不过这个对象上的每个属性节点，都是ref()类型的响应式数据。它的用途是解构一个响应式对象，但让对象的各个属性值依然保持响应式。当从合成函数返回响应式对象时，toRefs 非常有用，这样消费组件就可以在不丢失响应性的情况下对返回的对象进行分解/扩散。 |
| transformVNodeArgs | |
| triggerRef | 手动执行与 shallowRef 关联的任何效果。我目前还不懂。 |
| unref | ref的反操作，将Ref对象还原成基础数据。 |
| useContext | |
| useCssModule | |
| useCssVars | |
| useSSRContext | |
| useTransitionState | |
| vModelCheckbox | |
| vModelDynamic | |
| vModelRadio | |
| vModelSelect | |
| vModelText | |
| vShow | |
| version | |
| warn | |
| watch | |
| watchEffect | 它接收一个函数作为参数，凡函数体内的随便哪个响应式数据有变化，就完整执行一遍函数。 |
| withCtx | |
| withDirectives | |
| withKeys | |
| withModifiers | |
| withScopeId |
网友评论