Vue Composition API 响应式包装对象原理及示例代码

Vue Composition API 是 Vue.js 3 中引入的一种新的 API，它提供了一种更灵活和可组合的方式来编写 Vue 组件的逻辑。其中，响应式包装对象是 Composition API 中的一个重要概念，它使我们能够创建具有响应式特性的对象。本文将详细介绍 Vue Composition API 响应式包装对象的原理，并提供相应的示例代码。

在 Vue Composition API 中，我们可以使用 ref 函数来创建一个响应式包装对象。ref 函数接受一个初始值作为参数，并返回一个包含 value 属性的对象。这个 value 属性是响应式的，当它的值发生变化时，相关的组件会自动进行更新。

下面是一个简单的示例，演示了如何使用 ref 函数创建和使用响应式包装对象：

import {
   
    ref } from 'vue';

// 创建一个响应式包装对象