javascript - 获取对象的 indexOf

Question

我有一个看起来像这样的数组

data: Array(3)
  0:
      data: Object
      account_id: (...)
      address_1: (...)
      address_2: (...)
      amount: 10.00
      id: 1234
...
 1:
      data: Object
      account_id: (...)
      address_1: (...)
      address_2: (...)
      amount: 20.00
      id: 1274

我正在进行 axios 调用以获取单击的特定项目的数据并以模式显示它，所以我有这个

<div v-for="card in card_data" v-bind:key="card.data.id">
...
 <a  class="text-white shadow" @click="cardClicked(card.data.id)"> Card details</a>
 </div>  

export default {

  
   data() {
        return {
           
          },
            name_on_card:'',
            card_pan:'',
            expiration:'',
            cvv:'',
            request_data: [],
            
        }
    },
cardClicked: function(id) {
              axios.get('api/get_vcard').then(response => {
             let i = this.request_data.map(item => item.data.id).indexOf(id);
            this.name_on_card = response.data[i].name_on_card;
          this.card_pan = response.data[i].data.card_pan;
          this.expiration= response.data[i].data.expiration;
          
            }).catch(error => console.log(error)); 
        },
}

当我单击按钮时，它不会提取数据

但是当我为其中一个条目尝试此操作时，它可以工作并提取数据

this.name_on_card = response.data[i].name_on_card;

我如何正确映射它以获取单击项目的索引并显示数据？

标签： javascriptvue.js

Answer 1

Ciao，很遗憾你没有显示response.data. 无论如何假设response.data包含一个id，你map是正确的。我做了一个例子：

let responseWithIdInData = [{data: {
          account_id: "(...)",
          address_1: "(...)",
          address_2: "(...)",
          amount: 10.00,
          id: 1234}},
          {data: {
          account_id: "(...)",
          address_1: "(...)",
          address_2: "(...)",
          amount: 20.00,
          id: 1274},
          }];
          
let id = 1274;
let i = responseWithIdInData.map(item => item.data.id).indexOf(id);
console.log(i) // return 1 ok!

但我不知道是否responseWithIdInData像您的数据形状。事实上，您的代码似乎更像是您的响应是这样的：

let responseWithIdOutsideData = [{data: { /*there is an id here??*/},
              account_id: (...),
              address_1: (...),
              address_2: (...),
              amount: 10.00,
              id: 1234},
              {data: {/*there is an id here??*/},
              account_id: (...),
              address_1: (...),
              address_2: (...),
              amount: 20.00,
              id: 1274}];

在第二种情况下，我不知道，因为如果里面没有 id data，你的map就行不通了。

但是让我们假设您想data使用外部 id。你可以尝试做这样的事情：

let responseWithIdOutsideData = [{data: { /*there is an id here??*/},
                  account_id: "(...)",
                  address_1: "(...)",
                  address_2: "(...)",
                  amount: 10.00,
                  id: 1234},
                  {data: {/*there is an id here??*/},
                  account_id: "(...)",
                  address_1: "(...)",
                  address_2: "(...)",
                  amount: 20.00,
                  id: 1274}];
                  
let id = 1274;
let i = responseWithIdOutsideData.map(item => item.id).indexOf(id);
console.log(responseWithIdOutsideData[i].data);