在post中获取已使用的块并检测更改
在gutenberg中，如何通过javascript在帖子中获得已使用块的列表？
然后，每当每个块的内容发生变化时，都要调用javascript函数。
我该怎么做？
wordpress gutenberg文档非常令人困惑，我无法理解它们：
回答 1
WordPress Development用户
发布于 2020-02-10 04:27:49
您可以使用getBlocks()访问js中在post中使用的块：
wp.data.select( 'core/block-editor' ).getBlocks();在更新更改方面，编辑器将其所有数据保存在存储区中，因此您可能希望根据需要对哪些更改作出反应来订阅和响应。例如：
( () => {
let blocksState = wp.data.select( 'core/block-editor' ).getBlocks();
wp.data.subscribe( _.debounce( ()=> {
newBlocksState = wp.data.select( 'core/block-editor' ).getBlocks();
if ( blocksState.length !== newBlocksState.length ) {
doMyJsFn();
}
// Update reference.
blocksState = newBlocksState;
}, 300 ) );
} )();您可以进一步筛选，以处理不同的更改。我只是使用长度比较，以保持简单的例子。您提到了对块内容的更改，因此您可以通过比较对象的blocksState键中的每个块，然后调用所需的任何函数来过滤在attributes变量和newBlocksState变量中返回的对象。
有其他方法可以做到这一点，这取决于当你说调用你自己的函数时，你想要做什么。只考虑在应用程序的状态发生变化时采取行动，而不是当DOM更改时。上面指向getBlocks()方法的链接应该会给您提供更多关于其中一些功能的想法。我还建议查看wp.data包的文档，其中详细介绍了如何更深入地使用数据包(例如所提到的subscribe方法)。
编辑:寻址评论：
上面的示例只检查是否blocksState和newBlocksState是相同的长度，即如果添加块或删除块。我在上面提到了这一点，以及您可以参考的资源和检查其他内容的方法。将根据您的需要进行额外的检查，只有您知道您自己的应用程序的逻辑，而不是我。使用上面的文档链接，我看到了一个名为getEditedPostContent()的方法，下面是检查post内容的一种方法：
( () => {
let contentState = wp.data.select( 'core/editor' ).getEditedPostContent();
wp.data.subscribe( _.debounce( ()=> {
newContentState = wp.data.select( 'core/editor' ).getEditedPostContent();
if ( contentState !== newContentState ) {
console.log( 'triggered' );
}
// Update reference.
contentState = newContentState;
}, 1000 ) );
} )();然后，当编辑器的内容发生变化时，这将在控制台中记录“触发”。我还增加了退出的间隔，以帮助覆盖当用户正在打字，所以它不会触发的频率。还有isTyping()方法，可以用来帮助进一步优化。
https://wordpress.stackexchange.com/questions/357267
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号