{"id":233885,"date":"2023-02-25T15:12:00","date_gmt":"2023-02-25T12:12:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=233885"},"modified":"2022-11-11T12:59:35","modified_gmt":"2022-11-11T09:59:35","slug":"kuidas-tuehistada-gutenbergi-plokid","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/et\/kuidas-tuehistada-gutenbergi-plokid\/","title":{"rendered":"Kuidas t\u00fchistada Gutenbergi plokid"},"content":{"rendered":"\n

\u00dcks levinumaid probleeme Gutenbergi plokkidega teema v\u00f5i pistikprogrammi v\u00e4rskendamisel on see, et ploki koodi muutmine katkestab k\u00f5ik seda plokki kasutavad olemasolevad postitused. \u00d5nneks pakub WordPress lahendust; viis blokeerida plokid. Selles postituses vaatame, kuidas seda teha.<\/p>\n

Kui olete varem plokkide arendamisega t\u00f6\u00f6tanud, olete t\u00f5en\u00e4oliselt selle ploki veaga tuttav, kui olete ploki lisanud ja hiljem save<\/code>funktsiooni muutnud.<\/p>\n

\"Kuidas<\/a><\/p>\n

See juhtub seet\u00f5ttu, et WordPress v\u00f5rdleb andmebaasis salvestatud plokki save<\/code>teie ploki funktsiooni praeguse koodiga ja need ei \u00fchti. WordPress ei suuda erinevust parandada. Enamasti saad kl\u00f5psata plokil kolmel punktil ja valida “Proovi blokeerida taastamist". Kui save<\/code>funktsioonis tehtud muudatused olid v\u00e4ikesed (nt klassivahetus), suudab WordPress ploki taastada. Halvimal juhul d Peate kl\u00f5psama "Teisenda HTML-iks" ja te kaotate oma ploki edit<\/code>funktsionaalsuse. Ilmselgelt ei saa me eeldada, et meie blokeerimiskoodi kasutajad leiavad k\u00e4sitsi k\u00f5ik seda plokki kasutavad postitused ja teevad iga\u00fche jaoks need toimingud.<\/p>\n

Nii et enne save<\/code>funktsiooni v\u00e4rskenduste tegemist lisame koodi, mis annab WordPressile teada, kuidas k\u00e4sitleda vana sisu, mis on salvestatud vana save<\/code>funktsiooniga.<\/p>\n

L\u00e4hme koodi sisse!<\/h2>\n

See on tegelikult \u00fcsna lihtne. L\u00fchidalt, mida me tegema peame, on; lisage funktsioonikutsele deprecated<\/code>atribuut. registerBlockType()<\/code>See vara eeldab massiivi. See t\u00e4hendab, et saate ploki mitu korda aegunud, lisades massiivi mitu kirjet. Iga amortisatsioon on m\u00e4\u00e4ratletud kui objekt, millel on t\u00e4ielik attributes<\/code>omadus ja (vana) save<\/code>funktsioon.<\/p>\n

Teisis\u00f5nu m\u00e4\u00e4ratlete deprecated<\/code>atribuudi massiivina ja seej\u00e4rel kopeerite sellesse oma ploki attributes<\/code>ja save<\/code>funktsiooni. Peate lisama atribuudid, kuigi te ei muuda neis v\u00e4rskenduses midagi. Te ei pea edit<\/code>funktsiooni amortisatsiooni arvestama.<\/p>\n

deprecated: [\n    {\n        attributes: { ... },\n        save: (props) => { ... }\n    }\n]<\/code><\/pre>\n
Vaatame seda praktilisemas n\u00e4ites.<\/p>\n
Oletame, et meie blokeerimiskood n\u00e4eb v\u00e4lja umbes selline. Funktsioon edit<\/code>on v\u00e4listatud, kuna me ei pea sellega amortisatsiooniga tegelema.<\/p>\n
const { __ } = 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>\n
Seej\u00e4rel oletame, et tahame teha muudatusi m\u00f5lemas atribuudis ning salvestada ja v\u00e4ltida olemasolevate plokkide purustamist. Lisame deprecated<\/code>atribuudi ja kopeerime sellesse kogu attributes<\/code>ja save<\/code>massiivi elemendina. Seej\u00e4rel saame teha mis tahes muudatusi attributes<\/code>ja\/v\u00f5i save<\/code>funktsiooni.<\/p>\n
const { __ } = 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>\n
Kui see kood on koostatud, saate otsida olemasolevat postitust vana plokkkoodi abil ja te ei tohiks katkist koodi saada!<\/p>\n
WordPress selgitab v\u00e4lja, et plokk kasutab meie aegunud koodi, ja laadib sisu vananenud save<\/code>koodi abil. Kui teete plokis muudatused ja v\u00e4rskendate postitust, salvestatakse plokk uue save<\/code>funktsiooni abil.<\/p>\n
T\u00e4psem amortisatsioon ja edasine lugemine<\/h2>\n
\u00dclaltoodud koodin\u00e4ide on amortisatsiooni k\u00f5ige elementaarsem vorm. migrate<\/code>WordPress toetab rohkem funktsioone, n\u00e4iteks supports<\/code>lisamist ja isegi konstantide (m\u00f5elge versiooninumbritele) m\u00e4\u00e4ramist teie aegunud koodile. Vaadake WordPressi dokumentatsiooni ploki amortisatsiooni kohta<\/a>.<\/p>\n
:  awhitepixel.com<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"
Gutenbergi ploki koodi muutmine katkestab k\u00f5ik seda plokki kasutavad olemasolevad postitused. Selles postituses vaatleme, kuidas blokeerida plokid.<\/p>\n","protected":false},"author":1,"featured_media":151740,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[718,894,718,937,937,833,894,916,916,1110,842,812,812,833,842,863,863],"tags":[1165],"class_list":["post-233885","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-arendaja","category-kood","category-gutenberg-4","category-juhend-algajatele","category-muud","category-n-a","category-opetused","category-pistikprogrammid","category-wordpress-4","tag-affiai-et"],"_links":{"self":[{"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/posts\/233885","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/comments?post=233885"}],"version-history":[{"count":0,"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/posts\/233885\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/media\/151740"}],"wp:attachment":[{"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/media?parent=233885"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/categories?post=233885"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/tags?post=233885"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}