javascript - 未捕获的类型错误：无法读取未定义的属性“getParent”

问题描述

组件创建（抽屉antd）：

export default class Cadastrar extends React.Component {
    state = {
        visible: true,
    }


    showDrawer = () => {
        this.setState({
            visible: true,
        })
    }

    closeDrawer = () => {
        this.setState({
            visible: false,
        })
    }

    render() {
        return (
            <>
                <Drawer
                    title="Create a new account"
                    width={720}
                    onClose={this.closeDrawer}
                    visible={this.state.visible}
                    bodyStyle={{ paddingBottom: 80 }}
                    footer={
                        <div
                            style={{
                                textAlign: 'right',
                            }}
                        >
                            <Button
                                onClick={this.closeDrawer}
                                style={{ marginRight: 8 }}
                            >
                                Cancel
                            </Button>
                            <Button onClick={this.closeDrawer} type="primary">
                                Submit
                            </Button>
                        </div>
                    }
                >
                   teste
                </Drawer>
            </>
        )
    }
}

索引用户：

export default class Usuarios extends React.Component {
    render() {
        const columns = [...]

        const data = [...]

        return (
            <React.Fragment>
                <Row gutter={16} className="box-actions">
                    <Col className="gutter-row" span={18} align="start">
                        {' '}
                        <Button
                            type="primary"
                            onClick={() => {
                                this.refs.cadastrar.showDrawer()
                            }}
                        >
                            Cadastrar
                        </Button>
                    </Col>
                    <Col className="gutter-row" span={6}>
                        <Search
                            placeholder="Buscar..."
                            onSearch={value => console.log(value)}
                        />
                    </Col>
                </Row>
                <Table columns={columns} dataSource={data} />
                <Cadastrar ref="cadastrar" />
            </React.Fragment>
        )
    }
}

注意：组件：

<Cadastrar ref="cadastrar" />

被称为

<Button
   type="primary"
   onClick={() => {
     this.refs.cadastrar.showDrawer()
   }}
>

错误：

PortalWrapper.js?d56f:236 Uncaught TypeError: Cannot read property 'getParent' of undefined
    at getDerivedStateFromProps (PortalWrapper.js?d56f:236)
    at applyDerivedStateFromProps (react-dom.development.js:12603)
    at updateClassInstance (react-dom.development.js:13207)
    at updateClassComponent (react-dom.development.js:17107)
    at beginWork (react-dom.development.js:18620)
    at HTMLUnknownElement.callCallback (react-dom.development.js:188)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:237)
    at invokeGuardedCallback (react-dom.development.js:292)
    at beginWork$1 (react-dom.development.js:23203)
    at performUnitOfWork (react-dom.development.js:22154)
    at workLoopSync (react-dom.development.js:22130)
    at performSyncWorkOnRoot (react-dom.development.js:21756)
    at react-dom.development.js:11089
    at unstable_runWithPriority (scheduler.development.js:653)
    at runWithPriority$1 (react-dom.development.js:11039)
    at flushSyncCallbackQueueImpl (react-dom.development.js:11084)
    at flushSyncCallbackQueue (react-dom.development.js:11072)
    at discreteUpdates$1 (react-dom.development.js:21893)
    at discreteUpdates (react-dom.development.js:806)
    at dispatchDiscreteEvent (react-dom.development.js:4168)
getDerivedStateFromProps @ PortalWrapper.js?d56f:236
applyDerivedStateFromProps @ react-dom.development.js:12603
updateClassInstance @ react-dom.development.js:13207
updateClassComponent @ react-dom.development.js:17107
beginWork @ react-dom.development.js:18620
callCallback @ react-dom.development.js:188
invokeGuardedCallbackDev @ react-dom.development.js:237
invokeGuardedCallback @ react-dom.development.js:292
beginWork$1 @ react-dom.development.js:23203
performUnitOfWork @ react-dom.development.js:22154
workLoopSync @ react-dom.development.js:22130
performSyncWorkOnRoot @ react-dom.development.js:21756
(anonymous) @ react-dom.development.js:11089
unstable_runWithPriority @ scheduler.development.js:653
runWithPriority$1 @ react-dom.development.js:11039
flushSyncCallbackQueueImpl @ react-dom.development.js:11084
flushSyncCallbackQueue @ react-dom.development.js:11072
discreteUpdates$1 @ react-dom.development.js:21893
discreteUpdates @ react-dom.development.js:806
dispatchDiscreteEvent @ react-dom.development.js:4168
react_devtools_backend.js:6 The above error occurred in the <PortalWrapper> component:
    in PortalWrapper (created by DrawerWrapper)
    in DrawerWrapper (created by Context.Consumer)
    in Drawer (created by Context.Consumer)
    in withConfigConsumer(Drawer) (at teste.js:23)
    in Teste (at teste/index.js:9)
    in Index (at _app.js:49)
    in main (created by Basic)
    in Basic (created by Context.Consumer)
    in Content (at _app.js:48)
    in section (created by Context.Consumer)
    in BasicLayout (created by Context.Consumer)
    in Layout (at _app.js:30)
    in section (created by Context.Consumer)
    in BasicLayout (created by Context.Consumer)
    in Layout (at _app.js:28)
    in AppLayout
    in ErrorBoundary (created by ReactDevOverlay)
    in ReactDevOverlay (created by Container)
    in Container (created by AppContainer)
    in AppContainer
    in Root

React will try to recreate this component tree from scratch using the error boundary you provided, ErrorBoundary.

我以与 razzle 相同的方式使用它，但是当我迁移到 nextjs 时，它出现了这个错误

下一个代码： https ://gitlab.com/henriquezolini/next-antdesign （有错误）

带有 Razzle 的代码： https ://gitlab.com/henriquezolini/razzle-ant-design （作品）

标签： javascriptnode.jsreactjsnext.jsantd

javascript - 未捕获的类型错误：无法读取未定义的属性“getParent”

问题描述

解决方案

推荐阅读