Forum Replies Created

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • in reply to: Inspector controls inside dynamic block #46005
    raquelmsmith
    Participant

    Does the WP API approach still allow for the same rendering in PHP (using save: props => { // fetch in php return null; }?

    Yes, you render on the front-end with PHP. What are you having trouble with specifically?

    in reply to: Inspector controls inside dynamic block #45137
    raquelmsmith
    Participant

    Thanks for the help! For anyone else looking to do this, here’s what I did:

    Edit function in index.js:

    
    edit: withAPIData( props => {
                    return {
                        posts: '/wp/v2/posts?per_page=3'
                    };
                } )( props => {
                    if ( ! props.posts.data ) {     // Used props. with all props subprops (sorry, don't know the correct terminology!)
                        return (
                            <p className={props.className} >
                                <Spinner />
                                { 'Loading Posts' }
                            </p>
                        );
                    }
                    if ( 0 === props.posts.data.length ) {
                        return [
                          props.isSelected && <Inspector { ...props } />,    // Simplified what I included in the Inspector class to just ...props
                          <p>{ 'No Posts' }</p>
                        ];
                    }
                    return [
                        props.isSelected && <Inspector { ...props } />,
                        <ul className={ props.className }>
                            { props.posts.data.map( post => {
                                return (
                                    <li>
                                        <a className={ props.className } href={ post.link }>
                                            { post.title.rendered }
                                        </a>
                                    </li>
                                );
                            }) }
                        </ul>
                    ];
                } ) // end withAPIData
            , // end edit
    

    And then in inspector.js:

    
    render() {
            const { attributes: { radioControl, rangeControl, toggleControl, }, setAttributes } = this.props;    // have to use this.props
    

    Working great!

    It is annoying that everything reloads when anything is changed in the inspector controls, but it’s something I can deal with for now 🙂

    in reply to: React error after updating to Gutenberg 2.6.0 #44982
    raquelmsmith
    Participant

    Sorry for the delay in responding. The example plugin works just fine in version 2.6.0. My block is inside another plugin, so I used your example config files to set everything up. Did any part of that change in V2 of the course that would be important for compatibility with Gutenberg 2.6.0?

Viewing 3 posts - 1 through 3 (of 3 total)