{"id":3449,"date":"2022-07-31T16:38:30","date_gmt":"2022-07-31T07:38:30","guid":{"rendered":"https:\/\/dennie.tokyo\/it\/?p=3449"},"modified":"2022-08-12T12:51:44","modified_gmt":"2022-08-12T03:51:44","slug":"%e3%80%90react%e3%80%91%e3%82%b3%e3%83%b3%e3%83%9d%e3%83%bc%e3%83%8d%e3%83%b3%e3%83%88%e3%81%b8%e5%80%a4%e3%82%92%e6%b8%a1%e3%81%99","status":"publish","type":"post","link":"https:\/\/dennie.tokyo\/it\/?p=3449","title":{"rendered":"\u3010React\u3011\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u3078\u5024\u3092\u6e21\u3059"},"content":{"rendered":"\n

\u524d\u56de\u306f\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u3092\u4f5c\u6210\u3057\u3001\u5404\u3005\u306e\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u3067\u30d6\u30e9\u30a6\u30b6\u3078\u6587\u5b57\u3092\u8868\u793a\u3055\u305b\u307e\u3057\u305f\u3002<\/p>\n\n\n\n\n\n\n\n

\u524d\u56de<\/span>\n

<\/p>\n

\u3010React\u3011\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8<\/a><\/p>\n<\/div>\n\n\n\n

\u4eca\u56de\u306f\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u3078\u5024\u3092\u6e21\u3057\u3001\u6e21\u3057\u305f\u5024\u3092\u30d6\u30e9\u30a6\u30b6\u3078\u8868\u793a\u3055\u305b\u307e\u3059\u3002<\/p>\n\n\n\n

\u5024\u306e\u6e21\u3057\u65b9<\/h1>\n\n\n\n

\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u3078\u5024\u3092\u6e21\u3059\u306b\u306f\u3001\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u3078\u5c5e\u6027(attribute)\u3092\u6307\u5b9a\u3057\u307e\u3059\u3002\u6307\u5b9a\u3057\u305f\u5c5e\u6027\u3092\u7d4c\u7531\u3057\u3066\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u3078\u5024\u304c\u6e21\u3055\u308c\u307e\u3059\u3002<\/p>\n\n\n\n

\u4eca\u56de\u306f\u3001App \u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8 \u304b\u3089 Sample \u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8 \u3078\u5024\u3092\u6e21\u3057\u307e\u3059\u3002\u4ee5\u4e0b\u306f App\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8 \u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n

import Sample from '.\/Sample';\n\nfunction App() {\n  return (\n    <>\n      <div>{"TEST"}<\/div>\n      <Sample str_txt = "SAMPLE" \/>\n    <\/>\n  );\n}\n\nexport default App;<\/code><\/pre><\/div>\n\n\n\n
Sample \u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u3078 “str_txt” \u3068\u3044\u3046\u5c5e\u6027\u540d\u3092\u6307\u5b9a\u3057\u3001\u5c5e\u6027\u5024\u306b “SAMPLE” \u3068\u3044\u3046\u6587\u5b57\u5217\u3092\u6307\u5b9a\u3057\u3066\u3044\u307e\u3059\u3002<\/p>\n\n\n\n
\u5024\u306e\u53d7\u3051\u53d6\u308a\u65b9<\/h1>\n\n\n\n
\u7d9a\u3044\u3066\u4ee5\u4e0b\u306f\u3001\u5024\u3092\u53d7\u3051\u53d6\u308b Sample\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8 \u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n
function Sample(props) {\n  return (\n    <p>{props.str_txt}<\/p>\n  );\n}\n\nexport default Sample;<\/code><\/pre><\/div>\n\n\n\n
\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306e\u5f15\u6570\u304b\u3089\u5024\u3092\u53d7\u3051\u53d6\u308b\u4e8b\u304c\u3067\u304d\u307e\u3059\u3002\u5f15\u6570\u540d\u306f\u4efb\u610f\u3067\u69cb\u3044\u307e\u305b\u3093\u3002\u4eca\u56de\u306f “props” \u3068\u3044\u3046\u540d\u524d\u3092\u4f7f\u7528\u3057\u307e\u3057\u305f\u304c\u3001”my_props” \u306a\u3069\u3068\u3057\u3066\u3082\u826f\u3044\u3067\u3059\u3002\u5f15\u6570\u306e\u30d7\u30ed\u30d1\u30c6\u30a3\u3078\u3001\u5c5e\u6027\u540d\u3092\u6307\u5b9a\u3059\u308b\u3068\u5c5e\u6027\u5024\u3092\u53c2\u7167\u3059\u308b\u4e8b\u304c\u53ef\u80fd\u3067\u3059\u3002\u4eca\u56de\u306f “props.str_txt” \u3067\u5c5e\u6027\u5024\u3092\u53d6\u5f97\u3057\u3066\u3044\u307e\u3059\u3002<\/p>\n\n\n\n
“\u5f15\u6570\u540d.\u30d7\u30ed\u30d1\u30c6\u30a3\u540d” \u3068\u6bce\u56de\u66f8\u304f\u306e\u304c\u9762\u5012\u306a\u5834\u5408\u3001\u4ee5\u4e0b\u306e\u3088\u3046\u306b\u3057\u3066\u3082\u5c5e\u6027\u5024\u3092\u53d6\u5f97\u3059\u308b\u4e8b\u304c\u3067\u304d\u307e\u3059\u3002<\/p>\n\n\n\n
function Sample({str_txt}) {\n  return (\n    <p>{str_txt}<\/p>\n  );\n}\n\nexport default Sample;<\/code><\/pre><\/div>\n\n\n\n
\u6700\u5f8c\u306b<\/h1>\n\n\n\n
\u7279\u306b\u3042\u308a\u307e\u305b\u3093\u3002<\/p>\n","protected":false},"excerpt":{"rendered":"
\u524d\u56de\u306f\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u3092\u4f5c\u6210\u3057\u3001\u5404\u3005\u306e\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u3067\u30d6\u30e9\u30a6\u30b6\u3078\u6587\u5b57\u3092\u8868\u793a\u3055\u305b\u307e\u3057\u305f\u3002<\/p>\n","protected":false},"author":1,"featured_media":6,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[29],"tags":[],"class_list":["post-3449","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-react"],"_links":{"self":[{"href":"https:\/\/dennie.tokyo\/it\/index.php?rest_route=\/wp\/v2\/posts\/3449","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/dennie.tokyo\/it\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/dennie.tokyo\/it\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/dennie.tokyo\/it\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/dennie.tokyo\/it\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=3449"}],"version-history":[{"count":15,"href":"https:\/\/dennie.tokyo\/it\/index.php?rest_route=\/wp\/v2\/posts\/3449\/revisions"}],"predecessor-version":[{"id":3563,"href":"https:\/\/dennie.tokyo\/it\/index.php?rest_route=\/wp\/v2\/posts\/3449\/revisions\/3563"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/dennie.tokyo\/it\/index.php?rest_route=\/wp\/v2\/media\/6"}],"wp:attachment":[{"href":"https:\/\/dennie.tokyo\/it\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=3449"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/dennie.tokyo\/it\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=3449"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/dennie.tokyo\/it\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=3449"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}