javascript - vue 列表渲染怎么取到具体的某个值

Question

data: {
     message:"bob"
}

获取message的方法是this.message

如果数据是数组对象

data: {
     items:post_list
}

在渲染后的列表中绑定方法，怎么在methods中获取到具体对应的某一项的值，比如hc_id

Answer 1

模板中不就获取了？

<p v-for="item in items" @click="callback(item.hc_id, $event)">
  {{ item.hc_id }}
</p>

或者采用你想的那种在渲染完成后进行获取值（当然非常不推荐这种做法），你可以直接把值写成attr赋在dom上，举例子

<p v-for="item in items" data-hcid={{item.hc_id}} >
  {{ item.hc_id }}
</p>

Answer 2

假如你在循环输出列表的时候 {{ for item in post_list }} 得到的列表

当你在具体的地方使用方法时 <p @click="someFunction(item)"></p>

在你的 methods 里的方法就可以这样写

someFunction({hc_id}) {
  //do something
}

上面的 hc_id 就是对应条目的 hc_id，在方法里直接就可以使用了

Answer 3

如果是数组要使用v-for循环一下，然后才能拿到具体的值

v-for = 'item in items'
item.hc_id