带有JS转换警告的对话框，提示“ findDOMNode在StrictMode中已弃用”

Question

我已经创建了一个简单的Dialog组件，该组件可拖动，并且可以根据此处的示例代码进行过渡（使用Grow）： https://material-ui.com/components/dialogs/#transitions（并向下滚动以获取可拖动的示例）

当我尝试使用此对话框时，它可以完美运行。但是，控制台每次都会收到一些警告：

这是我的代码：

    const Transition = React.forwardRef(function Transition(props, ref) {
        return <Grow ref={ref} {...props} />;
    });

    export class PaperComponent extends React.Component {
        render() {
            return (
                <Draggable handle="#draggable-dialog-title" cancel={'[class*="MuiDialogContent-root"]'}>
                    <Paper {...this.props} />
                </Draggable>
            );
        }
    }

    export class BasicDialog extends React.Component {
        render() {
            return (
                <Dialog
                    open={this.props.dialogData.title ?? false}
                    PaperComponent={PaperComponent}
                    TransitionComponent={Transition}>
                    <DialogTitle style={{ cursor: 'move' }} id="draggable-dialog-title">
                        {this.props.dialogData.title}
                    </DialogTitle>
                    <DialogContent style={{ textAlign: 'center' }}>
                        <DialogContentText>
                            {this.props.dialogData.text}
                        </DialogContentText>
                        {this.props.dialogData.content}
                    </DialogContent>
                    <DialogActions style={{ justifyContent: 'center' }}>
                        <ButtonGroup color="primary">
                            <Button onClick={() => this.props.onComplete()}>OK</Button>
                        </ButtonGroup>
                    </DialogActions>
                </Dialog>
            );
        }
    }

我该如何解决？它不会影响我的应用程序的功能，但是我不喜欢控制台中的错误/警告。而且我以为我遵循了Material UI网站上的说明，但是如果我正确地做到了，我会收到错误消息吗？

Answer 1

删除警告的唯一方法是删除应用程序中的严格模式，有一些具有警告意义的重要ui组件，其github页面中存在一些具有相同问题的问题：{{ 3}}，解决问题的最简单方法是删除严格模式，您可以在reactDOM渲染调用中做到这一点：

ReactDOM.render(<App />, document.getElementById('root'))

这是直到他们纠正错误之前的最佳方法。

Btw严格模式是一种模式，它会在应用程序可能存在的某些潜在问题上显示警告，例如，使用已弃用的组件生命周期方法。在这里您可以阅读更多信息：https://github.com/mui-org/material-ui/issues/20561