Разработка Гутенберга: Как я могу написать блок, используя InnerBlocks вместе с компонентом RichText - PullRequest
0 голосов
/ 08 февраля 2019

У меня есть требование, где мне нужно разместить InnerBlocks рядом с RichText компонентом.Вот так:

edit: function( props ) {
    var textContent = props.attributes.textContent;
    function onChangeTextContent( content ) {
    props.setAttributes( { textContent: content } );
    }

   return (
    <div className={ props.className }>
                <label class="editor-content-section-label">Content for gray section</label>
        <RichText
                    className={props.className}
                    onChange={onChangeTextContent}
                    value={textContent}
                    placeholder="Add content"
                />
                <InnerBlocks allowedBlocks={'hallmark/white-content-container'}/>
    </div>
   );
},
save: function( props ) {
   return null;
},

Я новичок в разработке Гутенберга.У меня три вопроса.

  1. Это правильный способ сделать это?Требование white-content должно входить в контейнер RichText.
  2. Как я могу сохранить весь контент, используя render_callback.Функция обратного вызова прекрасно сохраняет содержимое RichText, но я не знаю, как сохранить содержимое InnerBlock с помощью render_callback.

Окончательный вывод будет выглядеть следующим образом:

<div class="gray-content">
   Content of RichText 
   <div class="white-content">
       Content of InnerBlock
   </div>
</div>
  1. Хотя я ограничил InnerBlocks сеять только один блок (<InnerBlocks allowedBlocks={'hallmark/white-content-container'}/>), в диалоге вставки отображаются все доступные блоки, как основные, так и пользовательские.

Пожалуйста, дайте мне знать, как я могу это сделать!

...