vue3中定义的变量使用数组api

在Vue3中，可以使用以下数组API操作定义的变量：

1. push(): 向数组末尾添加一个或多个元素。
2. pop(): 从数组末尾删除最后一个元素。
3. shift(): 从数组头部删除第一个元素。
4. unshift(): 向数组头部添加一个或多个元素。
5. splice(): 从数组中删除或添加一个或多个元素。
6. sort(): 对数组进行排序。
7. reverse(): 对数组进行反转。
8. slice(): 返回数组的一部分。
9. concat(): 连接两个或多个数组。
10. filter(): 过滤数组中满足条件的元素并返回一个新数组。
11. map(): 对数组中的每个元素执行相同的操作，并返回一个新数组。

需要注意的是，如果要更新数组中的元素，需要使用Vue提供的特定API，例如$set和$splice。

相关问题

vue3中的watch监听数组

在Vue 3中，`watch` API 可以用于监听数据的变化。如果你想监听数组的变化并获取变化后的值，你可以使用深度监听（deep: true）。以下是使用 `watch` 监听数组的基本步骤：

1. 定义一个响应式数组：

export default {
  data() {
    return {
      arr: [1, 2, 3]
    }
  },
}

2. 在 `watch` 中监听数组变化，并在变化发生时执行回调函数：

export default {
  setup(props, context) {
    const { arr } = context;

    // 使用 watch 方法，第一个参数是需要监听的数据，第二个参数是回调函数
    // deep: true 表示深度监听数组内的元素变化
    const watchArray = watch(arr, (newVal, oldVal) => {
      console.log('数组已更新:', newVal);
      // 在这里可以执行其他操作，如处理新的数组状态
    }, { deep: true });

    // 如果需要取消监听，可以在组件卸载时调用 watchArray()
    // 返回 watch 变量以便于解绑
    return { arr, watchArray };
  },
}

当你向 `arr` 添加、删除或修改元素时，`watchArray` 回调会触发。

vue3 数组中默认值

Vue3 在创建组件时提供了一个新的 API，叫做`setup()`函数。在`setup()`函数中，我们可以定义所需要的变量和函数。当声明需要响应式的变量时，我们可以使用`ref`、`reactive`来进行声明。

对于数组中的默认值，我们可以用`ref`来实现。一般情况下，在`setup()`函数中实例化一个`ref`作为一个空数组，然后用`push()`向数组中添加默认值。

以下是一个示例代码：

import { ref } from 'vue';

export default {
    setup() {
        const data = ref([]);
        data.value.push('默认值1', '默认值2', '默认值3');
                
        return {
            data
        }
    }
}

在上面的代码中，我们先用`ref`实例化了一个空数组`data`。然后，我们通过`push()`函数向该数组中添加了默认值`默认值1`、`默认值2`和`默认值3`。

最后，我们将`data`作为`setup()`函数的返回值，使其成为组件中响应式的数据。这样，我们便可以在模板中使用`data`数组的值。

总体来说，Vue3 中实现数组中默认值的方式相对简单，只需要使用`ref`和`push()`即可实现。