带有模板的内部块返回的块计数为零

Question

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

我遇到的问题是，在首次创建块时，“ blockCount”的值在一秒钟内为0，因此在创建之前会先将其自身删除。这是getBlockCount的错误，还是在我检查块计数之前是否有等待模板填充InnerBlocks的方法？

这里是我的edit函数以供参考。

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>
  )
}