【问题标题】:Printing Grid Component打印网格组件
【发布时间】:2017-12-09 18:11:17
【问题描述】:

我有一个带有单个固定行的 MultiGrid 组件。我想打印结果,但由于 x 轴上有多个列溢出,打印输出会被截断。

是否可以将每一行包装在另一个元素中,然后使用 display table-cell/table-row 来获得所需的类似表格的行为?额外的好处是表格可以轻松拉伸整个页面,即使列数很少。

【问题讨论】:

    标签: react-virtualized


    【解决方案1】:

    是否可以将每一行包装在另一个元素中

    是的。可以通过注入您自己的 cellRangeRenderer 属性来包装行。话虽这么说,我真的不推荐它。 RV 并没有真正的“行”或“列”——只是定位的单元格。包装会添加额外的元素,这可能会降低滚动性能。 (可能不多,但每一点都对滚动很重要。)

    然后使用 display table-cell/table-row 得到想要的, 类似表格的行为?

    如果您使用的是MultiGrid,我假设您有足够的列来保证水平数据和垂直数据窗口化?在这种情况下,我不认为display:table 真的适合你。我不确定它会给你带来什么。

    您是否考虑过仅渲染非 RV 布局,专门用于打印?我自己没有这样做,但也许你可以利用beforeprint/afterprintsetState 来呈现不同的结果?或者,当启用打印模式以仅渲染整个水平轴时,您可以尝试将 overflowColumnCount 设置得非常高。

    不幸的是,我对此并没有太多经验。您可能需要进行一些实验才能获得最佳性能的解决方案。 :)

    【讨论】:

    • 谢谢。我最终有两个组件 - 一张桌子和一张网格。表格与打印媒体查询一起显示,否则为网格。我有一些隐藏用户指定列的功能,所以它可以解决。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多