web-dev-qa-db-fra.com

Blocage de la validation: la validation du bloc a échoué pour `my-block`

écrire mon propre bloc pour un modèle de carte de téléchargement est l’idée.

j'ai configuré mon thème (pourrait également être dans un seul plugin) pour ajouter un nouveau bloc à l'éditeur Gutenberg.

je viens de mettre ma fonction de sauvegarde ici. parce que c'est ce dont il s'agit. Il s’agit d’une carte de téléchargement avec une image, un titre, un texte et un lien de téléchargement de fichier. tout fonctionne bien :

save: ( props ) => {
            const {
                className,
                attributes: {
                    title,
                    mediaID,
                    mediaURL,
                    mediaAlt,
                    textContent,
                    fileID,
                    fileURL,
                    fileType,
                    fileDesc,
                    fileSize,
                },
            } = props;
            return (
                <div className={ className }>
                    <div className="bl-dc__image">
                        {
                            mediaURL && (
                                <img className="image" src={ mediaURL } alt={ mediaAlt ? mediaAlt : __( 'Download Image') } />
                            )
                        }
                    </div>
                    <div className="bl-dc__content">
                        <h2 className="bl-dc__title">
                            {title}
                        </h2>

                        <p className="bl-dc__text">
                            { textContent }
                        </p>

                        {
                            fileURL && (
                                <a
                                    className="bl-dc__bt btn btn--primary"
                                    href={ fileURL } title={ __( 'Download') + (fileDesc && ' '+fileDesc) + (fileSize && ' '+fileSize) }
                                >
                                    { __( 'Download') + (fileType && ' ('+fileType+')') }
                                </a>
                            )
                        }
                    </div>


                </div>
            );
        }

Alors, quand je vais juste changer de classe. comme les boutons de la classe bl-dc__bt à bl-dc__btn. Je reçois une erreur de validation. Je dois mentionner si les champs sont remplis! dans ce cas, le fichier est téléchargé.

Est-ce le comportement prévu? que mon bloc tombe en morceaux dans l'éditeur, même les champs et que tout ce qui est backendish sont nommés de la même façon. développer le bloc devient rapidement frustrant, car je dois configurer et remplir le bloc dans l'éditeur encore et encore si je veux essayer ou étendre mon balisage tout en poursuivant mon travail. Si mon client dit: "Hé, pouvez-vous ajouter un champ d'icônes là-bas?" C'est juste pas possible?

J'ai trouvé une discussion dans github sur ce sujet: https://github.com/WordPress/gutenberg/issues/4849

il y a aussi quelques informations sur les blocs dépréciés: https://wordpress.org/gutenberg/handbook/block-api/deprecated-blocks/

je n'arrive pas à comprendre.

En tant que développeur, suis-je incapable de modifier le modèle d'un bloc sans détruire la fonctionnalité d'édition si les champs sont remplis?

2
André Kelling

Étant donné que Gutenberg est actuellement en mode de développement, les choses vont se casser et il n'y aura pas d'ensembles standard de règles et de directives PAS jusqu'à ce qu'il soit fusionné dans Core. J'ai fait face au même problème, changer une chose ici et là brise le bloc actuel et c'est frustrant comme l'enfer.

Jusque-là, les développeurs comme nous doivent supporter de telles nuisances. Si vous avez besoin de plus d’exemples sur la manière dont les blocs principaux le font, voici un exemple - Bloc de base WordPress

3
Ashiquzzaman Kiron