Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

关于固定表头必须要给表头设置宽度 #11822

Closed
1 task done
liyongleihf2006 opened this issue Aug 22, 2018 · 11 comments
Closed
1 task done

关于固定表头必须要给表头设置宽度 #11822

liyongleihf2006 opened this issue Aug 22, 2018 · 11 comments

Comments

@liyongleihf2006
Copy link

liyongleihf2006 commented Aug 22, 2018

Issuehunt badges

  • I have searched the issues of this repository and believe that this is not a duplicate.

What problem does this feature solve?

我们进行的很多项目中需要表格表头固定,但一部分单元格宽度不设置,单元格根据表格的宽度和单元格内容自动分配宽度,或许类似于设置了 table-layout:fixed 之类的除了具体设置宽度的;其余的宽度平均分配.

我知道我下面说的实现方式可能很不优,性能也可能是问题.

方法就是预先生成一个table,然后向table中插入一行参考用tr,td,然后通过js计算出每一个td相对于所有td的宽度的百分比,然后生成col标签,每个col标签的width属性值就是前面生成的每一个td的百分比.

我用jquery(过时了哈 😊)写的一个练习表格拖拽的demo就采用👆这种方式来获取初始化的col的width值的.
jquery-draggabletable

这个想法可能性能是个问题,但我们进行的项目确实有这方面的需求,还望大神们考虑下哈.

What does the proposed API look like?

希望columns中的属性中可以不设置width属性.


IssueHunt Summary

afc163 afc163 has been rewarded.

Backers (Total: $20.00)

Submitted pull Requests


Tips


IssueHunt has been backed by the following sponsors. Become a sponsor

@ant-design-bot
Copy link
Contributor

Translation of this issue:


About the fixed header must set the width of the header

  • I have searched the issues of this repository and believe that this is not a duplicate.

What problem does this feature solve?

Many of the projects we need need to have the table header fixed, but some of the cell width is not set. The cell automatically allocates the width according to the width of the table and the contents of the cell, perhaps similar to setting the table-layout:fixed except the specific settings. Width; the remaining width is evenly distributed.

I know that the implementation I mentioned below may be very poor, and performance may be a problem.

The method is to pre-generate a table, then insert a row reference to the table with tr, td, and then calculate the percentage of each td relative to the width of all td through js, and then generate a col label, the width attribute value of each col label is The percentage of each td generated in the front.

I used jquery (obsolete haha) to write a demo table drag and drop demo to use this way to get the initialized col's width value.
 jquery-draggabletable

This idea may be a performance problem, but the project we are working on does have this demand, and we hope that the great gods will consider it.

What does the proposed API look like?

I hope that the width attribute can be set in the attributes in the columns.

@twisger
Copy link
Contributor

twisger commented Sep 13, 2018

可以写个通用的添加宽度的工具函数来解决,通过列数计算出百分比宽度,大部分情况下都够用;表格列数较多或者表头较长的,就计算表头的字符数来指定宽度,表格内容过长时的换行靠Ellipsis之类组件的自动截断。
非要做成完全根据内容自适应的表格,考虑提前遍历数据源来计算合适的宽度。

@yoyo837
Copy link
Contributor

yoyo837 commented Nov 2, 2018

x,y 同时设置,列有宽度,body内容仍然突破宽度限制,去掉y就正常了。

            scroll={{
              x: columnIds.length * this.widht,
              y: tableHeight > 0 ? tableHeight : undefined,
            }}

image

image

@yoyo837
Copy link
Contributor

yoyo837 commented Nov 2, 2018

我有个jQuery版的自己实现,地址 请忽略渣体验...

U: 13926529909
P: 1
C: 威逊体育

@lc-stevenzhang
Copy link

我有个jQuery版的自己实现,地址 请忽略渣体验...

U: 13926529909
P: 1
C: 威逊体育

demo好像有点问题,输完用户名,切换到密码的时候页面就卡在pending了。

@yoyo837
Copy link
Contributor

yoyo837 commented Nov 20, 2018

@lc-stevenzhang 是个废弃的版本,后台配置可能有点问题,你要使用吗?我找人看看

@lc-stevenzhang
Copy link

@lc-stevenzhang 是个废弃的版本,后台配置可能有点问题,你要使用吗?我找人看看

谢谢不用啦,我只是被横向scroll的问题弄的头大 = =………… 看了你上面的解决方案没看懂,是说当内容宽度突破table本身的宽度的时候把Y去掉吗?

@IssueHuntBot
Copy link

@issuehuntfest has funded $20.00 to this issue. See it on IssueHunt

@wf123537200
Copy link

可以这样做,按照表头宽度和表格内容宽度来设置width的大小,不过需要便利整个表格的数据,如果有真分页倒是可以,假分页可能会慢

@afc163
Copy link
Member

afc163 commented Sep 8, 2019

现在固定表头时会默认设置 tabelLayout="fixed" 了:#17284

@afc163 afc163 closed this as completed Sep 8, 2019
@issuehunt-oss
Copy link

issuehunt-oss bot commented Sep 8, 2019

@afc163 has rewarded $18.00 to @afc163. See it on IssueHunt

  • 💰 Total deposit: $20.00
  • 🎉 Repository reward(0%): $0.00
  • 🔧 Service fee(10%): $2.00

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging a pull request may close this issue.

9 participants