Javascript 通过单击v-for Div获取对象数据

我有一个带v-for的div，我想得到我单击的div的对象值。当我用alert单击div时，我试图在数据中显示，但它不起作用。你能帮我解决这个问题吗

<div id="ticketContent" v-for="ticket in tickets" @click="getTicketInformations">
              <h5> Ticket : {{ ticket.ticketID }}</h5>
              <p>Ticket Number : {{ticket.ticketNumber}}</p>
              <p>Start Date : {{ticket.startDate}}</p>
              <p>Expire Date : {{ticket.expireDate}}</p>
              <p>Hours : {{ ticket.hours }} </p>
            </div>

state : {
   tickets :[
            {"ticketID":1001,
            "ticketNumber":"2783sA",
            "startDate":"05/10/2018",
            "expireDate":"10/21/2022",
            "hours":"08:00-22:00"},
            {"ticketID":1002,
            "ticketNumber":"8a210j",
            "startDate":"01/03/2018",
            "expireDate":"01/03/2020",
            "hours":"14:00-18:00"},
            {"ticketID":1003,
            "ticketNumber":"L90Np1",
            "startDate":"10/01/2015",
            "expireDate":"10/01/2020",
            "hours":"10:00-20:00"},
            {"ticketID":1004,
            "ticketNumber":"L90Np1",
            "startDate":"05/01/2015",
            "expireDate":"05/01/2016",
            "hours":"15:00-23:00"}],
}
<script>
import { mapGetters } from 'vuex';

export default {
    computed: {
      ...mapGetters({
        tickets : 'tickets'
      }),
    },
    methods : {
      getTicketInformations(){
        alert(ticket)
      }
    }
}
</script>

票证：{{Ticket.ticketID}
票号：{{Ticket.ticketNumber}

开始日期：{{ticket.startDate}

过期日期：{{ticket.expireDate}

小时：{{ticket.Hours}

声明：{
门票：[
{“ticketID”：1001，
“票号”：“2783sA”，
“起始日期”：“2018年10月5日”，
“到期日”：“2022年10月21日”，
“小时数”：“08:00-22:00”}，
{“ticketID”：1002，
“票号”：“8a210j”，
“起始日期”：“2018年3月1日”，
“到期日期”：“2020年3月1日”，
“小时数”：“14:00-18:00”}，
{“ticketID”：1003，
“票号”：“L90Np1”，
“起始日期”：“10/01/2015”，
“到期日”：“2020年1月10日”，
“小时”：“10:00-20:00”}，
{“ticketID”：1004，
“票号”：“L90Np1”，
“起始日期”：“2015年1月5日”，
“到期日”：“2016年1月5日”，
“小时数”：“15:00-23:00”}]，
}
从“vuex”导入{mapGetters}；
导出默认值{
计算：{
…地图绘制者({
门票：“门票”
}),
},
方法：{
getTicketInformations（）{
警告（罚单）
}
}
}

试试这个：

改变vfor

<div id="ticketContent_(index)" v-for="(ticket, index) in tickets" @click="getTicketInformations(index)">

---

您可以将selectedTicket属性添加到模型中，然后在单击事件中将票证实例传递给showTicket方法

.ticket{填充：5px；边框底部：1px实心浅蓝色}
门票：
{{ticket.ticketNumber}


所选票证：
{{selectedTicket}}
新Vue({
el:“应用程序”，
数据（）{
返回{
selectedTicket:null，
门票：[
{
“ticketID”：1001，
“票号”：“2783sA”，
“起始日期”：“2018年10月5日”，
“到期日”：“2022年10月21日”，
“小时数”：“08:00-22:00”
},
{
“ticketID”：1002，
“票号”：“8a210j”，
“起始日期”：“2018年3月1日”，
“到期日期”：“2020年3月1日”，
“小时数”：“14:00-18:00”
}
]
}
},
方法：{
门票{
this.selectedTicket=票据；
}
}
})

我找到的人。使用我的函数发送ticket对象，然后获取为我工作的方法的数据

silentcontrol

，是的，就是这样。将参数添加到单击方法：

@click=“getTicketInformations（ticket）”

getTicketInformations(index){
        alert("clicked on ->" + document.getElementById(ticketContent_' + index + '))
      }