2回答

甲蛙

2021-04-13

已采纳

这部分都是ant design vue的示例代码拷过来改，至于为什么是这样，怎么用，这个得去看它的源码了。

dataIndex就是用来映射到你的后端返回的数据里的属性字段。

我的建议是，对于这种UI组件，我们知道怎么用就可以了，至于源码、原理，有兴趣的也可以去了解

0

0

FeiHuang

2021-07-17

这个 `{text:cover}` 是传给 `#cover` 这个template的参数，其实就是一个对象，text是固定的键，cover是值，你可以随意命名。
所以就算删除，应用也是可以运行的，顶多是在这个模板种不会有对应的值出现。

````

<template #cover="{ text: cover }">
  <img v-if="cover" :src="cover" alt="avatar" />
</template>

````

再说 dataIndex

他是对应了表格的内容，我们从后端取得数据再赋值给ebook，拿到的数据结构是

{

  "id": 1,

  "name": "Spring Boot 入门教程",

  "category1Id": null,

  "category2Id": null,

  "description": "零基础入门 Java 开发，企业级应用开发最佳首选框架",

  "cover": "/image/cover1.png",

  "docCount": 0,

  "viewCount": 0,

  "voteCount": 0

}

你会发现dataIndex 的值对应了这里的键，比如你再分类1种设置dataIndex的值为category2Id，那实际你再这一列种显示的是分类2的数据。即便删掉对应用的运行不会有影响，就是没有数据显示出来。

key 代表了每一列的id，就好像我们可以给给分类1和分类2都命名为分类，但是key是最好设置不一样的

0

1

树上的伯爵

很详细呀

2021-08-01

共1条回复