古腾堡区块-反应。儿童仅应接收单个React元素子元素

Question

当我试图在WordPress中添加工具提示时，同时创建古腾堡块
它显示一个错误。检查下面

不变违反：最小化反应错误#143；参观https://reactjs.org/docs/error-decoder.html?invariant=143

反应儿童仅应接收单个React元素子元素

这是我的代码，我正在尝试。

<Fragment>
    <div className="my-block-class">
        <Tooltip text={ __( 'Select Grid' ) }>
            { getIcon( 'block-icon', true ) }
        </Tooltip>
    </div>
    <InnerBlocks
        template={ this.getBlockTemplate() }
        templateLock="all"
        allowedBlocks={ [ 'hwb/my-block' ] }
    />
</Fragment>

问题出在这段代码中。

<Tooltip text={ __( 'Select Grid' ) }>
    { getIcon( 'block-icon', true ) }
</Tooltip>

当我删除工具提示时，代码工作正常。

使现代化

getIcon（）返回我也尝试过的svg图标Dashicon它不工作，这意味着问题不在getIcon（）函数中。

我也这样试过了。

<Tooltip text={ __( 'Select Grid' ) }>
    <Dashicon icon="edit" />
</Tooltip>




Answer 1

我尝试的getIcon函数中一定有问题Dashicon对我来说运行正常。您可能没有从wp组件导入Dashicon

试试这个。

const { Tooltip, Dashicon } = wp.components;

<Tooltip text={ __( 'Select Grid' ) }>
    <Dashicon icon="edit" />
</Tooltip>