vue 修改列表中每个对象中的某个属性的值

在Vue.js中，如果你想修改列表中每个对象的某个属性值，通常你会通过双向数据绑定或者`v-for`指令结合JavaScript数组操作来实现。假设你有一个包含多个对象的数据数组`items`，并且你想修改每个对象的`property`属性，可以按照下面的方式操作：

1. **使用`v-for`循环和Vue实例的`set()`方法**:

   <template>
     <ul>
       <li v-for="(item, index) in items" :key="index">
         {{ item.property }}
         <button @click="updateProperty(index)">更新</button>
       </li>
     </ul>
   </template>

   <script>
   export default {
     methods: {
       updateProperty(index) {
         this.items[index].property = '新的值'; // 使用this.$set()如果item是响应式对象
         // 或者
         // this.items.splice(index, 1, { ...item, property: '新的值' });
       }
     }
   }
   </script>

2. **如果是响应式数据，使用`$set()`方法**（适用于Vue 2及以后版本）：
如果`items`是深度响应式的数组，直接赋值可能不会触发视图更新，这时应该使用`this.$set()`方法：

   this.$set(this.items, index, { ...this.items[index], property: '新的值' });

在上述例子中，点击按钮时会将对应索引位置的对象的`property`属性更新为“新的值”。记得在实际应用中确保你有足够的权限来修改这些数据。