Question

我需要一些帮助，我有v-for循环，该循环输出数组referenceDetailsDocumentsData的元素，我需要同时检查此元素的ID是否存在于另一个数组documentsData中，在这种情况下，我需要添加自定义类到该元素的子元素。

<div class="loading-doc-item"
 v-for="referenceDetails in referenceDetailsDocumentsData"
 :key="referenceDetails.id">
<div class="loading-doc-show">
    {{ referenceDetails.name }}
    <span class="upload-status" v-if="checkUploadedDocuments(referenceDetails.id)">
        <i class="fa fa-check-circle"></i>
    </span>
    <span class="upload-status" v-else>
        <i class="fa fa-check"></i>
    </span>
</div>
</div>

methods() {
    checkUploadedDocuments(id) {
        return this.documentsData.filter(item => item.id === id);
    }
}

就我而言，我遇到了错误

渲染错误：“ TypeError：this.documentsData.filter不是功能”

Answer 1

您的逻辑是错误的-方法checkUploadedDocuments将返回Array，但它必须返回Boolean。

<div class="loading-doc-item"
 v-for="referenceDetails in referenceDetailsDocumentsData" :key="referenceDetails.id">
  <div class="loading-doc-show">
    {{ referenceDetails.name }}
    <span class="upload-status">
        <i class="fa" 
          :class="{documentsData && documentsData.length &&
            documentsData.findIndex(item => item.id === referenceDetails.id) !== -1 
            ? 'fa-check-circle' : 'fa-check'}"></i>
    </span>
  </div>
</div>

如何在v-for循环中将类设置为子元素

1 个答案: