Reactjs 在对话框上显示图表

我有一些代码，用于在模态对话框中显示电路板的图像。目前，它不起作用，我想这一定是我使用getElementById的原因

你知道我做错了什么吗？我的非工作代码如下：

export const MyPiece = props => {

  new Chessboard(document.getElementById('board2'), {
    position:
      'rn2k1r1/ppp1pp1p/3p2p1/5bn1/P7/2N2B2/1PPPPP2/2BNK1RR w Gkq - 4 11',
    orientation: COLOR.black,
  });

  return (
    <>
        <DialogContent dividers>
        <Typography paragraph="true">
          Some text
        </Typography>
        <Paper id="board2"></Paper>
      </DialogContent>
    </>
  );
};

export const MyPiece=props=>{
新棋盘（document.getElementById（'board2'）{
职位：
“rn2k1r1/ppp1pp1p/3p2p1/5bn1/P7/2N2B2/1PPPPP2/2BNK1RR w Gkq-4 11”，
方向：颜色。黑色，
});
返回(
一些文本
);
};