vue3 reactive数组重新赋值

作者：一脸帅气发布日期:2025-10-30 浏览:55

// 使用 Vue 3 的 reactive 函数创建一个响应式数组
import { reactive } from 'vue';

// 创建一个响应式的对象，包含一个数组
const state = reactive({
  items: [1, 2, 3]
});

// 重新赋值数组的方法
function resetItems() {
  // 直接重新赋值数组
  state.items = [4, 5, 6];
}

// 解释说明：
// 在 Vue 3 中，使用 reactive 函数创建的响应式对象，可以直接通过重新赋值的方式更新数组。
// 当你修改 `state.items` 时，Vue 会自动检测到变化并更新相关的视图。
// 注意：直接修改数组元素（如 state.items[0] = 10）不会触发响应式更新，建议使用这种方式重新赋值整个数组。

上一篇：vue 事件

下一篇：vue3函数式组件