Reactのコンポーネントは再利用可能
一度定義したコンポーネントはいくらでも作成して再利用することができます。
const Test = (attr) => {// アロー関数です(wordpressで上手く表示されないので) return <h1>hello, {attr.name}</h1>; };
ちなみにファンクショナルコンポーネントの場合は、this.attr.nameというようにthisを付ける必要はありません。
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8" /> <title>Reactサンプル</title> <script src="https://unpkg.com/react@15/dist/react.min.js"></script> <script src="https://unpkg.com/react-dom@15/dist/react-dom.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.38/browser.min.js"></script> </head> <body> <!-- コーディング部分 --> <div id="koko"></div> <script type="text/babel"> const Test = (attr) => { return <h1>hello, {attr.name}</h1>; }; const Render = () => { return ( <div> <Test name="Takahashi" /> // 何度も再利用できる <Test name="Okuyama" /> // 何度も再利用できる </div> ) }; ReactDOM.render( <Render />, document.getElementById("koko") ) </script> </body> </html>

KHI入社して退社。今はCONFRAGEで正社員です。関西で140-170/80~120万から受け付けております^^
得意技はJS(ES6),Java,AWSの大体のリソースです
コメントはやさしくお願いいたします^^
座右の銘は、「狭き門より入れ」「願わくは、我に七難八苦を与えたまえ」です^^
コメント