So verschieben Sie die MUI DataGrid-Paginierungstabelle mithilfe von CustomPagination nach links

Question

Hallo zusammen, ich versuche, das MUI-Datenraster besser zu verstehen und die Designspezifikationen der Tabellenansicht zu erfüllen. Ich verwende das DataGrid in MUI für die Paginierung, ich verwende deren benutzerdefinierte Implementierung, weiß aber nicht wie Um dies zu tun, weil CustomPagination vom Stamm des DataGrid überschrieben wird, ändert sich die Position und ich werde die CodeSandbox von MUI für eine benutzerdefinierte Implementierung und das, was ich erreichen möchte, freigeben.

codesanbox demo=> https://codesandbox.io/s/ybuq4n?file=/demo.tsx Suchergebnisse geben Sie hier eine Bildbeschreibung ein

Ich habe versucht, nach relevanter Dokumentation zu suchen, aber keine Ergebnisse.

Answer 1

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

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

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

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

export default CustomFooter;

希望这有帮助。