首页 文章

`edit()`返回模态抛出异常

提问于
浏览
0

我有一个简单的按钮,应该启动模态straight from the Modal example

edit: withState( {
        isOpen: false,
    } )( ( { isOpen, setState } ) => (
        <div>
            <Button isDefault onClick={ () => setState( { isOpen: true } ) }>Open Modal</Button>
            { isOpen ?
                <Modal
                    title="This is my modal"
                    onRequestClose={ () => setState( { isOpen: false } ) }>
                    <Button isDefault onClick={ () => setState( { isOpen: false } ) }>
                        My custom close button
                    </Button>
                </Modal>
                : null }
        </div>
    ) ),

但是,它会引发异常:

警告:React.createElement:type无效 - 期望一个字符串(对于内置组件)或类/函数(对于复合组件)但得到:undefined . 您可能忘记从其定义的文件中导出组件,或者您可能混淆了默认导入和命名导入 .

1 回答

  • 0

    我犯的错误是假设 Modal 存在 editor . 我有这个:

    const {Button, Modal} = editor;
    

    将导入更正为以下内容,修复此问题:

    const {Button, Modal} = wp.components;
    

    在后端,当您注册组件时,您将希望将 wp-components 作为依赖项,当然:

    wp_register_script(
        'recipe-block',
        ZRDN_PLUGIN_DIRECTORY_URL . $relativeScriptPath, // File.
        array( 'wp-components','wp-blocks', 'wp-i18n', 'wp-compose', 'wp-editor', 'wp-data','wp-element', 'underscore' ), // Dependencies.
        filemtime( ZRDN_PLUGIN_DIRECTORY . $relativeScriptPath ) // filemtime — Gets file modification time.
    );
    

相关问题