可以使用computed计算属性来实现这个功能。首先将后端返回的两条数据存储在data中,然后通过computed计算属性来计算第三条数据:

<template>
  <div>
    <ul>
      <li v-for="(item, index) in dataList" :key="index">{{ item }}</li>
      <li>Total: {{ total }}</li>
    </ul>
  </div>
</template>

<script>
export default {
  data() {
    return {
      data1: 10,
      data2: 20,
    };
  },
  computed: {
    dataList() {
      return [this.data1, this.data2];
    },
    total() {
      return this.data1 + this.data2;
    },
  },
};
</script>

在模板中,使用v-for循环遍历dataList,将其中的值显示出来。同时,在计算属性total中,将data1和data2相加,得到第三条数据的值,并将其返回。最终,在模板中通过{{ total }}来显示第三条数据的值

后端只返回两条数据前端需要3条数据vue中怎么循环遍历把这两条数据中的值相加赋值给第三条数据

原文地址: https://www.cveoy.top/t/topic/cSB7 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录