I have jsx like this,
import TableCell from '@mui/material/TableCell';
import TableCell from '@mui/material/TableRow';
<TableRow>
<TableCell sx={{minWidth:45,width:45,maxWidth:45,backgroundColor:"white"}}></TableCell>
</TableRow>
<TableRow>
is from the material ui
Now I want to enhance the TableRow like this,
const EnhancedTableRow= forwardRef((props,ref) => {
const myDivRef = useRef();
useImperativeHandle(ref,()=>({
setReload: () =>{
setReload(!reload);
},
getBoundingClientRect: ()=>{
return myDivRef.current.getBoundingClientRect();
},
isInDiv:(x,y) =>{
var pos = myDivRef.current.getBoundingClientRect();
if (x >= pos.x && y >= pos.y &&
x <= pos.x + pos.width &&
y <= pos.y + pos.height){
return true;
}
return false;
}
}));
return (<div ref={myDivRef}>
<TableRow sx={props.sx}>
????
</TableRow>
</div>)
});
So, when I use EnhancedTableRow
instead of TableRow
How can I inheritance the value between tag such as <TableCell sx={{minWidth:45,width:45,maxWidth:45,backgroundColor:"white"}}></TableCell>
to the EnhancedTableRow
component?
I want to put this value in ????
in EnhancedTableRow