{"id":12623,"date":"2024-11-13T19:51:15","date_gmt":"2024-11-13T10:51:15","guid":{"rendered":"https:\/\/colors-themes.com\/clock\/?p=12623"},"modified":"2025-04-06T04:34:39","modified_gmt":"2025-04-05T19:34:39","slug":"gutenberg-deprecated","status":"publish","type":"post","link":"https:\/\/colors-themes.com\/clock\/gutenberg-deprecated\/","title":{"rendered":"Gutenberg\u306e\u30ab\u30b9\u30bf\u30e0\u30d6\u30ed\u30c3\u30af\uff08\u9759\u7684\u30d6\u30ed\u30c3\u30af\uff09\u306e\u30a2\u30c3\u30d7\u30c7\u30fc\u30c8\u65b9\u6cd5"},"content":{"rendered":"\n

\u300c\u30d6\u30ed\u30c3\u30af\u306e\u30ea\u30ab\u30d0\u30ea\u30fc\u3092\u8a66\u884c\u300d\u30dc\u30bf\u30f3<\/span><\/h1>\n\n\n\n

Gutenberg\u306e\u30ab\u30b9\u30bf\u30e0\u30d6\u30ed\u30c3\u30af\uff08\u9759\u7684\u30d6\u30ed\u30c3\u30af\uff09\u306e\u30a2\u30c3\u30d7\u30c7\u30fc\u30c8\u65b9\u6cd5\u306b\u3064\u3044\u3066\u306e\u30e1\u30e2\u3067\u3059\u3002
\u30a2\u30c3\u30d7\u30c7\u30fc\u30c8\u3067\u9759\u7684\u30d6\u30ed\u30c3\u30af\uff08save.js\uff09\u306b\u5909\u66f4\u3092\u52a0\u3048\u308b\u3068\u3001\u300c\u30d6\u30ed\u30c3\u30af\u306e\u30ea\u30ab\u30d0\u30ea\u30fc\u30dc\u30bf\u30f3\u3092\u8a66\u884c\u300d\u30dc\u30bf\u30f3\u304c\u8868\u793a\u3055\u308c\u307e\u3059\u3002\u975e\u63a8\u5968\u30d0\u30fc\u30b8\u30e7\u30f3<\/a>\u3092\u63d0\u4f9b\u3057\u305f\u5834\u5408\u3001\u300c\u30d6\u30ed\u30c3\u30af\u306e\u30ea\u30ab\u30d0\u30ea\u30fc\u30dc\u30bf\u30f3\u3092\u8a66\u884c\u300d\u30dc\u30bf\u30f3\u306f\u8868\u793a\u3055\u308c\u305a\u3001\u30e6\u30fc\u30b6\u30fc\u304c\u30d6\u30ed\u30c3\u30af\u3092\u7de8\u96c6\u3057\u305f\u30bf\u30a4\u30df\u30f3\u30b0\u3067\u30a2\u30c3\u30d7\u30c7\u30fc\u30c8\u306e\u5909\u66f4\u304c\u53cd\u6620\u3055\u308c\u308b\u3088\u3046\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n

<\/div>\n\n\n\n

\u57fa\u672c\u7684\u306a\u65b9\u6cd5<\/span><\/h1>\n\n\n\n

Block Development Examples<\/a> \u306e\u30b5\u30f3\u30d7\u30eb\u30d6\u30ed\u30c3\u30af\uff08recipe-card-744e8a\uff09\u3092\u4f8b\u306b\u3057\u3066\u3044\u307e\u3059\u3002<\/p>\n\n\n\n

<\/div>\n\n\n\n

recipe-card-744e8a<\/strong><\/p>\n\n\n\n

    \n
  • block.json<\/li>\n\n\n\n
  • index.js\u30fb\u30fb\u30fb2\u884c\u8ffd\u8a18\u3002<\/li>\n\n\n\n
  • edit.js<\/li>\n\n\n\n
  • save.js<\/li>\n\n\n\n
  • style.scss<\/li>\n\n\n\n
  • deprecated.js\u30fb\u30fb\u30fb\u30d5\u30a1\u30a4\u30eb\u3092\u65b0\u898f\u8ffd\u52a0\u3002<\/li>\n<\/ul>\n\n\n\n
    <\/div>\n\n\n\n

    index.js\u30d5\u30a1\u30a4\u30eb<\/strong>\uff1a\u3000\u8d64\u8272\u4e8c\u884c\u8ffd\u8a18\u3002<\/p>\n\n\n\n

    import { registerBlockType } from '@wordpress\/blocks';\nimport '.\/style.scss';\nimport Edit from '.\/edit';\nimport save from '.\/save';\nimport metadata from '.\/block.json';\nimport deprecated from '.\/deprecated';<\/mark>\nregisterBlockType( metadata.name, {\n\tedit: Edit,\n\tsave,\n\tdeprecated,<\/mark>\n} );<\/code><\/pre>\n\n\n\n
    deprecated.js<\/strong>\uff1a\u3000\u65b0\u898f\u8ffd\u52a0\uff08\u5b9a\u578b\uff09\u3002<\/p>\n\n\n\n
    import {} from '@wordpress\/block-editor';\nconst v1 = {\n\tattributes: {},\n\tsupports: {},\n\tsave() {},\n\tmigrate() {},\u3000\/\/ \u30aa\u30d7\u30b7\u30e7\u30f3\n\tisEligible() {},\u3000\/\/ \u30aa\u30d7\u30b7\u30e7\u30f3\n};\nconst v2 = {};\nconst v3 = {};\nexport default [ v3, v2, v1 ];<\/code><\/pre>\n\n\n\n
    <\/div>\n\n\n\n
    recipe-card-744e8a\u306e\u5b9f\u4f8b<\/span><\/h1>\n\n\n\n
    index.js\u30d5\u30a1\u30a4\u30eb<\/strong><\/p>\n\n\n\n
    import { registerBlockType } from '@wordpress\/blocks';\nimport '.\/style.scss';\nimport Edit from '.\/edit';\nimport save from '.\/save';\nimport metadata from '.\/block.json';\nimport deprecated from '.\/deprecated';\nregisterBlockType( metadata.name, {\n\tedit: Edit,\n\tsave,\n\tdeprecated,\n} );<\/code><\/pre>\n\n\n\n
    deprecated.js\u30d5\u30a1\u30a4\u30eb<\/strong><\/p>\n\n\n\n
    import { __ } from '@wordpress\/i18n';\nimport { RichText, useBlockProps } from '@wordpress\/block-editor';\nconst v1 = {\n\tattributes: {\n\t\ttitle: {\n\t\t\ttype: 'string',\n\t\t\tsource: 'html',\n\t\t\tselector: 'h2',\n\t\t},\n\t\tmediaID: {\n\t\t\ttype: 'number',\n\t\t},\n\t\tmediaURL: {\n\t\t\ttype: 'string',\n\t\t\tsource: 'attribute',\n\t\t\tselector: 'img',\n\t\t\tattribute: 'src',\n\t\t},\n\t\tingredients: {\n\t\t\ttype: 'string',\n\t\t\tsource: 'html',\n\t\t\tselector: '.ingredients',\n\t\t},\n\t\tinstructions: {\n\t\t\ttype: 'string',\n\t\t\tsource: 'html',\n\t\t\tselector: '.steps',\n\t\t},\n\t},\n\tsave( props ) {\n\t\tconst {\n\t\t\tattributes: { title, mediaURL, ingredients, instructions },\n\t\t} = props;\n\t\tconst blockProps = useBlockProps.save();\n\t\treturn (\n\t\t\t<div { ...blockProps }>\n\t\t\t\t<RichText.Content tagName=\"h2\" value={ title } \/>\n\t\t\t\t{ mediaURL && (\n\t\t\t\t\t<img\n\t\t\t\t\t\tclassName=\"recipe-image\"\n\t\t\t\t\t\tsrc={ mediaURL }\n\t\t\t\t\t\talt={ __(\n\t\t\t\t\t\t\t'Recipe Image',\n\t\t\t\t\t\t\t'block-development-examples'\n\t\t\t\t\t\t) }\n\t\t\t\t\t\/>\n\t\t\t\t) }\n\t\t\t\t<h3>{ __( 'Ingredients', 'block-development-examples' ) }<\/h3>\n\t\t\t\t<RichText.Content\n\t\t\t\t\ttagName=\"ul\"\n\t\t\t\t\tclassName=\"ingredients\"\n\t\t\t\t\tvalue={ ingredients }\n\t\t\t\t\/>\n\t\t\t\t<h3>{ __( 'Instructions', 'block-development-examples' ) }<\/h3>\n\t\t\t\t<RichText.Content\n\t\t\t\t\ttagName=\"div\"\n\t\t\t\t\tclassName=\"steps\"\n\t\t\t\t\tvalue={ instructions }\n\t\t\t\t\/>\n\t\t\t<\/div>\n\t\t);\n\t},\n};\nconst v2 = {};\nconst v3 = {};\nexport default [ v3, v2, v1 ];<\/code><\/pre>\n\n\n\n
    <\/div>\n\n\n\n
    migrate\u95a2\u6570\uff08\u30aa\u30d7\u30b7\u30e7\u30f3\u3001\u7701\u7565\u53ef\uff09<\/span><\/h1>\n\n\n\n
    \u30d6\u30ed\u30c3\u30af\u3092\u79fb\u884c\u3059\u308b\u969b\u306b\u3001\u5c5e\u6027\u306e\u5909\u66f4\u3001innerBlocks \u306e\u5909\u66f4\u7b49\u3092\u3059\u308b\u5834\u5408\u306b\u4f7f\u7528\u3057\u307e\u3059\u3002<\/p>\n\n\n\n
    <\/div>\n\n\n\n
    isEligible\u95a2\u6570\uff08\u30aa\u30d7\u30b7\u30e7\u30f3\u3001\u7701\u7565\u53ef\uff09<\/span><\/h1>\n\n\n\n
    \u30d6\u30ed\u30c3\u30af\u306f\u8907\u6570\u306e\u975e\u63a8\u5968\u30d0\u30fc\u30b8\u30e7\u30f3\u3092\u6301\u3064\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002\u975e\u63a8\u5968\u30d0\u30fc\u30b8\u30e7\u30f3\u306f\u3001\u300c\u89e3\u6790\u3055\u308c\u305f\u30d6\u30ed\u30c3\u30af\u306e\u73fe\u5728\u306e\u72b6\u614b\u304c\u7121\u52b9\u3067\u3042\u308b\u5834\u5408\u300d\u3001\u307e\u305f\u306f\u300c\u975e\u63a8\u5968\u30d0\u30fc\u30b8\u30e7\u30f3\u304ctrue\u3092\u8fd4\u3059isEligible\u95a2\u6570\u3092\u5b9a\u7fa9\u3057\u3066\u3044\u308b\u5834\u5408\u300d\u306b\u8a66\u884c\u3055\u308c\u307e\u3059\u3002
    <\/p>\n\n\n\n
    <\/div>\n","protected":false},"excerpt":{"rendered":"
    Gutenberg\u306e\u30ab\u30b9\u30bf\u30e0\u30d6\u30ed\u30c3\u30af\uff08\u9759\u7684\u30d6\u30ed\u30c3\u30af\uff09\u306e\u30a2\u30c3\u30d7\u30c7\u30fc\u30c8\u65b9\u6cd5\u306b\u3064\u3044\u3066\u306e\u30e1\u30e2\u3067\u3059\u3002\u30a2\u30c3\u30d7\u30c7\u30fc\u30c8\u3067\u9759\u7684\u30d6\u30ed\u30c3\u30af\uff08save.js\uff09\u306b\u5909\u66f4\u3092\u52a0\u3048\u308b\u3068\u3001\u300c\u30d6\u30ed\u30c3\u30af\u306e\u30ea\u30ab\u30d0\u30ea\u30fc\u30dc\u30bf\u30f3\u3092\u8a66\u884c\u300d\u30dc\u30bf\u30f3\u304c\u8868\u793a\u3055\u308c\u307e\u3059\u3002\u975e\u63a8\u5968\u30d0\u30fc...<\/p>\n","protected":false},"author":1,"featured_media":7921,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"inline_featured_image":false,"footnotes":""},"categories":[151],"tags":[],"class_list":["post-12623","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-create-custom-block"],"_links":{"self":[{"href":"https:\/\/colors-themes.com\/clock\/wp-json\/wp\/v2\/posts\/12623","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/colors-themes.com\/clock\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/colors-themes.com\/clock\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/colors-themes.com\/clock\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/colors-themes.com\/clock\/wp-json\/wp\/v2\/comments?post=12623"}],"version-history":[{"count":162,"href":"https:\/\/colors-themes.com\/clock\/wp-json\/wp\/v2\/posts\/12623\/revisions"}],"predecessor-version":[{"id":13055,"href":"https:\/\/colors-themes.com\/clock\/wp-json\/wp\/v2\/posts\/12623\/revisions\/13055"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/colors-themes.com\/clock\/wp-json\/wp\/v2\/media\/7921"}],"wp:attachment":[{"href":"https:\/\/colors-themes.com\/clock\/wp-json\/wp\/v2\/media?parent=12623"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/colors-themes.com\/clock\/wp-json\/wp\/v2\/categories?post=12623"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/colors-themes.com\/clock\/wp-json\/wp\/v2\/tags?post=12623"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}