Javascript 如何在vue v-for循环中显示两个描述值的数组数据？

账本详细信息：[，…]，[，…]，[{类型：发票，创建日期时间：2020-10-14 14:46:28，总计：100.82417582418，…] 0: [,…] 0:{类型：发票，创建日期时间：2020-09-03 17:15:13，总计：100，公共编号：4，id:4，…} 创建日期时间：2020-09-03 17:15:13 身份证号码：4 公众电话号码：4 参考编号：4 总数：100 类型：发票

发票说明：[{description:test}]，{description:从2020年9月25日到2020年9月29日的测试期间，test}]，…] 0:[{说明：测试}] 0:{说明：测试}

---

描述：测试

我希望我能理解你在说什么，因为你的问题需要进一步澄清 您需要将付款数据与账本详细信息的对象连接起来 因此，您需要添加支付对象的唯一密钥，例如添加PayTund。 在分类帐详细信息中，您将有一个额外的属性，该属性引用paymentId的id

分类账

    I have an array of 32 datas named ledgerDetails. I display the details of the data in vue v-for loop. But, within the loop I want to display the details of invoiceDescriptions consists of 23 datas and paymentDescriptions consists of 12 datas with some conditions. So, how to display it.
    
    My Code :
    
    <tr v-for="(ledger, index) in ledgerDetails" :key="index">
                  <td>
                    {{ formatDate(ledgerDetails[index][0]["create_datetime"]) }}
                  </td>
                  <td>
                    <span
                      v-if="
                        isNaN(
                          ledgerDetails[index][0]['public_number'] &&
                            userDetails['User']['account_id'] ==
                              ledgerDetails[index][0]['public_number']
                        )
                      "
                    >
                      {{ paymentDescriptions[index] }}
                    </span>
                    <span
                      v-if="(
                        ledgerDetails[index][0]['public_number'] == 0 &&
                        ledgerDetails[index][0]['type'] == 'creditNote')
                      "
                    >
                      Refund
                    </span>
                    <span v-else>
                      <span v-if="invoiceDescriptions !== 'undefined'">
                        {{ getInvoiceDesc() }}
                      </span>
                      <span v-else> </span>
                    </span>
                  </td>
                  <td>
                    <span
                      v-if="
                        isNaN(
                          ledgerDetails[index][0]['public_number'] &&
                            userDetails['User']['account_id'] ==
                              ledgerDetails[index][0]['public_number']
                        )
                      "
                    >
                      Payment
                    </span>
                    <span
                      v-if="
                        ledgerDetails[index][0]['public_number'] == 0 &&
                        ledgerDetails[index][0]['type'] == 'creditNote'
                      "
                    >
                      Credit Note
                    </span>
                    <span v-else> Invoice </span>
                  </td>
                  <td></td>
                  <td>
                    <span
                      v-if="
                        isNaN(
                          ledgerDetails[index][0]['public_number'] &&
                            userDetails['User']['account_id'] ==
                              ledgerDetails[index][0]['public_number']
                        )
                      "
                    >
                      <span v-if="!ledgerDetails[index][0]['reference_num1']">
                        {{ ledgerDetails[index][0]["reference_num1"] }}
                      </span>
                      <span v-else>
                        {{ ledgerDetails[index][0]["reference_num"] }}
                      </span>
                    </span>
                    <span
                      v-if="
                        ledgerDetails[index][0]['public_number'] == 0 &&
                        ledgerDetails[index][0]['type'] == 'creditNote'
                      "
                    >
                      {{ ledgerDetails[index][0]["reference_num1"] }}
                    </span>
                    <span v-else>
                      {{ ledgerDetails[index][0]["reference_num1"] }}
                    </span>
                  </td>
                  <td>
                    <span
                      v-if="
                        isNaN(
                          ledgerDetails[index][0]['public_number'] &&
                            userDetails['User']['account_id'] ==
                              ledgerDetails[index][0]['public_number']
                        )
                      "
                    >
                    </span>
                    <span
                      v-if="
                        ledgerDetails[index][0]['public_number'] == 0 &&
                        ledgerDetails[index][0]['type'] == 'creditNote'
                      "
                    >
                    </span>
                    <span v-else>
                      <!-- {{ floatConversion(ledger.total) }} -->
                    </span>
                  </td>
                  <td>
                    <span
                      v-if="
                        isNaN(
                          ledgerDetails[index][0]['public_number'] &&
                            userDetails['User']['account_id'] ==
                              ledgerDetails[index][0]['public_number']
                        )
                      "
                    >
                      <!-- {{ floatConversion(ledger.total) }} -->
                    </span>
                    <span
                      v-if="
                        ledgerDetails[index][0]['public_number'] == 0 &&
                        ledgerDetails[index][0]['type'] == 'creditNote'
                      "
                    >
                      <!-- {{ floatConversion(ledger.total) }} -->
                    </span>
                    <span v-else> </span>
                  </td>
                  <td></td>
                </tr>`<tr v-for="(ledger, index) in ledgerDetails" :key="index">
                  <td>
                    {{ formatDate(ledgerDetails[index][0]["create_datetime"]) }}
                  </td>
                  <td>
                    <span
                      v-if="
                        isNaN(
                          ledgerDetails[index][0]['public_number'] &&
                            userDetails['User']['account_id'] ==
                              ledgerDetails[index][0]['public_number']
                        )
                      "
                    >
                      {{ paymentDescriptions[index] }}
                    </span>
                    <span
                      v-if="(
                        ledgerDetails[index][0]['public_number'] == 0 &&
                        ledgerDetails[index][0]['type'] == 'creditNote')
                      "
                    >
                      Refund
                    </span>
                    <span v-else>
                      <span v-if="invoiceDescriptions !== 'undefined'">
                        {{ getInvoiceDesc() }}
                      </span>
                      <span v-else> </span>
                    </span>
                  </td>                     
                </tr>


Here, how to display the data of invoiceDescrptions and paymentDescriptions details within the ledgerDetails for loop.

Data : 

paymentDescriptions: [{PaymentInfoCheque: {description: "Cash"}}, {PaymentInfoCheque: {description: "Cash"}},…]
0: {PaymentInfoCheque: {description: "Cash"}}
PaymentInfoCheque: {description: "Cash"}
description: "Cash"
1: {PaymentInfoCheque: {description: "Cash"}}
2: {PaymentInfoCheque: {description: "Cash"}}
3: {PaymentInfoCheque: {description: "Cash"}}
4: {PaymentInfoCheque: {description: "Cash"}}
5: {PaymentInfoCheque: {description: "Cash"}}
6: {PaymentInfoCheque: {description: "Cash"}}
7: {PaymentInfoCheque: {description: "Cash"}}
8: {PaymentInfoCheque: {description: "Cash"}}
9: {PaymentInfoCheque: {description: "Cash"}}
10: {PaymentInfoCheque: {description: "Cash"}}
11: {PaymentInfoCheque: {description: "Cash"}}

在付款系统上，每个对象都有唯一的id

支付对象

{
  paymentId:500,
  otherAttribute...
}

另一方面，您需要一种方法来获取对象数据的付款，或者通过id从存储中获取付款

findPaymentById

{
paymentId:500
}

现在，您可以通过从对象获取paymentId并通过该方法对其进行搜索，然后使用另一个方法打印详细信息，从而获得ledgerDetails的付款

顺便说一下，在v-for上，您可以忽略索引，因为它将返回列表的完整对象，因此您可以不使用索引直接访问它

findPaymentById(paymentId) {
 return paymentList.find(i => i === paymentId)
}

这里我使用了零索引ledgerItem[0]，因为来自ledgerDetails的ledgerItem是一个对象数组

如果我不理解，那么请回复，如果我能帮助你，我会尝试

<div v-for="ledgerItem from ledgerDetails">
payment details :
{{ findPaymentById(ledgerItem[0].paymentId) }}
</div>