{"author_url":"https://blog.hatena.ne.jp/kikiki-kiki/","blog_url":"https://chaika.hatenablog.com/","published":"2019-05-06 16:00:31","author_name":"kikiki-kiki","provider_url":"https://hatena.blog","title":"React JSX className \u306b\u5909\u6570\u3068\u56fa\u5b9a\u5024\u3092\u6df7\u305c\u3066\u4f7f\u3044\u305f\u3044","description":"React\u306eJSX\u3067\u30af\u30e9\u30b9\u540d\u3092\u4ed8\u3051\u308b\u6642\u306b\u5909\u6570\u3068\u56fa\u5b9a\u5024\u306a\u6587\u5b57\u5217\u3092\u4e00\u7dd2\u306b\u4f7f\u3044\u305f\u3044\u3068\u304d \u30b3\u30ec\u306f\u3046\u307e\u304f\u3044\u304b\u306a\u3044 return ( <button className=\"btn btn-${btnState}\">BUTTON</button> ); \u6587\u5b57\u5217\u7d50\u5408\u3059\u308b function Button() { const [btnState, setBtmState] = useState('primary'); return ( <button className={'btn btn-' + btnState}>BUTTON</button> ); } \u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u69cb\u6587 (ES2015)\u3092\u4f7f\u3046 functi\u2026","version":"1.0","height":"190","html":"<iframe src=\"https://hatenablog-parts.com/embed?url=https%3A%2F%2Fchaika.hatenablog.com%2Fentry%2F2019%2F05%2F06%2F160031\" title=\"React JSX className \u306b\u5909\u6570\u3068\u56fa\u5b9a\u5024\u3092\u6df7\u305c\u3066\u4f7f\u3044\u305f\u3044 - \u304b\u3082\u30e1\u30e2\" class=\"embed-card embed-blogcard\" scrolling=\"no\" frameborder=\"0\" style=\"display: block; width: 100%; height: 190px; max-width: 500px; margin: 10px 0px;\"></iframe>","blog_title":"\u304b\u3082\u30e1\u30e2","width":"100%","categories":["React","JSX","JavaScript","ES2015 (ES6)"],"url":"https://chaika.hatenablog.com/entry/2019/05/06/160031","provider_name":"Hatena Blog","image_url":"https://cdn.user.blog.st-hatena.com/default_entry_og_image/96878281/1514238152368576","type":"rich"}