Javascript 在StrictMode React材质UI中不推荐使用findDOMNode

我在React material UI项目中遇到此错误

通过查看错误，我猜它可能出现在

Drawer.js

组件中的某个地方。 这是我完整的

Drawer.js

组件

import React，{Fragment，useState}来自“React”；
从“clsx”导入clsx；
从“@material ui/core/styles”导入{makeStyles，useTheme}”；
从“@物料界面/核心/抽屉”导入抽屉；
从“@material ui/core”导入{List，Collapse}”；
从“@material ui/core/Divider”导入分隔器；
从“@material ui/core/ListItem”导入ListItem；
从“@material ui/core/IconButton”导入图标按钮；
从“@material ui/core/ListItemText”导入ListItemText；
从“./../store/actions/authActions”导入{toggleDrawer}”；
从“@material ui/icons/ExpandLess”导入ExpandLess；
从“@material ui/icons/ExpandMore”导入ExpandMore；
从“@material ui/icons/ChevronLeft”导入ChevronLeftIcon；
从“@material ui/icons/ChevronRight”导入ChevronRightIcon；
//从“@material ui/core/ClickAwayListener”导入ClickAwayListener
从'react router dom'导入{useHistory}；
从“react redux”导入{connect}；
从“react router”导入{withRouter}；
const useStyles=makeStyles({
名单：{
宽度：250，
},
完整列表：{
宽度：“自动”，
},
});
功能临时抽屉（道具）{
const classes=useStyles（）；
const theme=useTheme（）；
//const[open，setOpen]=React.useState（false）；
const[openIndex，setOpenIndex]=useState（0）；
让历史=使用历史（）；
//常量handleDrawerOpen=（）=>{
//setOpen（真）；
// };
常量handleDrawerClose=（）=>{
props.toggleDrawer（）；
};
常量handleClick=（索引）=>{
if（openIndex==索引）{
setOpenIndex（-1）；
}否则{
setOpenIndex（index）；
}
};
const ontogle=（）=>（事件）=>{
如果(
event.type==“keydown”&&
（event.key==“Tab”| | event.key==“Shift”）
) {
返回；
}
props.toggleDrawer（）；
};
const onRoute=（路径）=>{
//道具。历史。推（路径）；
历史。推送（路径）；
props.toggleDrawer（）；
};
常量列表=（锚定）=>(
{theme.direction===“ltr”(
) : (
)}
{props.permissions.map（（路由、索引）=>(
handleClick（索引）}>
{index==openIndex？：}
{route.children.length&&(
{route.children.map（（child，idx）=>(
onRoute（child.path）}
>
))}
)}
))}
{/*  */}
);
返回(
{props.token&&(
{列表（“左”）}
)}
);
}
常量mapStateToProps=（状态）=>{
返回{
isDrawerOpen:state.auth.isDrawerOpen，
令牌：state.auth.token，
权限：state.auth.routes，
};
};
使用路由器导出默认值(
连接（mapStateToProps，{toggleDrawer}）（临时抽屉）
);您只需要创建一个新的childComponent，react.forwardRef传递相应的props和ref：

const ChildComponent = React.forwardRef((props, ref) =>
  <div ref={ref}>
    <yourChildcomponent {...props} />
  </div>
);

const ChildComponent=React.forwardRef（（props，ref）=>
);

在渲染中，更改新对象的原始子对象的名称：

<ChildComponent... />


只需删除
索引中的
。jsx
这是否回答了您的问题？这是一个警告，不是一个错误，顺便说一下。。。解决方法是（1）忽略警告并继续，（2）打开一个问题并希望他们解决，（3）分叉项目回购，自己解决并打开PR，希望它得到批准和合并，（4）找到另一个抽屉组件。问题解决了吗