自定义古腾堡块自由格式内容随机消失

Question

我正试图解决一个问题，我有一个自定义的古腾堡块内的内容似乎随机消失(我还没有完全找到触发器)

见下面代码:

export default registerBlockType(
'biscuit/content-filter',
{
title: __( 'Title', 'biscuit' ),
description: __( 'Story content block.', 'biscuit'),
category: 'common',
icon: icons.classic,
keywords: [
__( 'Content', 'biscuit' ),
__( 'Story', 'biscuit' ),
],
transforms: {
from: [
{
type: 'block',
blocks: [ 'core/paragraph' ],
transform: function ( attributes ) {
const innerBlocks = wp.blocks.rawHandler({
innerContent: attributes.content
});
return wp.blocks.createBlock( 'biscuit/content-filter', {
}, innerBlocks );
},
},
]
},
edit: props => {
const { attributes: { title }, className, setAttributes } = props;
return (
<div className={ className }>
<div>
<RichText
tagName="h3"
value={ title }
onChange={ title => setAttributes({ title })}
placeholder={__('Enter title', 'biscuit')}
// keepPlaceholderOnFocus={ true }
/>
<label class="small">{ __( 'Title will only appear on the page.', 'biscuit' ) }</label>
</div>Content', 'biscuit' ) }</label></h4>
<InnerBlocks template={TEMPLATE} templateLock="all" />
</div>
);
},
save: props => {
return <InnerBlocks.Content />;
},
},
);
const setExtraPropsToBlockType = (props, blockType, attributes) => {
if( props.children && blockType.name === 'core/freeform' ) {
props.children = props.children.replace(/<p><!-- /wp:paragraph --> <!-- wp:paragraph --></p>/g,"");
props.children = props.children.replace(/<p><!-- wp:paragraph --></p>/g,"");
props.children = props.children.replace(/<p><!-- /wp:paragraph --></p>/g,"");
props.children = props.children.replace(/<!-- wp:paragraph -->/g,"");
props.children = props.children.replace(/<!-- /wp:paragraph -->/g,"");
props.children = props.children.replace(/&lt;/p&gt;/g,"");
props.children = props.children.replace(/&lt;p&gt;/g,"");
props.children = props.children.replace(/&lt;!-- wp:paragraph --&gt;/g,"");
props.children = props.children.replace(/&lt;!-- /wp:paragraph --&gt;/g,"");
props.children = props.children.replace(/&lt;!– wp:paragraph –&gt;/g,"");
props.children = props.children.replace(/&lt;!– /wp:paragraph –&gt;/g,"");
props.children = props.children.replace(/<!-- wp:quote -->/g,"");
props.children = props.children.replace(/<!-- /wp:quote -->/g,"");
props.children = props.children.replace(/&lt;!-- wp:quote --&gt;/g,"");
props.children = props.children.replace(/&lt;!-- /wp:quote --&gt;/g,"");
props.children = props.children.replace(/&lt;!– wp:quote –&gt;/g,"");
props.children = props.children.replace(/&lt;!– /wp:quote –&gt;/g,"");
props.children = props.children.replace(/<!-- wp:/g,"<!--");
props.children = props.children.replace(/<!-- /wp:/g,"<!--");
}
return props;
};
wp.hooks.addFilter(
'blocks.getSaveContent.extraProps',
'biscuit/content-filter',
setExtraPropsToBlockType
);

有时freeform会决定在随机的帖子上清空。这似乎与内容无关。我可以跳转到帖子修订，然后返回找到最初发布的内容，所以至少我有这个。

我已经在一个暂存站点上做了测试:

• 新建帖子
• 添加自定义块并从消失的自由格式块中输入相同的文本
• 添加其他块-引用，段落，图像等，看看是否将新内容保存在块外触发它
• 从受影响的帖子复制任何其他元素

这些都没有触发它。块可以在1个月到1年后的任何地方消失。我怀疑它与编辑/保存帖子有关，但是我已经测试过了，它没有触发。

任何帮助都将是非常感激的:)

Answer 1

开头的<h4>和<label>标记在edit()的第40行中缺失:

</div>Content', 'biscuit' ) }</label></h4>

替换为:

</div><h4><label>{__('Content', 'biscuit')}</label></h4>

我假设在某个时刻块是有效的，第40行的第一部分被意外地删除了。这个场景可能会产生你所看到的副作用:大多数包含区块的帖子都是有效的，但一些在区块失效时编辑的帖子有问题。

一旦你做了改变，确保在测试之前清除浏览器缓存。检查浏览器控制台是否有错误，如果有，请将它们添加到问题中。