模板返回块计数为零的 InnerBlocks

Question

我正在尝试使用InnerBlocks模板创建一个块。由于块具有模板，因此块应始终至少具有 1 个子项。如果子计数达到 0，那么我想删除这个块，因为它将是空的。

我遇到的问题是，当第一次创建块时，"blockCount"的值在一瞬间为 0，因此它在创建之前会自行删除。这是getBlockCount的错误，还是有没有办法在我检查块计数之前等待模板填充InnerBlocks？

这是我的编辑功能供参考。

edit: props => {
const { setAttributes } = props
const { className } = props.attributes
const { removeBlock } = useDispatch('core/block-editor')
const { blockCount } = useSelect(select => ({
blockCount: select('core/block-editor').getBlockCount(props.clientId)
}))
if (blockCount === 0) {
removeBlock(props.clientId)
}
return (
<div className={ className }>
<InnerBlocks
allowedBlocks={ ['my/block'] }
template={ [['my/block']] }
templateLock={ false }
renderAppender={ false }
/>
</div>
)
}

Answer 1

在 Github 上提供的解决方案(并且运行良好(是将块长度保存到 ref，然后使用 Effect 监视更改，并在值返回 0 时删除块。

edit: props => {
const { setAttributes } = props
const { className } = props.attributes
const { removeBlock } = useDispatch('core/block-editor')
const { blockCount } = useSelect(select => ({
blockCount: select('core/block-editor').getBlockCount(props.clientId)
}))
const previousBlockCount = useRef(blockCount)
useEffect(() => {
if (previousBlockCount.current > 0 && blockCount === 0) {
removeBlock(props.clientId)
}
previousBlockCount.current = blockCount
}, [blockCount, props.clientId])
return (
<div className={ className }>
<InnerBlocks
allowedBlocks={ ['my/block'] }
template={ [['my/block']] }
templateLock={ false }
renderAppender={ false }
/>
</div>
)
}