【问题标题】:How to render InnerBlocks in Gutenberg version 4 using php $content如何使用 php $content 在 Gutenberg 版本 4 中渲染 InnerBlocks
【发布时间】:2018-10-30 16:00:39
【问题描述】:

这在 Gutenberg 3 上运行良好:

function render_block($attrs, $content){
    ob_start();
        echo $content;
    return ob_get_clean();
}

但随着古腾堡的最新更新,$content 始终为空,即使从保存回调传递它为:

    save: function(props) {
        return el( InnerBlocks.Content );
    },

非常感谢任何帮助。

【问题讨论】:

    标签: wordpress-gutenberg gutenberg-blocks


    【解决方案1】:

    这实际上是 Gutenberg 本身的一个错误,已在 WP 5.1.1 中修复

    谢谢

    【讨论】:

      【解决方案2】:

      block.js

      (function (blocks, editor, components, i18n, element) {
      
          var el = element.createElement;
      
          blocks.registerBlockType('block-category/block-name', {
      
              ...
      
              edit: function(props) {
      
                  el(editor.InnerBlocks, {
                      allowedBlocks: ['core/heading'],
                      template: [['core/heading', {'placeholder':'Placeholder text'}]],
                  })
      
              },
      
              save: function(props) {
      
                  return el(editor.InnerBlocks.Content);
      
              }
      
          });
      
      })(
        window.wp.blocks,
        window.wp.editor,
        window.wp.components,
        window.wp.i18n,
        window.wp.element
      );
      

      block.php

      add_action('init', function() {
      
          wp_register_script(
              'block_script',
              plugins_url('block.js', __FILE__),
              array('wp-blocks', 'wp-components', 'wp-element', 'wp-i18n', 'wp-editor'),
              filemtime(plugin_dir_path(__FILE__) . 'block.js'),
              true
          );
      
          'editor_script' => 'block_script',
      
          register_block_type('block-category/block-name', array(
      
              'render_callback' => function($attributes, $content) {
      
                  return $content;
      
              }
      
          ));
      
      });
      

      【讨论】:

      • 请确保说明您所做的更改以及原始代码有什么问题。仅发布代码块会使未来访问此问题的访问者难以弄清楚解决方案是什么。谢谢!
      猜你喜欢
      • 2022-06-19
      • 2021-03-31
      • 1970-01-01
      • 2019-05-12
      • 2018-12-06
      • 1970-01-01
      • 2013-11-29
      • 2017-08-21
      • 2016-12-27
      相关资源
      最近更新 更多