it-swarm.com.de

var ist in einem Gutenberg-Block undefiniert

Ich spiele gerade mit Gutenberg und versuche nicht, einen dynamischen Block aufzubauen. Dies ist der Code, den ich verwende (aus Gründen der Übersichtlichkeit ist ein Teil des Codes weggelassen):

registerBlockType( 'my/block', {
    title: __( 'My Block' ),
    icon: 'email',
    category: 'common',
    attributes: {
        menu: {
            type: 'string',
            default: '',
        },
    },

    edit: withAPIData( ( props ) => {
        return {
            menu_selected: `/menus/v1/menus/${ props.attributes.menu }` // custom endpoint
        };
    } ) ( ( props ) => {
        const attributes = props.attributes;
        const menu_selected = props.menu_selected.data;

        const setMenu = value => {
            props.setAttributes( { menu: value } );
        };

        console.log( JSON.stringify( menu_selected ) );

        const ar = menu_selected.map( ( item ) => {
                        return (
                            <li className="menu_item">
                            { item.post_title }
                            </li>
                        );
                    } );
    }
} );

console.log( JSON.stringify( menu_selected ) ) gibt die folgende Zeichenfolge zurück:

[{"ID":3729,"post_title":"Item 1","post_type":"nav_menu_item"},
{"ID":3730,"post_title":"Item 2","post_type":"nav_menu_item"}]

Aber wenn ich map() auf dem menu_selected var aufrufe, erhalte ich die Fehlermeldung "menu_selected is undefined" und verstehe nicht warum.

Irgendwelche Ideen?

Danke im Voraus

1
leemon

Ich denke, Sie müssen menu_selected übergeben

edit: withAPIData( ( props ) => {
    return {
        menu_selected: `/menus/v1/menus/${ props.attributes.menu }` // custom endpoint
    };
} ) ( ( { menu_selected } ) => { 

Ich konnte so etwas sehr ähnliches machen:

edit: withAPIData( () => {
    return {
        posts: '/wp/v2/images?per_page=4&_embed'
    };
  } )( ( { posts, className } ) => {
      if ( ! posts.data ) {
          return "loading !";
      }
      if ( posts.data.length === 0 ) {
          return "No posts";
      }
2
David Sword