如何使用 vue.js 将单击图像的 rel 属性值传递给方法

Question

我正在学习 vue.js。我想将图像的 rel 属性的值传递给方法，但我无法做到这一点。这是我的 html 代码：<template>    <div>        <div class="row justify-content-center align-items-center">            <img src="images/retro.jpg" class="card img-fluid" id="pc_left" rel="0">            <img src="images/retro.jpg" class="card img-fluid" id="pc_center" rel="0">            <img src="images/retro.jpg" class="card img-fluid" id="pc_right" rel="0">        </div>        <div class="row">            <div class="col-3 d-flex justify-content-start">                <img src="images/retro.jpg" class="card img-fluid" id="pack_cards" rel="0">            </div>            <div class="col-6 d-flex justify-content-center">                <img src="images/retro.jpg" class="card img-fluid invisible" id="pc_game" rel="0">                <img src="images/retro.jpg" class="card img-fluid invisible" id="player_game" rel="0">            </div>            <div class="col-3 d-flex justify-content-end">                <img src="images/retro.jpg" class="card img-fluid" id="game_briscola" rel="0">            </div>        </div>        <div class="row justify-content-center align-items-center">            <img @click="play($event)" src="images/retro.jpg" class="card img-fluid" id="player_left" rel="5">            <img @click="play($event)" src="images/retro.jpg" class="card img-fluid" id="player_center" rel="6">            <img @click="play($event)" src="images/retro.jpg" class="card img-fluid" id="player_right" rel="7">        </div>    </div></template>当我尝试提醒 id 或 src 时，一切正常...但是当我提醒 rel 时，会出现一个未定义的提醒（我应该看到一个数字）。开发者工具中没有出现任何错误。有人可以帮忙吗？

Answer 1

您可以使用getAttribute

event.target.getAttribute("rel")