前端 - 获取数据后，控制台可以打印输出数组，但是不能渲染到组件中？

Question

template：

<el-table :data="tableData">
          <el-table-column prop="date" label="日期" width="140">
          </el-table-column>
          <el-table-column prop="name" label="姓名" width="120">
          </el-table-column>
          <el-table-column prop="address" label="地址">
          </el-table-column>
        </el-table>

script:

const item = {
      date: this.date,
      name: this.name,
      address: this.address
    }
    return {
      tableData: Array(25).fill(item)
    }
  },
  mounted () {
    this.$nextTick(() => {
      this.getData()
      // this.upData()
    })
  },
  methods: {
    async getData () {
      const { data: res } = await this.$http.get('http://127.0.0.1:4523/m1/2452239-0-default/userinfo')
      console.log(res)
      this.allData = res
      this.upData()
    },
    upData () {
      this.name = this.allData.map(item => {
        return item.name
      })
      this.date = this.allData.map(item => {
        return item.date
      })
      this.address = this.allData.map(item => {
        return item.address
      })
    }
  }

Answer 1

this.allData = res 修改为 this.tableData = res

Answer 2

你模版绑定的是tableData，script里赋值的是allData