1、我尝试在列中加入ellipsis为true后,让内容超出后,用省略号表示。
{title:displayName,dataIndex:propName,key:newPropName,width:widthIndex //,ellipsis:true }
但是这引发了另外的问题。react-resizable 配置的列可拖动无效了。
额外的情况:obj.fixed = 'left' 让列固定,这是可以出现省略号和可以拖动的。
2、chartGpt给出的解决办法:
ellipsis
属性通常用于在内容溢出时显示省略号。但是,它可能会与某些 UI 库或组件产生冲突,因为它会影响到元素的布局和大小计算。
在你描述的情况下,使用 ellipsis
属性可能导致 react-resizable
无法正确地识别和操作表格列的大小,因为它可能会影响到列的宽度计算。
为了解决这个问题,你可以考虑以下几种方法:
-
不使用 ellipsis 属性: 如果可能的话,尝试不使用
ellipsis
属性,或者通过其他方式处理文本溢出,例如使用 Tooltip 或者自定义样式来处理长文本的显示。 -
自定义处理: 如果你确实需要
ellipsis
属性,那么你可能需要自定义处理react-resizable
的拖动逻辑。这可能涉及到修改react-resizable
的源代码,或者在使用时进行一些 hack 或调整以兼容ellipsis
属性。 -
反馈给组件作者: 如果
ellipsis
属性与react-resizable
组件的正常功能产生了冲突,你可以将这个问题反馈给组件的作者,看是否可以在未来的版本中解决这个问题。
综上所述,你可以根据具体情况选择合适的解决方案来解决 ellipsis
属性与 react-resizable
组件之间的冲突。
标签:resizable,拖动,react,ProTable,组件,ellipsis,属性 From: https://www.cnblogs.com/wwssgg/p/18137443