使用useSelect获取分类术语

时间:2021-05-10 作者:leemon

我正在开发一个古腾堡块,我需要显示一个下拉列表,其中包含自定义分类法的所有术语。我正在使用useSelect 钩子用于检索此数据,但它不起作用,因为它无法显示Loading... 消息,控制台中没有错误。我在show_in_rest arg设置为true。

我不知道我做错了什么。有什么想法吗?

const { registerBlockType } = wp.blocks;
const { Placeholder, SelectControl } = wp.components;
const { useSelect } = wp.data;

const blockAttributes = {
    slug: {
        type: \'string\',
        default: \'\',
    },
};

export const name = \'my-plugin/my-terms-block\';

export const settings = {
    title: \'My Terms Block\' ),
    attributes: blockAttributes,

    edit: ( props => {
        const { attributes, className } = props;

        const terms = useSelect( ( select ) =>
            select( \'core\' ).getEntityRecords( \'taxonomy\', \'my_taxonomy\', { per_page: -1, orderby: \'name\', order: \'asc\', _fields: \'name,slug\' } )
        );
        
        const setSlug = value => {
            props.setAttributes( { slug: value } );
        };

        if ( ! terms ) {
            return \'Loading...\';
        }

        if ( terms.length === 0 ) {
            return \'No terms found\' );
        }

        var options = [];
        options.push( {
            label: \'Select a term...\',
            value: \'\'
        } );

        for ( var i = 0; i < terms.length; i++ ) {
            options.push( {
                label: terms[i].name,
                value: terms[i].slug
            } );
        }

        return (
            <Placeholder
                key=\'my-terms-block\'
                label={ \'Terms Block\' }
                className={ className }>
                    <SelectControl
                        label={ \'Select a term:\' }
                        value={ attributes.slug }
                        options={ options }
                        onChange={ setSlug }
                    />
            </Placeholder>
        );

    } ),

};

registerBlockType( name, settings );

1 个回复
最合适的回答,由SO网友:Sally CJ 整理而成

如果您使用_fields 参数,则需要包括id. 否则getEntityRecords() 将始终返回null, 即使REST API请求成功。

因此,要解决问题,只需添加id 到您的args,即。_fields: \'id,name,slug\'.

你也应该知道per_page 仅限于100, 因此,即使将其设置为一个更大的数字或偶数-1 (表示全部),该值始终设置为最大值100。