vue for循环，获取自定义属性的值

最新推荐文章于 2023-09-27 06:40:28 发布

转载最新推荐文章于 2023-09-27 06:40:28 发布 · 812 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/ygyy/p/10300089.html

文章标签：

#javascript #ViewUI

本文介绍Vue.js中使用v-for指令进行列表渲染的方法，以及如何获取自定义属性的值。通过具体代码示例展示了如何绑定数据并响应式地更新列表项。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<ul id="example-2">
  <li v-for="(item, index) in items">
    {{ parentMessage }} - {{ index }} - {{ item.message }}
  </li>
</ul>


var example2 = new Vue({
  el: '#example-2',
  data: {
    parentMessage: 'Parent',
    items: [
      { message: 'Foo' },
      { message: 'Bar' }
    ]
  }
})

2.获取自定义属性的值

<ul class="header-ul">
    <li class="flexcss" v-for="(list,index) in child" :data-value="list.name" @click="changeContent(index,list.name)">{{list.name}}</li>
</ul>


methods: {
   changeHeaderContent(index,name){
      console.log('cht',index)
      console.log('chaname',name)
}

转载于:https://www.cnblogs.com/ygyy/p/10300089.html