如何在单击时获取数组中对象的选定值？

Question

我有一个列在表中的对象数组，我需要获取单击对象的值。当我单击数字时，它会循环并仅获取最后一个数组值。

我目前正在遍历数组中的所有对象，但我不能只选择我选择的一个对象。

<template>
  <div>
    <tbody>
        <tr v-for="(call, index) in filterSummary" :key="index">
          <td>
            <a
              @click="onSelect"
              class="waves-effect waves-dark green btn-small left"
              id="select_DID_button"
            >{{ call.number }}</a>
          </td>
          <td>{{ call.name }}</td>
          <td>{{ call.dataValues.volume }}</td>
          <td>{{ call.dataValues.inboundVolume }}</td>
          <td>{{ call.dataValues.outboundVolume }}</td>
          <td>{{ call.dataValues.totalDuration | formatDuration }}</td>
          <td>{{ call.dataValues.inboundDuration | formatDuration }}</td>
          <td>{{ call.dataValues.outboundDuration | formatDuration }}</td>
          <td>{{ call.dataValues.averageDuration | formatDuration }}</td>
        </tr>
      </tbody>
  </div>
</template>

<script>
export default {
  data() {
    return {
    }
  },
methods: {
    onSelect() {
      var obj = this.$store.state.callerActivitySummary;
      for (var i = 0; i < obj.length; i++) {
        var newNumber = obj[i].number;
        this.$store.commit("updateNumber", newNumber);
        console.log("Number: ", newNumber);
      }
      this.getCallerActivityDetails();
    }
  }
}
</script>

我的对象数组如下所示。

{
  "items": [
    {
    "alternativeNames": [],
    "number": "012345678",
    "dataValues": {},
    "name": "Random name"
    }
  ]
}

控制台输出是：

Number:  111968948
Number:  49819811
Number:  0566561651
Number:  012345678

我需要从被点击的对象中获取数字。

Answer 1

我没有看到所选数字与您正在循环的每个对象中的数字的比较。你需要这样的东西：

if (selectedNumber === obj[i].number) {
    this.$store.commit("updateNumber", selectedNumber);
    break;
}

selectedNumber 是传递给方法的数字。

@click="onSelect(call.number)"

...

methods: {
    onSelect(selectedNumber) { ...