baidu / baidu/amis

如何让 Table 组件的列固定宽度?

Open
#4,079 1 comment 0 reactions 0 assignees View on GitHub
fix
Dominant language
TypeScript
Stars
18.9k
Forks
2.7k
PR merge metrics
No merged PRs in 30d

Description

#### 实现场景:
希望渲染出 Table 后,表头每一列的宽度不会再被改变。

#### 存在的问题:
设置表格每一列的 `fixed` 属性(例如 `left`)后,相邻两列之间仍会出现一个 `

` 元素,可以鼠标拖拽之来调整列宽。

#### 当前方案:

```json
{
"type": "table",
"columns": [
{
"label": "Category",
"name": "category",
"type": "text",
"width": "5%",
"align": "center",
"fixed": "left"
},
{
"type": "text",
"label": "Title",
"name": "title",
"labelClassName": "text-center",
"fixed": "left"
},
{
"type": "text",
"label": "Duration",
"name": "duration",
"width": "5%",
"align": "center",
"fixed": "left"
},
{
"type": "text",
"label": "Size",
"name": "size",
"width": "5%",
"align": "center",
"fixed": "left"
},
{
"type": "text",
"label": "Seeders",
"name": "seeders",
"width": "5%",
"align": "center",
"fixed": "left"
},
{
"type": "text",
"label": "Leechers",
"name": "leechers",
"width": "5%",
"align": "center",
"fixed": "left"
},
{
"type": "text",
"label": "Completes",
"name": "completes",
"width": "5%",
"align": "center",
"fixed": "left"
},
{
"type": "text",
"label": "Uploader",
"name": "uploader",
"width": "8%",
"align": "center",
"fixed": "left"
}
],
"source": "${torrents}"
}
```

Contributor guide

No contributing guide indexed for this repository

Research direction

Start by reproducing the provided Table configuration and inspect the Table implementation that creates the cxd-Table-content-colDragLine element and handles fixed columns. Determine how fixed columns currently permit resizing; done means fixed columns cannot be drag-resized while the expected behavior for other columns remains unchanged.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
frontend
Issue type
Feature
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
42/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.