wordpress - JavaScript (WordPress) 中的古腾堡编辑器内容

Question

回到 TMCE 时代，我们可以轻松地使用editor.getContent(). 但是在新的古腾堡编辑器中，我找不到这样做的方法。

我需要所有编辑器内容为 HTML（它将保存在数据库中的方式）。

我找到wp.block.serialize()了听起来很有希望的方法。但似乎需要块（作为参数）。所以我有点卡住了。

Answer 1

从 3.1 版开始。古腾堡，试试这个：

获取普通块内容：

var originalContent = wp.data.select( "core/editor" ).getCurrentPost().content;
var editedContent = wp.data.select( "core/editor" ).getEditedPostContent();

渲染帖子（转换为块）：

wp.blocks.parse( editedContent );

Answer 2

您可能想探索window._wpGutenbergPost.content同时具有 araw和renderedcontent 的内容。这是，目前。事情可能会改变:)

Answer 3

您可以使用选择器，它允许我们检索数据，并且类似地，例如，要更新在 Gutenberg 中编辑的帖子的标题，您可以执行以下操作：

wp.data.dispatch( 'core/editor' ).editPost( { title: 'New Title' } );

您可以在此处查看操作文件https://github.com/WordPress/gutenberg/blob/v2.9.2/editor/store/actions.js，以查看由 core/editor 命名空间定义的操作的完整列表。

查看更多：https ://riad.blog/2018/06/07/efficient-client-data-management-for-wordpress-plugins/

Answer 4

我有类似的问题，但无法发表评论。提供的答案流确实设置了帖子标题，但从 4.5.1 开始不处理内容。

为了更新帖子内容，我可以插入一个段落块。这是我的代码：

wp.data.dispatch( 'core/editor' ).editPost( { title: 'New Title' } );
var editedContent = wp.data.select( "core/editor" ).getEditedPostContent();
var newBlock = wp.blocks.createBlock( "core/paragraph", {
    content: editedContent,
});
wp.data.dispatch( "core/editor" ).insertBlocks( newBlock );