最后，我成功地做到了这一点

(function( plugins, editPost, element, components, data, compose ) {

    const el = element.createElement;

    const { Fragment } = element;
    const { registerPlugin } = plugins;
    const { PluginSidebar, PluginSidebarMoreMenuItem } = editPost;
    const { PanelBody, ColorPicker } = components;
    const { withSelect, withDispatch } = data;

    const MetaThemeControl = compose.compose(
        withDispatch( function( dispatch, props ) {
            return {
                setMetaValue: function( metaValue ) {
                    dispatch( \'core/editor\' ).editPost(
                        { meta: { [ props.metaKey ]: metaValue } }
                    );
                }
            }
        } ),
        withSelect( function( select, props ) {
            return {
                metaValue: select( \'core/editor\' ).getEditedPostAttribute( \'meta\' )[ props.metaKey ],
            }
        } ) )( function( props ) {
            return el( ColorPicker, {
                label: props.title,
                value: props.metaValue,
                onChangeComplete: function( content ) {
                    props.setMetaValue( content.hex );
                },
            });
        }
    );

    registerPlugin( \'b-theme-sidebar\', {
        render: function() {
            return el( Fragment, {},
                el( PluginSidebarMoreMenuItem,
                    {
                        target: \'b-theme-sidebar\',
                        icon: \'admin-appearance\',
                    },
                    \'B Theme\'
                ),
                el( PluginSidebar,
                    {
                        name: "b-theme-sidebar",
                        title: "B Theme",
                        icon: \'admin-appearance\',
                    },
                    el( PanelBody, {},
                        // primary color
                        el( MetaThemeControl,
                            {
                                metaKey: \'primary_theme\',
                                title : \'Primary Theme\',
                            }
                        ),
                        // secondary color
                        el( MetaThemeControl,
                            {
                                metaKey: \'secondary_theme\',
                                title : \'Secondary Theme\',
                            }
                        ),
                    )
                )
            );
        }
    } );
} )(
    window.wp.plugins,
    window.wp.editPost,
    window.wp.element,
    window.wp.components,
    window.wp.data,
    window.wp.compose
);

编辑：解决第一种情况的教程：

https://css-tricks.com/managing-wordpress-metadata-in-gutenberg-using-a-sidebar-plugin/