问古腾堡街区移动

EN

我不知道是否有像blockMove或blockIndexChange这样的事件或Gutenberg钩子，但是您可以使用subscribe()来自@wordpress/数据包来侦听块索引的更改。

Working示例 using挂钩

• WordPress依赖项:从“@wordpress/块编辑器”导入{ useBlockProps }；从“@wordpress/element”导入{ useState、useEffect }；从“@wordpress/data”导入{ useSelect、订阅}；
• 块的edit()函数:函数编辑({ clientId }){ const { getBlockIndex }= useSelect(“核心/块编辑器”)；//设置初始索引。const = useState( getBlockIndex( clientId ) )；//订阅该块一旦附加到DOM。useEffect( () ) => { //侦听块索引更改，必要时设置当前索引。//听完后，只需调用unsubscribe()即可。取消订阅=订阅( () => { const blockIndex = getBlockIndex( clientId )；if ( currentBlockIndex !== blockIndex ){ console.log( block move detected; from index ${ currentBlockIndex} to ${ blockIndex } )；setBlockIndex( blockIndex )；//更新当前索引} )；console.log( subscribed; clientId is ${ clientId } )；//取消订阅；例如，在从编辑器中删除此块之后。返回函数清除(){取消订阅( )；console.log( unsubscribed - stopped listening to index changes; clientId is ${ clientId } )；}；//注意currentBlockIndex返回( 当前块索引：{ currentBlockIndex } )；}因此，当块显式移动或其索引更改时，将调用useEffect回调，因为另一个块被移动到上述块的当前位置。

您还可以看到我的答案这里作为edit函数外部的一个示例，该函数使用wp.domReady()，并在确定当前post类型后添加块样式。