古腾堡元信息在 post_content 字段中保存为 HTML 评论

Question

我是 Gutenberg 的新手，刚开始学习区块开发。今天我尝试创建一个引用 this and this.

的元字段

这就是我为自定义 post 类型注册元字段的方式：

function gb_meta_box_init() {
    register_meta( 'ss_event', 'event_hosted_by', array(
        'show_in_rest' => true,
        'single'       => true,
    ) );
}

add_action( 'init', 'gb_meta_box_init' );

阻止注册：

const { __ } = wp.i18n;
const { registerBlockType } = wp.blocks;
const { RichText } = wp.editor;

registerBlockType( 'ss-events/event-info', {
    title: __( 'Event Info' ),
    icon: 'welcome-view-site',
    category: 'common',
    keywords: [],

    attributes: {
        ev_date:{
            type: 'array',
            source: 'children',
            selector: '.event-date',
        },
        ev_time: {
            type: 'array',
            source: 'children',
            selector: '.event-time',
        },
        venue: {
            type: 'array',
            source: 'children',
            selector: '.event-venue',
        },
        ev_host: {
            type: 'string',
            meta: 'event_hosted_by',
        },
    },

    edit: function( props ) {

        /* define variables */
        let ev_date   = props.attributes.ev_date;
        let venue     = props.attributes.venue;
        let ev_time   = props.attributes.ev_time;
        let host      = props.attributes.ev_host;

        /* define functions */
        function onChangeEventDate( content ) {
            props.setAttributes( { ev_date: content } );
        }

        function onChangeEventTime( content ) {
            props.setAttributes( { ev_time: content } );
        }

        function onChangeVenue( content ) {
            props.setAttributes( { venue: content } );
        }

        function onChangeHost( content ) {
            props.setAttributes( { ev_host: content } );
        }


        return (
            <div id="ss-event-info">
                <h2>Event Information</h2>

                <div>
                    <label><b>Event Date</b></label>
                    <RichText
                        tagName="p"
                        className="event-date"
                        value={ ev_date }
                        onChange={ onChangeEventDate }
                        role="textbox"
                        aria-multiline="false"
                    />
                </div>

                <div>
                    <label>Event Time</label>
                    <RichText
                        tagName="p"
                        className="event-time"
                        value={ ev_time }
                        onChange={ onChangeEventTime }
                        role="textbox"
                        aria-multiline="false"
                    />
                </div>

                <div>
                    <label>Venue</label>
                    <RichText
                        tagName="p"
                        className="event-venue"
                        value={ venue }
                        onChange={ onChangeVenue }
                        role="textbox"
                        aria-multiline="false"
                    />
                </div>

                <div>
                    <label>Hosted by (this is defined as meta)</label>
                    <RichText
                        tagName="p"
                        className="event-host"
                        value={ host }
                        onChange={ onChangeHost }
                        role="textbox"
                        aria-multiline="false"
                    />
                </div>
            </div>
        );
    },

    save: function() {
        return null;
    },
} );

当我保存 post 并检查 post_content 字段的内容时，我看到的值是这样的：

<!-- wp:ss-events/event-info {"ev_host":["Dipankar Ghosh and Subrata Sarkar"]} -->
<div class="wp-block-ss-events-event-info"><div class="event-teaser">Travel Talk is an event where people come and share their experiences of their trips. It helps others to know more about a place.</div><div class="event-date">September 09, 2018</div><div class="event-time">4.30 PM to 8.30 PM</div><div class="event-venue">PRC Uttarpara, 1st floor</div><div class="event-nature">Travel Talk</div><div class="event-org">Uttarpara Tourists' Association</div></div>
<!-- /wp:ss-events/event-info -->

元信息已保存，但作为 HTML 评论。

<!-- wp:ss-events/event-info {"ev_host":["Dipankar Ghosh and Subrata
Sarkar"]} -->

然后我继续尝试 REST API 以查看 JSON 的样子。正如预测的那样，由于数据被保存为 HTML 评论，因此其中没有任何 meta 键。

这是 http://local.subratasarkar.com/wp-json/wp/v2/ss_event/654

的 JSON 输出（没有任何 meta 键）

{
    "id": 654,
    "date": "2018-09-04T18:32:44",
    "date_gmt": "2018-09-04T13:02:44",
    "guid": {
        "rendered": "http:\/\/local.subratasarkar.com\/?post_type=ss_event&#038;p=654"
    },
    "modified": "2018-09-04T18:32:44",
    "modified_gmt": "2018-09-04T13:02:44",
    "slug": "travel-talk-2018",
    "status": "publish",
    "type": "ss_event",
    "link": "http:\/\/local.subratasarkar.com\/events\/travel-talk-2018\/",
    "title": {
        "rendered": "Travel Talk 2018"
    },
    "content": {
        "rendered": "<div class=\"wp-block-ss-events-event-info\"><div class=\"event-teaser\">Travel Talk is an event where people come and share their experiences of their trips. It helps others to know more about a place.<\/div><div class=\"event-date\">September 09, 2018<\/div><div class=\"event-time\">4.30 PM to 8.30 PM<\/div><div class=\"event-venue\">PRC Uttarpara, 1st floor<\/div><div class=\"event-nature\">Travel Talk<\/div><div class=\"event-org\">Uttarpara Tourists&#8217; Association<\/div><\/div>\n",
        "protected": false
    },
    "featured_media": 0,
    "parent": 0,
    "template": "",
    "_links": {
        "self": [{
            "href": "http:\/\/local.subratasarkar.com\/wp-json\/wp\/v2\/ss_event\/654"
        }],
        "collection": [{
            "href": "http:\/\/local.subratasarkar.com\/wp-json\/wp\/v2\/ss_event"
        }],
        "about": [{
            "href": "http:\/\/local.subratasarkar.com\/wp-json\/wp\/v2\/types\/ss_event"
        }],
        "wp:attachment": [{
            "href": "http:\/\/local.subratasarkar.com\/wp-json\/wp\/v2\/media?parent=654"
        }],
        "curies": [{
            "name": "wp",
            "href": "https:\/\/api.w.org\/{rel}",
            "templated": true
        }]
    }
}

但根据我引用的文章（以上），它应该有元键。

我可能错了，当我声明一个 meta 时，它是否保存在 wp_postmeta table 中？

更新

刚刚引用了this，把属性改成了

ev_host: {
   type: 'string',
   source: 'meta',
   meta: 'ev_host',
},

现在元数据根本没有保存！当我回来编辑 post 时，元框是空的。我也没有看到 post_content 字段中保存的值。

Answer 1

您的自定义 post 类型支持 'custom-fields' 吗？

$args = array( //...
'supports' => array( 'editor', 'title', 'revisions', 'page-attributes', 'custom-fields' ),
//...
);

我遇到了同样的问题并在这里找到了这个解决方案：https://github.com/WordPress/gutenberg/issues/5622。

我现在可以看到元属性出现在我的 post 中，但每次我尝试保存 post 时都会收到 403 Forbidden :/

希望对您有所帮助:)

编辑：

我通过从我的元属性中删除“_”前缀修复了 Forbiden 错误。以下划线为前缀的元属性是私有的，我想这就是它被禁止的原因。

古腾堡元信息在 post_content 字段中保存为 HTML 评论

Gutenberg meta information is saved as HTML comment in post_content field

wordpress

gutenberg-blocks

更新