使用element-ui组件库中的el-table时报错 Invalid prop: type check failed for prop “data“. Expected Array, got

使用 Table组件报错

1. Invalid prop: type check failed for prop “data”. Expected Array, got Object
2. Error in callback for immediate watcher “data”: “TypeError: data.indexOf is not a function”
3. data.indexOf is not a function
4. data.reduce is not a function
5. Error in mounted hook: “TypeError: this.$el.querySelectorAll is not a function”
6. …

报错有13个…

发现原因

data: {
     
	return {
     
		pagination: {
     
		  pagesize: 4,
		  pagenum: 1,
		  query: '',
		},
		total: 0,
		users: {
     },   <<==  初始化为对象
	}
}

async getData() {
     
  const {
     data: res } = await this.axios.get('/users', {
     
    params: {
      ...this.pagination },
  })
  this.total = res.data.total
  this.users = res.data.users   <<== res.data.users 是一个数组  将数组赋值给了对象
  //   console.log(res)
},

解决后代码

data: {
     
	return {
     
		pagination: {
     
		  pagesize: 4,
		  pagenum: 1,
		  query: '',
		},
		total: 0,
		users: [],   <<==  初始化为数组
	}
}

async getData() {
     
  const {
     data: res } = await this.axios.get('/users', {
     
    params: {
      ...this.pagination },
  })
  this.total = res.data.total
  this.users = res.data.users   
  //   console.log(res)
},