当后端传递数组给前端如何显示

传递数组前端应该如何将其显示出来

首先看这个图

不难看出来后端传递给我的是数组吧，作为前端小白我不知道我应该如何将其展示在页面上，如果传递是一个对象的话，我就可以利用浅拷贝

this.giveForm.data = Object.assign({}, row.give || {})

将数据拷贝到this.giveForm.data上面，直接利用v-model进行绑定，但是现在是一个数组。

 getGiveView(row.giveId).then((res) =>{
        //dialogFormEnd这是完工信息的列表
        console.log(res.data.data)
        this.dialogFormEnd = res.data.data.finishList || []
        console.log("完工",this.dialogFormEnd)
        //dialogFormUrging这是催办信息的列表
        this.dialogFormUrging = res.data.data.reminderList || []
        console.log("催办",this.dialogFormUrging)
        //dialogAgainForm这是回访信息的列表
        this.dialogAgainForm = res.data.data.returnVisitList || []
        console.log("回访",this.dialogAgainForm)
      })

我们就可以像这样将数据绑定到一个个的页面上
效果如下：

由于是数组，所以有的界面只有一组数据，有的有好几个，所以我用到了elementUi中的时间轴排列

<div class="block">
              <el-timeline>
                <el-timeline-item v-for="item in dialogAgainForm" :key="item.id" :timestamp="item.time" placement="top">
                  <el-card>
                    <p>回访人：{{item.returnPeople}}</p>
                    <p>回访内容：{{item.returnContent}}</p>
                    <p>回访时间：{{item.time}}</p>
                  </el-card>
                </el-timeline-item>
              </el-timeline>
            </div>

关于vue中v-for的使用，大家可以看vue的官网
vue的v-for使用
如果出现了undefined肯定是因为你没有定义表了

如图所示。
觉得有用的留下你的足迹吧！！！！