`edit ()`, которая возвращает исключение модальных бросков - PullRequest
0 голосов
/ 10 декабря 2018

У меня есть простая кнопка, которая должна запускать модальный прямо из модального примера :

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: тип недействителен - ожидается строка (для встроенных компонентов) или класс / функция (для составных компонентов), но получено: undefined.Скорее всего, вы забыли экспортировать компонент из файла, в котором он определен, или вы перепутали импорт по умолчанию и имена.

1 Ответ

0 голосов
/ 10 декабря 2018

Я допустил ошибку, предполагая, что 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.
);
...