我是 MUI 新手,我想将列的内容向右对齐。我的代码如下所示:
<MUIDataTable
title={""}
data={data || []}
columns={realColumns ? realColumns(data, modeMO) : columns(data, modeMO)}
options={{
filterType: "textField",
responsive: "simple",
selectableRows: selectable, // set checkbox for each row
search: false, // set search option
filter: false, // set data filter option
download: false, // set download option
print: false, // set print option
pagination: true, //set pagination option
viewColumns: false, // set column option
elevation: 0,
rowsPerPageOptions: [10, 20, 40, 80, 100],
//setCellProps: () => ({ align: 'right' }) ,
onRowSelectionChange: (
currentRowsSelected,
allRowsSelected,
rowsSelected
) => {
setSelectedRows(
allRowsSelected.map((el) => {
return data[el.dataIndex];
})
);
},
selectToolbarPlacement: "none"
}}
/>;
显示的内容如下: table Picture
所以我想将“Montant à régler”列中的所有数字向右对齐。 有人可以帮忙吗?
最佳答案
免责声明:这完全未经测试,只是“列”的一小部分。
为您的列提供自定义渲染并设置单元格属性,例如:
export const columns = [
{
name: "category",
label: "Fun Guy Category",
options: {
setCellProps: () => ({ style: { minWidth: "100px", maxWidth: "800px", justifyContent: 'end' }}),
customBodyRender: (data, type, row) => {return <pre>{data}</pre>}
},
},
关于javascript - 将列内容与单元格右侧对齐 React MUIDataTable,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/70277352/