Question

我的vue模板：

<div 
  class="col-sm-4 col-xs-6 thumb" 
  v-for="(photo, index) in photos" 
  @click.prevent="check(index)"
>
  <a class="thumbnail" :class="{'active': photo.checked}">
    <img class="img-responsive" :src="photo.picture" alt="">
  </a>
</div>

我的check（）方法：

check(index) {
  if(!("checked" in this.photos[index]))
    this.photos[index].checked = true
  else
    this.photos[index].checked = !this.photos[index].checked
},

一切似乎都是正确的，但它不起作用。问题是什么？

Answer 1

Vue cannot detect changes to an index of an array.

获取对传递给<class name="OrderDetails" > <id name="OrderNumber" column="ID"/> <property name="OrderNumber" column="ID"/> <property name="OrderDate" column="OrderDate"/> <property name="ProductCode" column="productCode"/> <property name="ProductName" column="Name"/> <property name="Quantity" column="Quantity"/> <property name="Price" column="UnitPrice"/> <loader query-ref="GetOrdersByDate" /> </class> <sql-query name="GetOrdersByDate" callable="true"> exec [dbo].[sp_OrdersByDate] :DateFrom, :DateTo </sql-query>的{{1}}的{{1}}对象的引用，然后使用Vue.set()更新数组：

photo

Here's a fiddle.

Answer 2

仅index如何忘记处理程序？

check()

如果您想使用处理程序：

check(index) {
  let photo = this.photos[index];

  if (!("checked" in photo)) {
    photo.checked = true
  } else {
    photo.checked = !photo.checked
  }

  Vue.set(this.photos, index, photo);
},

并且

@click.prevent="$set(photo, 'checked', !photo.checked)"

在vuejs中单击添加类

2 个答案: