WordPress自定义区块修改attributes属性后不生效不保存问题

问题根因 #

你的配置存在两处核心错误导致属性无法持久化保存：

1. 区块注册逻辑未加载block.json配置：你在index.js中调用registerBlockType时，没有传入block.json的配置内容，导致WordPress无法识别你定义的pid属性规则，修改的属性值无法被正常序列化存储。
2. 属性类型不匹配：NumberControl组件返回的修改值为数字类型，但你在block.json中将pid的type定义为text（字符串类型），类型不一致会触发序列化校验失败，最终回退到默认值。

修复步骤 #

1. 修改index.js代码，导入并使用block.json配置完成区块注册：

import { registerBlockType } from '@wordpress/blocks';
import './style.scss';
import Edit from './edit';
import Save from './save';
// 新增：导入同目录下的block.json配置
import blockMetadata from './block.json';

// 直接传入metadata对象，自动读取属性、区块名等配置
registerBlockType( blockMetadata, {
    edit: Edit,
    save: Save,
} );

2. 统一pid的属性类型，二选一即可：

• 方案一：将block.json中pid的类型改为数字，适配NumberControl的返回值

"attributes": {
    "pid": {
        "type": "number",
        "default": 444
    }
}

• 方案二：如果需要保留text类型，修改edit.js中NumberControl的onChange逻辑，把值转成字符串再存储

onChange={ value => { setAttributes( {pid: String(value)})} }

3. 修复完成后重新执行项目构建：开发环境执行npm start，生产环境执行npm run build，重新添加区块测试即可正常保存属性值。

内容的提问来源于stack exchange，提问作者Kim Aldis