在表格组件中超出宽度被省略的文字如何通过弹窗显示完整内容？-灵析社区
喝一杯吧可以吗## 解决方案 Solution 可以使用开源图表组件VTable来实现这个效果。VTable可以通过配置`isShowOverflowTextTooltip`，来实现hover弹出poptip显示被省略的完整文字。 ## 代码示例 Code Example const option: TYPES.ListTableConstructorOptions = { records, columns, tooltip: { isShowOverflowTextTooltip: true } }; // 创建 VTable 实例 const vtableInstance = new VTable.ListTable( document.getElementById("container")!, option ); ## 结果展示 Results 在线效果参考：[https://codesandbox.io/s/vtable-showoverflowtexttooltip-qq597m](https://link.segmentfault.com/?enc=OgHjVQsgYeqvmk79Z8vNQg%3D%3D.IVQymuQdODspCDc%2BOhrFQRa5hTu3%2FCpZwQIn%2B6W99Pq0q%2F%2BgLKer7eoUtXrNTGGnTmHd2K%2Fo3ku4A6Ydd7Xg%2Bw%3D%3D)  ## 相关文档 Related Documentation Tooltip demo：[https://visactor.io/vtable/demo/component/tooltip](https://link.segmentfault.com/?enc=0hcD%2F4EEqHZ4PJ3OKFW4CQ%3D%3D.3QWEYOyypjzFYc0mH3gRa9yiJdV3TZ%2FFvMd4HAhUmfuDgAkooh37iMhnA8Nhs7K4gZFbnpXXj1%2Fs5%2BQVXDZrfQ%3D%3D) Tooltip 教程：[https://visactor.io/vtable/guide/components/tooltip](https://link.segmentfault.com/?enc=HBRkc%2Bu9jx9trAau9qEH3A%3D%3D.A0KcjJyw%2B78EvW9Hk7zUYVfDjaT1umdKq3At3kk%2BEtv1g814n4oXrjouCsfJRhFCJM7s0triH0IuuaWHG%2BixVQ%3D%3D) 相关api：[https://visactor.io/vtable/option/ListTable#tooltip.isShowOve...](https://link.segmentfault.com/?enc=dPM%2B1eEl6pOleqgx6UN%2Bsg%3D%3D.HJqJgiNIT1u3%2FMmKtPDTdlkGLb2zgUQ8u6Ez%2FsGsA0jE8LV3dtQwlSojULVgqjb6lgMqiypz%2Bbh6HOB5P778CAAP3Jaw9%2FH55vd8FDIU3QQ%3D) github：[https://github.com/VisActor/VTable](https://link.segmentfault.com/?enc=pOOXXNZhWYnQg5I8paNIPQ%3D%3D.2TNpihHRD1ZDOxVCDSfz4t8llZP0Bm2Bw1Y55q%2Be4KXkVw6gm%2F5Bcppde8Gq2cMe)