需要使用 Vue 获取点击的元素“名称”答案

【问题标题】：Need to get clicked elements 'Name' using Vue需要使用 Vue 获取点击的元素“名称”
【发布时间】：2020-07-10 23:36:22
【问题描述】：

我正在使用 Vue，我需要知道单击了哪个元素，因为 1 是 i，另一个是 button，因此我可以将变量传递给与我相同的模态共享模型，但取决于点击了哪一个取决于显示的文本。

简单（但错误/漫长的方式）是只需单击 2 次 methods 并传递 variable 但我宁愿在 1 次 method 调用中执行此操作，因此我不会重复代码，但每次我收到undefined 回复。

当前代码

<i id="a" name="editAddress" class="fas fa-pencil-alt fa-lg px-4" v-tooltip:bottom="'Edit this address'" @click="editAddress"></i>

editAddress(e) {
  let curTarget = e.currentTarget;
  let acurTarget = e.currentTarget.id;
  let bcurTarget = e.currentTarget.name;
  console.log(curTarget)
  console.log(acurTarget)
  console.log(bcurTarget)

试用过的代码

<i id="a" name="editAddress" class="fas fa-pencil-alt fa-lg px-4" v-tooltip:bottom="'Edit this address'" type="submit" @click="handleClick($event)"></i>
<button id="addAddress" name="addAddress" class="btn btn-primary" @click.prevent="addAddress">Add a new address</button>

handleClick(e) {
  console.log('TARGET', e.target);
  console.log('NAME', e.target.name);
},

我不知道哪里出错了。我也试过用target替换currentTarget，但还是不行

【问题讨论】：

标签： javascript html vue.js vuejs2 vue-component

【解决方案1】：

你应该使用getAttribute方法如下：

console.log('NAME', e.target.getAttribute('name'));

new Vue({
  el: '#app',
  methods: {


    handleClick(e) {
      console.log('TARGET', e.target);
      console.log('NAME', e.target.getAttribute('name'));
    },
  }
})

<!DOCTYPE html>
<html>

<head>
  <meta name="description" content="Vue.delete">
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
  <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.2.1/vue.min.js"></script>
</head>

<body>
  <div id="app">
    <i id="a" name="editAddress" class="fas fa-pencil-alt fa-lg px-4" v-tooltip:bottom="'Edit this address'" type="submit" @click="handleClick($event)">a</i>

  </div>

【讨论】：