主页 / user-20438587

Bianca's questions

Martin Hope
Bianca
Asked: 2025-04-09 18:42:51 +0800 CST
  • 5

我有很多数据网格组件，它们彼此非常相似，除了我作为道具传递的一些参数之外，它们在插槽内共享相同的自定义页脚和一些样式

export default function CustomizedDataGrid(otherParams) {
return (
            <Box sx={{ width: "100%", overflow: "hidden" }}>
                <DataGrid
                    disableRowSelectionOnClick
                    sx={{
                        border: "none",
                        overflowY: "hidden",
                        width: "100%",
                    }}
                    slots={{
                        footer: CustomFooter
                    }}
                    {...otherParams}
                    />
            </Box>
        ); }

但是当我实例化CustomizedDataGrid并传递一个插槽参数时，像这样

export default function SpecializedDataGrid() {
return (
      <CustomizedDataGrid
            columns={columns}
            rows={rows}
            slots={{
                toolbar: CustomToolbar,
            }} /> ); }

它覆盖了在CustomizedDataGrid内部声明的槽位，因此工具栏会显示，但页脚不会显示。有没有办法将我在SpecializedDataGrid内部作为props传递的参数与我在CustomizedDataGrid内部声明的参数合并？

javascript