如何使用 CustomPagination 将 MUI DataGrid 分页表移至左侧
P粉491421413
P粉491421413 2024-03-27 20:29:45
[CSS3讨论组]

大家好,我试图更好地理解 MUI 数据网格,并满足表视图的设计规范,我正在使用 MUI 中的 DataGrid 进行分页,我正在使用他们的自定义实现,但我不知道如何操作由于 CustomPagination 被 DataGrid 的根覆盖,它会改变位置,我将分享来自 MUI 的 CodeSandbox 以实现自定义实现以及我想要实现的目标。

codesanbox演示=> https://codesandbox.io/s/ybuq4n?file=/demo.tsx 搜索结果在此输入图片描述

我尝试搜索相关文档,但没有结果。

P粉491421413
P粉491421413

全部回复(1)
P粉955063662

遗憾的是,无法将对齐方式传递到 MUI DataGrid 的页脚。因此,您需要制作自定义页脚并重新安排页脚组件的默认顺序。所以你的代码需要看起来像这样。

DataGrid 用法: 如果您使用的是更新版本的 MUI 数据网格,请使用 slot 属性而不是组件,它已被弃用。

自定义页脚: 您需要确保您的自定义分页首先位于 GridFooterContainer 内。组件将是 在 html 中从上到下生成,因此将从左到右显示。

const CustomFooter = () => {
    
    const gridApi = useGridApiContext();
    
    return (
        
            {
                !!gridApi.current.getSelectedRows().size && 
                    
            }
        
    );
};

export default CustomFooter;

希望这有帮助。

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号