Skip to content

Commit b8b03c3

Browse files
xuqingkaiMoonofweisheng
authored andcommitted
feat: ✨ TableColumn组件value插槽新增index参数
1 parent 6ec0397 commit b8b03c3

File tree

8 files changed

+40
-46
lines changed

8 files changed

+40
-46
lines changed

docs/component/table.md

Lines changed: 39 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,6 @@
44

55
用于展示多条结构类似的数据, 可对数据进行排序等操作。
66

7-
87
## 基础用法
98

109
通过`data`设置表格数据。
@@ -19,21 +18,21 @@
1918

2019
```ts
2120
const dataList = reactive([
22-
{
23-
name: '赵云',
24-
school: '武汉市阳逻妇幼保健学院',
25-
major: '计算机科学与技术专业'
26-
},
27-
{
28-
name: '孔明',
29-
school: '武汉市阳逻卧龙学院',
30-
major: '计算机科学与技术专业'
31-
},
32-
{
33-
name: '刘备',
34-
school: '武汉市阳逻编织学院',
35-
major: '计算机科学与技术专业'
36-
}
21+
{
22+
name: '赵云',
23+
school: '武汉市阳逻妇幼保健学院',
24+
major: '计算机科学与技术专业'
25+
},
26+
{
27+
name: '孔明',
28+
school: '武汉市阳逻卧龙学院',
29+
major: '计算机科学与技术专业'
30+
},
31+
{
32+
name: '刘备',
33+
school: '武汉市阳逻编织学院',
34+
major: '计算机科学与技术专业'
35+
}
3736
])
3837
```
3938

@@ -76,8 +75,6 @@ const dataList = reactive([
7675
</wd-table>
7776
```
7877

79-
80-
8178
## 表格高度
8279

8380
通过`height`设置表格高度,默认为`80vh`
@@ -111,7 +108,7 @@ function handleSort(e) {
111108
## 自定义列模板
112109

113110
自定义列的显示内容,可组合其他组件使用。
114-
通过 `Scoped slot` 可以获取到 `row` 的数据,用法参考 demo。
111+
通过 `Scoped slot` 可以获取到 `row`, `index` 的数据,用法参考 demo。
115112

116113
```html
117114
<wd-table :data="dataList" @sort-method="handleSort">
@@ -216,29 +213,32 @@ function handleSort(e) {
216213
align-items: center;
217214
}
218215
```
219-
## Attributes
220-
221216

222-
| 参数 | 说明 | 类型 | 可选值 | 默认值 | 最低版本 |
223-
| ----------- | -------------- | ----------------------- | ------------------- | --------- | --------- |
224-
| data | 显示的数据 | Array | - | - | 0.0.39 |
225-
| border | 是否带有边框 | boolean | - | true | 0.0.39 |
226-
| stripe | 是否为斑马纹表 | boolean | - | true | 0.0.39 |
227-
| height | Table 的高度,默认为`80vh` | string | - | `80vh` | 0.0.39 |
228-
| rowHeight | 行高 | `number / string` | - | 50 | 0.0.39 |
229-
| showHeader | 是否显示表头 | boolean | - | true | 0.0.39 |
230-
| ellipsis | 是否超出2行隐藏 | boolean | - | true | 0.0.39 |
217+
## Attributes
231218

219+
| 参数 | 说明 | 类型 | 可选值 | 默认值 | 最低版本 |
220+
| ---------- | -------------------------- | ----------------- | ------ | ------ | -------- |
221+
| data | 显示的数据 | Array | - | - | 0.0.39 |
222+
| border | 是否带有边框 | boolean | - | true | 0.0.39 |
223+
| stripe | 是否为斑马纹表 | boolean | - | true | 0.0.39 |
224+
| height | Table 的高度,默认为`80vh` | string | - | `80vh` | 0.0.39 |
225+
| rowHeight | 行高 | `number / string` | - | 50 | 0.0.39 |
226+
| showHeader | 是否显示表头 | boolean | - | true | 0.0.39 |
227+
| ellipsis | 是否超出 2 行隐藏 | boolean | - | true | 0.0.39 |
232228

229+
## TableColumn Attributes
233230

231+
| 参数 | 说明 | 类型 | 可选值 | 默认值 | 最低版本 |
232+
| -------- | --------------------------- | --------------- | ------------------- | ------ | -------- |
233+
| prop | 字段名称,对应列内容的字段名 | string | - | - | 0.0.39 |
234+
| label | 显示的标题 | string | - | - | 0.0.39 |
235+
| width | 对应列的宽度,单位为 px | number / string | - | 100 | 0.0.39 |
236+
| sortable | 是否开启列排序 | boolean | - | false | 0.0.39 |
237+
| fixed | 是否固定本列 | boolean | - | false | 0.0.39 |
238+
| align | 列的对齐方式 | AlignType | left, center, right | left | 0.0.39 |
234239

235-
## TableColumn Attributes
240+
## TableColumn Slot
236241

237-
| 参数 | 说明 | 类型 | 可选值 | 默认值 | 最低版本 |
238-
| --------- | ----------- | ---------------------- | ------------------------------------------------ | -------- | --------- |
239-
| prop | 字段名称,对应列内容的字段名| string | - | - | 0.0.39 |
240-
| label | 显示的标题 | string | - | - | 0.0.39 |
241-
| width | 对应列的宽度,单位为px | number / string | - | 100 | 0.0.39 |
242-
| sortable | 是否开启列排序 | boolean | - | false | 0.0.39 |
243-
| fixed | 是否固定本列 | boolean | - | false | 0.0.39 |
244-
| align | 列的对齐方式 | AlignType | left, center, right | left | 0.0.39 |
242+
| name | 说明 | 参数 | 最低版本 |
243+
| ----- | -------------------------------------- | -------------------------------- | -------- |
244+
| value | 自定义列的内容,1.2.16 新增`index`参数 | `{ row: Object, index: number }` | 0.1.22 |

src/uni_modules/wot-design-uni/components/wd-sidebar-item/wd-sidebar-item.vue

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -92,4 +92,3 @@ function handleClick() {
9292
<style lang="scss" scoped>
9393
@import './index.scss';
9494
</style>
95-
../wd-sidebar/type

src/uni_modules/wot-design-uni/components/wd-step/wd-step.vue

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -147,4 +147,3 @@ function getCurrentTitle(currentStatus: string) {
147147
<style lang="scss" scoped>
148148
@import './index.scss';
149149
</style>
150-
../wd-steps/type

src/uni_modules/wot-design-uni/components/wd-tab/wd-tab.vue

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -99,4 +99,3 @@ defineExpose({
9999
<style lang="scss" scoped>
100100
@import './index.scss';
101101
</style>
102-
../wd-tabs/type

src/uni_modules/wot-design-uni/components/wd-tabbar-item/wd-tabbar-item.vue

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -72,4 +72,3 @@ function handleClick() {
7272
<style lang="scss" scoped>
7373
@import './index.scss';
7474
</style>
75-
../wd-tabbar/type

src/uni_modules/wot-design-uni/components/wd-tabbar/wd-tabbar.vue

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -89,4 +89,3 @@ function setPlaceholderHeight() {
8989
<style lang="scss" scoped>
9090
@import './index.scss';
9191
</style>
92-
../wd-tabbar-item/type./type

src/uni_modules/wot-design-uni/components/wd-table-col/wd-table-col.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
:style="cellStyle"
1111
@click="handleRowClick(index)"
1212
>
13-
<slot name="value" v-if="$slots.value" :row="scope(index)"></slot>
13+
<slot name="value" v-if="$slots.value" :row="scope(index)" :index="index"></slot>
1414
<text :class="`wd-table__value ${ellipsis ? 'is-ellipsis' : ''}`" v-else>{{ row }}</text>
1515
</view>
1616
</view>

src/uni_modules/wot-design-uni/components/wd-table/wd-table.vue

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -251,4 +251,3 @@ function setRowClick(index: number) {
251251
<style lang="scss" scoped>
252252
@import './index.scss';
253253
</style>
254-
../wd-table-col/type

0 commit comments

Comments
 (0)