{"id":233561,"date":"2023-02-17T10:34:00","date_gmt":"2023-02-17T07:34:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=233561"},"modified":"2022-11-11T00:21:07","modified_gmt":"2022-11-10T21:21:07","slug":"looge-kohandatud-gutenbergi-plokk-7-osa-looge-oma-kohandatud-komponendid","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/et\/looge-kohandatud-gutenbergi-plokk-7-osa-looge-oma-kohandatud-komponendid\/","title":{"rendered":"Looge kohandatud Gutenbergi plokk \u2013 7. osa: looge oma kohandatud komponendid"},"content":{"rendered":"\n

Siiani oleme selles \u00f5petuseseerias kirjutanud kogu koodi funktsiooni sisse registerBlockType()<\/code>. edit<\/code>See on t\u00e4iesti v\u00f5imalik ja sageli soovitatakse selle asemel m\u00e4\u00e4rata redigeerimine eraldi komponendile. Seda tehes saame kasutada selliseid funktsioone nagu komponendi oleku ja eluts\u00fckli meetodid. See on ka palju puhtam, loetavam ja pakub korduvkasutatavat koodi!<\/p>\n

Kui te ei ole kursis Reacti komponentide loomisega v\u00f5i oleku- ja eluts\u00fcklimeetoditega, soovitan esmalt lugeda Reacti selleteemalist ametlikku juhendit .<\/a><\/p>\n

Klassi komponendi m\u00e4\u00e4ratlemine jaoksedit<\/code><\/h2>\n

Saate defineerida komponendi kas funktsiooni v\u00f5i klassina. Klassikomponendiga saate kasutada selliseid funktsioone nagu oleku- ja eluts\u00fckli meetodid. Uuemates Reacti versioonides (16+) saate aga kasutada Reacti konkse, et simuleerida funktsioonikomponentide oleku- ja eluts\u00fckli meetodeid. Kuid selles \u00f5petuses keskendume klassikomponendi loomisele. See, mida oleme selles seerias siiani loonud, "inline" registerBlockType()<\/code>jaoks edit<\/code>ja save<\/code>, on funktsioonikomponendid.<\/p>\n

Klassi komponendi m\u00e4\u00e4ratlemiseks laiendame WordPressi Component<\/code>( wp.element<\/code>paketis), t\u00e4pselt nii, nagu laiendaksite klassi komponenti React.Component<\/code>.<\/p>\n

Pidage meeles, et teie klassi komponent peab sisaldama funktsiooni render()<\/code>. Ja Javascripti toimimise t\u00f5ttu tuleb teie klass m\u00e4\u00e4ratleda enne teie registerBlockType()<\/code>k\u00f5net (kirjutage oma klassi komponent k\u00f5igepealt faili ja hoidke alles registerBlockType()<\/code>p\u00e4rast seda. Hiljem selles postituses \u00f5pime, kuidas komponente eraldi failidesse eraldada, eksportida ja kaasata neid).<\/p>\n

\u00dches\u00f5naga nii:<\/p>\n

const { registerBlockType } = wp.blocks;\nconst { Component } = wp.element;\n\u00a0\nclass FirstBlockEdit extends Component {\n    render() {\n        const { attributes, setAttributes } = this.props;\n        return ...\n    }\n}\n\u00a0\nregisterBlockType('awp\/firstblock', {\n    title: 'My first block',\n    edit: FirstBlockEdit,\n    save: (props) => { \n        return ...\n    }\n});<\/code><\/pre>\n
Rekvisiidid edit<\/code>rakendusest rakendatakse automaatselt meie komponendile. \u00c4rge unustage, et klassi komponendile peate viitama rekvisiitidele this.props<\/code>. WordPress Gutenbergi tuumas on tavaline edit<\/code>funktsioonide jaoks eraldi komponentide kasutamine, kuna need sisaldavad enamasti palju rohkem koodi. Funktsiooni save<\/code>v\u00f5ib sageli sisse j\u00e4tta, registerBlockType()<\/code>kui see ei sisalda ka palju koodi.<\/p>\n
Seda tehes saate n\u00fc\u00fcd oma komponendi kirjutada t\u00e4pselt nagu Reacti puhul. Saate lisada funktsioone, konstruktorit, olekut ja eluts\u00fckli meetodeid.<\/p>\n
See on kood, mille saime viimases etapis, teisendatuna klassikomponendiks:<\/p>\n
const { registerBlockType } = wp.blocks;\nconst { Component } = wp.element;\nconst { RichText, InspectorControls, BlockControls, AlignmentToolbar } = wp.blockEditor;\nconst { ToggleControl, PanelBody, PanelRow, CheckboxControl, SelectControl, ColorPicker, Toolbar, IconButton } = wp.components;\n\u00a0\nclass FirstBlockEdit extends Component {\n\u00a0\n    render() {\n        const { attributes, setAttributes } = this.props;\n        const alignmentClass = (attributes.textAlignment != null)? 'has-text-align-' + attributes.textAlignment: '';\n\u00a0\n        return (<div className={alignmentClass}>\n                <InspectorControls>\n                    <PanelBody\n                        title=\"Most awesome settings ever\"\n                        initialOpen={true}\n                    >\n                        <PanelRow>\n                            <ToggleControl\n                                label=\"Toggle me\"\n                                checked={attributes.toggle}\n                                onChange={(newval) => setAttributes({ toggle: newval })}\n                            \/>\n                        <\/PanelRow>\n                        <PanelRow>\n                            <SelectControl\n                                label=\"What's your favorite animal?\"\n                                value={attributes.favoriteAnimal}\n                                options={[\n                                    {label: \"Dogs\", value: 'dogs'},\n                                    {label: \"Cats\", value: 'cats'},\n                                    {label: \"Something else\", value: 'weird_one'},\n                                ]}\n                                onChange={(newval) => setAttributes({ favoriteAnimal: newval })}\n                            \/>\n                        <\/PanelRow>\n                        <PanelRow>\n                            <ColorPicker\n                                color={attributes.favoriteColor}\n                                onChangeComplete={(newval) => setAttributes({ favoriteColor: newval.hex })}\n                                disableAlpha\n                            \/>\n                        <\/PanelRow>\n                        <PanelRow>\n                            <CheckboxControl\n                                label=\"Activate lasers?\"\n                                checked={attributes.activateLasers}\n                                onChange={(newval) => setAttributes({ activateLasers: newval })}\n                            \/>\n                        <\/PanelRow>\n                    <\/PanelBody>\n                <\/InspectorControls>\n                <BlockControls>\n                    <AlignmentToolbar\n                        value={attributes.textAlignment}\n                        onChange={(newalign) => setAttributes({ textAlignment: newalign })}\n                    \/>\n                    <Toolbar>\n                        <IconButton\n                            label=\"My very own custom button\"\n                            icon=\"edit\"\n                            className=\"my-custom-button\"\n                            onClick={() => console.log('pressed button')}\n                        \/>\n                    <\/Toolbar>\n                <\/BlockControls>\n                <RichText \n                    tagName=\"h2\"\n                    placeholder=\"Write your heading here\"\n                    value={attributes.myRichHeading}\n                    onChange={(newtext) => setAttributes({ myRichHeading: newtext })}\n                \/>\n                <RichText\n                    tagName=\"p\"\n                    placeholder=\"Write your paragraph here\"\n                    value={attributes.myRichText}\n                    onChange={(newtext) => setAttributes({ myRichText: newtext })}\n                \/>\n            <\/div>\n        );\n    }\n}\n\u00a0\nregisterBlockType('awp\/firstblock', {\n    title: 'My first block',\n    category: 'common',\n    icon: 'smiley',\n    description: 'Learning in progress',\n    keywords: ['example', 'test'],\n    attributes: {\n        myRichHeading: {\n            type: 'string',\n        },\n        myRichText: {\n            type: 'string',\n            source: 'html',\n            selector: 'p'\n        },\n        textAlignment: {\n            type: 'string',\n        },\n        toggle: {\n            type: 'boolean',\n            default: true\n        },\n        favoriteAnimal: {\n            type: 'string',\n            default: 'dogs'\n        },\n        favoriteColor: {\n            type: 'string',\n            default: '#DDDDDD'\n        },\n        activateLasers: {\n            type: 'boolean',\n            default: false\n        },\n    },\n    supports: {\n        align: ['wide', 'full']\n    },\n    edit: FirstBlockEdit,\n    save: (props) => { \n        const { attributes } = props;\n\u00a0\n        const alignmentClass = (attributes.textAlignment != null)? 'has-text-align-' + attributes.textAlignment: '';\n\u00a0\n        return (<div className={alignmentClass}>\n                <RichText.Content \n                    tagName=\"h2\"\n                    value={attributes.myRichHeading}\n                \/>\n                <RichText.Content \n                    tagName=\"p\"\n                    value={attributes.myRichText}\n                \/>\n                {attributes.activateLasers && \n                    <div className=\"lasers\">Lasers activated<\/div>\n                }\n            <\/div>\n        );\n    }\n});<\/code><\/pre>\n
Kui destruktureerisite attributes<\/code>ja setAttributes<\/code>rekvisiitidest nagu meie tegime, on eraldi klassikomponendile \u00fcleminekul vaja muuta vaid \u00fchte rida; #9<\/code>alates props<\/code>kuni this.props<\/code>. Kogu kood t\u00f6\u00f6tab nagu varem, ilma midagi muud parandamata. See on h\u00e4vitamise ilu. Kui te seda ei h\u00e4vitanud ja viitasite nt props.attributes<\/code>otse, peaksite lisama this.<\/code>k\u00f5igi \u00fcksikute viidete ette attributes<\/code>ja setAttributes<\/code>k\u00f5ikjale.<\/p>\n
Hakkame tegema asju, mida n\u00fc\u00fcd klassikomponendiga teha saame!<\/p>\n
Funktsioonide m\u00e4\u00e4ratlemine jathis<\/code><\/h2>\n
T\u00f5si, jah, saate funktsioone defineerida funktsioonikomponendi sees edit<\/code>, enne kui helistate return<\/code>. Kuid isiklikult olen alati eelistanud funktsionaalsust loogika j\u00e4rgi eraldada. Minu arvates on parem eraldada funktsioonid loogika ja muude eesm\u00e4rkide jaoks v\u00e4ljaspool funktsiooni, mis vastutab v\u00e4ljundi renderdamise eest. M\u00f5ned inimesed eelistavad ka s\u00fcndmustes funktsioone kutsuda, selle asemel, et teha neid sees, nagu oleme seni teinud (setAttributes()<\/code>n\u00e4iteks onChange<\/code>).<\/p>\n
Praeguse seisuga on meie koodil kaks asja, mis v\u00f5ivad olla kasulikud funktsioonidele \u00fcleminekul; InspectorControls<\/code>ja BlockControls<\/code>. See l\u00fchendab return<\/code>oluliselt meie koodi ja muudab meie koodi h\u00f5lpsamini loetavaks.<\/p>\n
Defineerime kaks funktsiooni, mis tagastavad kogu InspectorControls<\/code>ploki ja terve BlockControls<\/code>ploki. Noolefunktsioone (functionName =() => { ... }<\/code>) kasutades on meil t\u00e4ielik juurdep\u00e4\u00e4s this<\/code>rekvisiitide hankimiseks. Kui te ei teinud 1. sammu viimast osa \u2013 Babeli seadistamine uusimate s\u00fcntaksitega, kuvatakse kompileerimisvead. Peaksite looma this<\/code>iga funktsiooni jaoks konstruktori ja sidumise. Lisateavet k\u00e4sitlemise kohta saate lugeda Reacti KKK lehe<\/a>this<\/code> algusest .<\/a><\/p>\n
Samuti pidage meeles, et kuna me oleme n\u00fc\u00fcd klassis, peate kutsuma k\u00f5ik selle funktsioonid this.<\/code>ette.<\/p>\n
class FirstBlockEdit extends Component {\n\u00a0\n    getInspectorControls =() => {\n        const { attributes, setAttributes } = this.props;\n\u00a0\n        return (<InspectorControls>\n                ...\n            <\/InspectorControls>\n        );\n    }\n\u00a0\n    getBlockControls = () => {\n        const { attributes, setAttributes } = this.props;\n\u00a0\n        return (<BlockControls>\n                ...\n            <\/BlockControls>\n        );\n    }\n\u00a0\n    render() {\n        const { attributes, setAttributes } = this.props;\n        const alignmentClass = (attributes.textAlignment != null)? 'has-text-align-' + attributes.textAlignment: '';\n\u00a0\n        return ([\n            this.getInspectorControls(),\n            this.getBlockControls(),\n            <div className={alignmentClass}>\n                <RichText \n                    tagName=\"h2\"\n                    placeholder=\"Write your heading here\"\n                    value={attributes.myRichHeading}\n                    onChange={(newtext) => setAttributes({ myRichHeading: newtext })}\n                \/>\n                <RichText\n                    tagName=\"p\"\n                    placeholder=\"Write your paragraph here\"\n                    value={attributes.myRichText}\n                    onChange={(newtext) => setAttributes({ myRichText: newtext })}\n                \/>\n            <\/div>\n        ]);\n    }\n}<\/code><\/pre>\n
Pange t\u00e4hele, et olen v\u00e4lja j\u00e4tnud koodi tegeliku sisu InspectorControls<\/code>ja BlockControls<\/code>et kood oleks l\u00fchem. Midagi nende koodis ei pea muutma.<\/p>\n
Kasutame ka seda, et return<\/code>avaldus v\u00f5ib tagastada ka massiivi. K\u00f5ik massiivis olev renderdatakse nagu tavaliselt nende asukohas. See muudab funktsioonide otse v\u00e4ljakutsumise lihtsaks return<\/code>.<\/p>\n
Ilmselgelt saate m\u00e4\u00e4ratleda ka eluts\u00fckli meetodeid, n\u00e4iteks componentDidMount()<\/code>. Gutenbergi komponentides pole nende tegemisel mingit vahet kui Reactis.<\/p>\n
Konstruktor ja kasutusolek<\/h2>\n
Proovime olekut oma komponendis rakendada. Pidage meeles, et olek on meie klassikomponendis vaid ajutiselt salvestatud ja seda ei salvestata kuhugi \u2013 n\u00e4iteks atribuutidesse. See on lihtsalt selleks, et hoida oma komponendi oleku \u00fcle kontrolli. Oleku tavalised kasutusviisid on oleku kasutamine olekulipuna, oodates as\u00fcnkroonilise k\u00f5ne naasmist, millegi skoori ajutine hoidmine enne selle atribuuti salvestamist v\u00f5i ploki \u201eeelvaate\/redigeerimisre\u017eiim" rakendamine.<\/p>\n
Te viitate olekule ja v\u00e4rskendamise olekule t\u00e4pselt nagu Reactis; koos this.state<\/code>ja setState()<\/code>. Tavaliselt initsialiseerite oleku konstruktoris. Ja mis puutub konstruktori m\u00e4\u00e4ratlemisse \u2013 see on t\u00e4pselt nagu Reactis \u2013, \u00e4rge unustage sooritada props<\/code>ja teha super(props)<\/code>samuti. L\u00fchidalt:<\/p>\n
class FirstBlockEdit extends Component {\n    constructor(props) {\n        super(props);\n\u00a0\n        this.state = {\n            example: 1\n        }\n    }\n\u00a0\n    render() {\n        this.setState({ example: 2 });\n        console.log(this.state.example);\n        ...<\/code><\/pre>\n
Blokeerimisre\u017eiimi muutmise\/eelvaate l\u00fcliti<\/h3>\n
Kasutame t\u00f6\u00f6riistaribade eelmises etapis \u00f5pitut, et luua oma ploki jaoks re\u017eiimil\u00fcliti. Rakendame t\u00f6\u00f6riistariba nupuga, mis l\u00fclitab olekut eelvaate- ja redigeerimisre\u017eiimi vahel. Redigeerimisre\u017eiimis saab plokk tavap\u00e4raselt kaks RichTexti komponenti. Kuid eelvaatere\u017eiimile l\u00fclitamisel keelasime redigeerimise ja renderdasime ploki v\u00e4ljundi.<\/p>\n
K\u00f5igepealt loome konstruktori ja seadistame oleku \u00fche t\u00f5ev\u00e4\u00e4rtusega; editMode<\/code>mis algab kui true<\/code>. See super(props)<\/code>on vajalik klassip\u00f5hises Reacti komponendis konstruktori m\u00e4\u00e4ratlemisel.<\/p>\n
class FirstBlockEdit extends Component {\n    constructor(props) {\n        super(props);\n        this.state = {\n            editMode: true\n        }\n    }\n    ...<\/code><\/pre>\n
T\u00f6\u00f6riistaribade v\u00e4ljastamise funktsioonis muudame varem loodud kohandatud nuppu (mis ainult console.log<\/code>sellel kl\u00f5psamisel midagi). Selle onClick<\/code>rekvisiidil kutsume setState()<\/code>v\u00e4lja ja eitame praeguse editMode<\/code>t\u00f5ev\u00e4\u00e4rtuse. Et kasutajal oleks lihtsam aru saada, vahetame ka nupu ikooni ja sildi vahel. N\u00e4iteks kui eelvaatere\u017eiim on aktiivne, kuvatakse nupul silt "Muuda" ja pliiatsiikoon, mis on tavaliselt redigeerimiseks aktsepteeritav.<\/p>\n
getBlockControls = () => {\n    const { attributes, setAttributes } = this.props;\n    return (<BlockControls>\n            <AlignmentToolbar\n                value={attributes.textAlignment}\n                onChange={(newalign) => setAttributes({ textAlignment: newalign })}\n            \/>\n            <Toolbar>\n                <IconButton\n                    label={ this.state.editMode? \"Preview\": \"Edit\" }\n                    icon={ this.state.editMode? \"format-image\": \"edit\" }\n                    onClick={() => this.setState({ editMode: !this.state.editMode })}\n                \/>\n            <\/Toolbar>\n        <\/BlockControls>\n    );\n}<\/code><\/pre>\n
Ja l\u00f5puks saame oma ploki peamise renderdusmeetodi raames teha, mida tahame. See osa on t\u00f5esti teie otsustada \u2013 teete sama, mida tegime \u00fclaloleval nupul oleva sildi ja ikooniga. Lisame kaks v\u00e4ljundplokki, \u00fche kui this.state.editMode<\/code>on true<\/code>(mis peaks olema tavalised redigeeritavad RichText<\/code>komponendid) ja teise, kui see on false<\/code>.<\/p>\n
N\u00e4iteks kasutan kahte WordPressi komponenti wp.components<\/code>; Placeholder<\/code>ja Disabled<\/code>eelvaatere\u017eiimi jaoks. Komponent Placeholder<\/code>asetab teie ploki kenasse halli kasti, mis teeb t\u00f5esti selgeks, et seda ei saa redigeerida. Pidage meeles, et see on lisatud stiiliga, nii et kui soovite t\u00e4iuslikku eelvaadet, ei pruugi see teile sobida. Ja ma Disabled<\/code>paken k\u00f5ik komponendi sisse, mis muudab k\u00f5ik sees olevaks muutmatuks, kl\u00f5psamatuks ja lohistamatuks. See on meie uus render()<\/code>funktsioon meie komponendis:<\/p>\n
const { ..., Fragment } = wp.element;\nconst {... Placeholder, Disabled } = wp.components;  \/\/ Don't forget to add these at the top\n\u00a0\n...\nrender() {\n    const { attributes, setAttributes } = this.props;\n    const alignmentClass = (attributes.textAlignment != null)? 'has-text-align-' + attributes.textAlignment: '';\n\u00a0\n    return ([\n        this.getInspectorControls(),\n        this.getBlockControls(),\n        <div className={alignmentClass}>\n            {this.state.editMode && \n                <Fragment>\n                    <RichText \n                        tagName=\"h2\"\n                        placeholder=\"Write your heading here\"\n                        value={attributes.myRichHeading}\n                        onChange={(newtext) => setAttributes({ myRichHeading: newtext })}\n                    \/>\n                    <RichText\n                        tagName=\"p\"\n                        placeholder=\"Write your paragraph here\"\n                        value={attributes.myRichText}\n                        onChange={(newtext) => setAttributes({ myRichText: newtext })}\n                    \/>\n                <\/Fragment>\n            }\n            {!this.state.editMode && \n                <Placeholder isColumnLayout={true}>\n                    <Disabled>\n                        <RichText.Content \n                            tagName=\"h2\"\n                            value={attributes.myRichHeading}\n                        \/>\n                        <RichText.Content\n                            tagName=\"p\"\n                            value={attributes.myRichText}\n                        \/>\n                    <\/Disabled>\n                <\/Placeholder>\n            }\n        <\/div>\n    ]);\n}\n...<\/code><\/pre>\n
Kasutan ka komponenti Fragment<\/code>( wp.element<\/code>paketti), mis on sama mis React.Fragment<\/code>. Kui te pole sellega tuttav, m\u00e4hime v\u00e4ljundi selle sisse, kui me ei soovi lisada t\u00e4iendavaid tarbetuid HTML-i \u00fcmbriseid. Reactis peab k\u00f5igel olema juurs\u00f5lm. Kui redigeerimisre\u017eiim on aktiivne (rida #13<\/code>), v\u00e4ljastame kaks RichText<\/code>komponenti kohe \u00fcksteise j\u00e4rel, seega vajame nende \u00fcmber juurs\u00f5lme.<\/p>\n
Kui eelvaatere\u017eiim on aktiivne (rida #29<\/code>), v\u00e4ljastame kahe RichText<\/code>komponendi v\u00e4\u00e4rtused. Nagu me save<\/code>, kasutame RichText.Content<\/code>v\u00e4ikese redaktori asemel nende v\u00e4\u00e4rtuste tagastamiseks.<\/p>\n
Komponent Placeholder<\/code>on saadaval painduva stiiliga ja vaikimisi painduva suuna reaga. Rekvisiidis true<\/code>esitamine isColumnLayout<\/code>muudab selle painduva suuna veeruks (nii et k\u00f5ik virnastab). Kuid nagu varem mainitud \u2013 v\u00f5iksite selle komponendi vahele j\u00e4tta ja pigem genereerida eelvaade t\u00e4pselt nii, nagu see oleks kasutajaliideses.<\/p>\n
Ja sellega on meil blokeerimisre\u017eiimi eelvaate\/redigeerimise l\u00fcliti. Ilmselgelt saate "redigeerimisre\u017eiimi" sisu reguleerida, et n\u00e4idata nt juhtsisendeid v\u00f5i muud.<\/p>\n<\/p>\n
Saate luua nii palju komponente, kui soovite, kuid te ei piirdu ainult \u00fche edit<\/code>funktsiooniga! Looge lihtsalt rohkem komponente ja lisage need return<\/code>avaldusse. See on tegelikult Reacti idee \u2013 kapseldatud koodit\u00fckkide loomine, millest iga\u00fcks k\u00e4sitleb oma olekut ja \u00fchendab need keerukate kasutajaliideste saamiseks.<\/p>\n
:  awhitepixel.com<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"
Selles meie Gutenbergi ploki \u00f5petuse osas \u00f5pime, kuidas registrBlockType’i redigeerimisfunktsiooni eraldi klassip\u00f5hisesse komponenti teisaldada.<\/p>\n","protected":false},"author":1,"featured_media":152941,"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,1110,842,802,802,833,842,863,863],"tags":[1165],"class_list":{"0":"post-233561","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","6":"hentry","7":"category-arendaja","8":"category-kood","10":"category-gutenberg-4","12":"category-juhend-algajatele","14":"category-n-a","15":"category-opetused","16":"category-php-4","20":"category-wordpress-4","22":"tag-affiai-et"},"_links":{"self":[{"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/posts\/233561","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=233561"}],"version-history":[{"count":0,"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/posts\/233561\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/media\/152941"}],"wp:attachment":[{"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/media?parent=233561"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/categories?post=233561"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/tags?post=233561"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}