save<\/code>fonction ult\u00e9rieurement.<\/p>\n![\"Comment](\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-151739-61e4cecf0099f.png\")
<\/a><\/p>\nCela se produit parce que WordPress compare le bloc enregistr\u00e9 dans la base de donn\u00e9es avec le code actuel dans la save<\/code>fonction de votre bloc, et ils ne correspondent pas. WordPress n’est pas en mesure de combler la diff\u00e9rence. Dans la plupart des cas, vous pouvez cliquer sur les trois points du bloc et choisir \u00abTenter la r\u00e9cup\u00e9ration du bloc \u00bb. Si les modifications apport\u00e9es \u00e0 la save<\/code>fonction \u00e9taient minimes (par exemple, un changement de classe), WordPress est en mesure de restaurer le bloc. Dans le pire des cas, vous d besoin de cliquer sur "Convertir en HTML" et vous perdrez la edit<\/code>fonctionnalit\u00e9 de votre bloc. \u00c9videmment, nous ne pouvons pas nous attendre \u00e0 ce que les utilisateurs de notre code de bloc trouvent manuellement tous les messages utilisant ce bloc et effectuent ces \u00e9tapes pour chacun.<\/p>\nDonc, avant de mettre \u00e0 jour la save<\/code>fonction, nous ajouterons du code pour indiquer \u00e0 WordPress comment g\u00e9rer l’ancien contenu qui a \u00e9t\u00e9 enregistr\u00e9 avec l’ancienne save<\/code>fonction.<\/p>\nEntrons dans le code !<\/h2>\n
C’est en fait assez simple. En bref, ce que nous devons faire est; ajouter une deprecated<\/code>propri\u00e9t\u00e9 \u00e0 l’ registerBlockType()<\/code>appel de fonction. Cette propri\u00e9t\u00e9 attend un tableau. Cela signifie que vous pouvez d\u00e9pr\u00e9cier un bloc plusieurs fois, en fournissant plusieurs entr\u00e9es dans le tableau. Chaque amortissement est d\u00e9fini comme un objet d\u00e9tenant la attributes<\/code>propri\u00e9t\u00e9 compl\u00e8te et la (ancienne) save<\/code>fonction.<\/p>\nEn d’autres termes, vous d\u00e9finissez une deprecated<\/code>propri\u00e9t\u00e9 comme un tableau, puis vous y copiez votre bloc attributes<\/code>et votre save<\/code>fonction. Vous devrez inclure des attributs m\u00eame si vous n’y modifiez rien dans la mise \u00e0 jour. Vous n’avez pas besoin d’inclure la edit<\/code>fonction dans l’amortissement.<\/p>\ndeprecated: [\n {\n attributes: { ... },\n save: (props) => { ... }\n }\n]<\/code><\/pre>\nAllons-y dans un exemple plus pratique.<\/p>\n
Supposons que notre code de bloc ressemble \u00e0 ceci. La edit<\/code>fonction est exclue car nous n’avons pas besoin de la traiter dans l’amortissement.<\/p>\nconst { __ } = wp.i18n;\nconst { registerBlockType } = wp.blocks;\nconst { RichText } = wp.blockEditor;\n\u00a0\nimport edit from '.\/edit';\n\u00a0\nregisterBlockType( 'awp\/deprecated-block-example', {\n title: __( 'Example of deprecating a block' ),\n icon: 'format-aside',\n category: 'widgets',\n attributes: {\n alignment: {\n type: 'string',\n default: 'center'\n },\n exampleString: {\n type: 'string'\n },\n },\n edit,\n save: (props) => { \n const { exampleString } = props;\n return(\n <div className=\"deprecated-block-example\">\n <RichText.Content value={ exampleString } \/>\n <\/div>\n );\n }\n});<\/code><\/pre>\nSupposons ensuite que nous voulions apporter des modifications aux deux attributs et enregistrer et \u00e9viter de casser les blocs existants. Nous ajoutons la deprecated<\/code>propri\u00e9t\u00e9 et copions le tout attributes<\/code>et save<\/code>en tant qu’\u00e9l\u00e9ment de tableau dans celle-ci. Ensuite, nous sommes libres d’apporter des modifications \u00e0 attributes<\/code>ou\/et \u00e0 save<\/code>la fonction.<\/p>\nconst { __ } = wp.i18n;\nconst { registerBlockType } = wp.blocks;\nconst { RichText } = wp.blockEditor;\n\u00a0\nimport edit from '.\/edit';\n\u00a0\nregisterBlockType( 'awp\/deprecated-block-example', {\n title: __( 'Example of deprecating a block' ),\n icon: 'format-aside',\n category: 'widgets',\n attributes: {\n alignment: {\n type: 'string',\n default: 'center'\n },\n exampleString: {\n type: 'string'\n },\n newThing: {\n type: 'string'\n },\n },\n edit,\n save: (props) => { \n const { exampleString, newThing } = props;\n return(\n <div className=\"deprecated-block-example\">\n <RichText.Content value={ exampleString } \/>\n <div className=\"new-content\">\n <RichText.Content value={ newThing } \/>\n <\/div>\n <\/div>\n );\n },\n deprecated: [\n {\n attributes: {\n alignment: {\n type: 'string',\n default: 'center'\n },\n exampleString: {\n type: 'string'\n },\n },\n save: (props) => { \n const { exampleString } = props;\n return(\n <div className=\"deprecated-block-example\">\n <RichText.Content value={ exampleString } \/>\n <\/div>\n );\n },\n }\n ]\n});<\/code><\/pre>\nAvec ce code compil\u00e9, vous pouvez rechercher un article existant en utilisant l’ancien code de bloc, et vous ne devriez pas obtenir de code cass\u00e9\u00a0!<\/p>\n
WordPress d\u00e9terminera que le bloc utilise notre code obsol\u00e8te et chargera le contenu \u00e0 l’aide du save<\/code>code obsol\u00e8te. Une fois que vous avez apport\u00e9 des modifications au bloc et mis \u00e0 jour la publication, le bloc sera enregistr\u00e9 \u00e0 l’aide de la nouvelle save<\/code>fonction.<\/p>\nAmortissement plus avanc\u00e9 et lecture plus approfondie<\/h2>\n
L’exemple de code ci-dessus est la forme la plus basique d’amortissement. WordPress prend en charge davantage de fonctionnalit\u00e9s, telles que l’inclusion de migrate<\/code>, supports<\/code>et m\u00eame l’attribution de constantes (pensez aux num\u00e9ros de version) \u00e0 votre code obsol\u00e8te. Jetez un \u0153il \u00e0 la documentation de WordPress sur la d\u00e9pr\u00e9ciation des blocs<\/a>.<\/p>\n