如何使用 Vuejs 中的计算属性设置匹配的数组值和条件？

Question

 <div>
    <div v-for="box in boxes" :key="box.id">
      <BaseAccordian>
        <template v-slot:title>{{ box.name }}</template>
        <template v-slot:content>
          <div v-for="paint in paints" :key="paint.id" class="line">
            <div>
              <StatusComponent
                :box="box"
                :paint="paint"
                :matchingdata="matchingdata"
              />
              <!--only status like ok,not, medium to be printed on line accordingly -->
            </div>
          </div>
        </template>
      </BaseAccordian>
    </div>
  </div>

如何在 Vuejs 中设置匹配的数组值？

在我的代码中，我有 3 个称为 boxes、paints、matchingdata 的数组。通过使用这些数组，我想执行功能。

点击复选框后，目前我正在显示一些与paints array相关的信息

所以我需要在这里设置匹配的数组值条件。

Answer 1

你没有在 Vuejs 中使用计算属性设置匹配的数组值，你可以使用方法替换计算属性

Answer 2

您想在您的StatusComponent 中更新matchingdata 吗？这可以通过emits 完成。 vue官方文档https://v3.vuejs.org/guide/list.html#v-for-with-a-component中有相关示例。