解決vue-element-admin mock 模擬數據不顯示問題（已經解決）

Question

const List = []
const count = 100
for (let i = 0; i < count; i++) {
  List.push(Mock.mock({
    id: '@id',
    title: '@sentence(10, 20)',
    'status|1': ['published', 'draft', 'deleted'],
    author: 'name',
    category: 'MT-@integer(1,1000)',
    createdate: '@date',
    number: 'MT-@integer(10, 100)',
    opeater: 'simon@integer(500,800)',
    amount: '$@integer(500,5000)',
    type: 'MF-@sentence(10, 20)',
    name: 'MA-@sentence(1, 20)',
    qutodate: '@date'
  }))
}

export default [
  {
    url: '/table/list',
    type: 'get',
    response: config => {
      const { importance, type, title, page = 1, limit = 20 ,sort} = config.query

      let mockList = List.filter(item => {
        if(importance && item.importance !== +importance) return false
        if(type && item.type !== type) return false
        if(title && item.title.indexOf(title) < 0) return false
        return true
      })
      if (sort === '-id') {
        mockList = mockList.reverse()
      }

      const pageList = mockList.filter((item, index) => index < limit * page && index >= limit * (page -1))

      return {
        code: 20000,
        data: {
          total: mockList.length,
          items: pageList
        }
      }
    }
  },

 <el-table
    v-loading="listLoading"
    :data="list"
    border
    fit
    highlight-current-row
    style="width: 100%; margin-top: 20px"
    >
      <el-table-column align="center" label="ID" width="85" prop="id" :class-name="getSortClass('id')">
        <template slot-scope="row">
          {{ row.id }}
        </template>
      </el-table-column>
       <el-table-column align="center" label="類別" prop="category">
        <template slot-scope="{row}">
          {{ row.category }}
        </template>
      </el-table-column>
    </el-table>

  created() {
    this.fetchData()
  },
  methods: {
    fetchData() {
      this.listLoading = true
      getList(this.listQuery).then(response => {
        this.list = response.data.items
        this.total = response.data.total
         console.log(this.list)

        setTimeout(() => {
          this.listLoading = false
        }, 1000)
      })
    }
        }

沒有數據顯示 請問各位大神知道什麼原因嘛

Answer 1

参考GPT和自己的思路：

根据提供的代码，看起来没有明显的原因导致数据显示不出来。建议先检查以下几点：

1. 是否确保已经启动了 API 服务并且能够正常响应 /table/list 接口？
2. 是否确保前端发送的请求参数（importance、type、title、page、limit、sort）与后端 API 预期一致？
3. 是否确保 API 返回的数据格式符合前端代码中的解析逻辑？

如果这些问题都排除了，可以尝试在前端代码中加入一些调试语句，比如在 getList 函数中的 response 之前输出一些变量，看看是否能够正常获取到数据，进而定位问题所在。