JSX構文


  • JSXでclassを指定した場合、classNameとして指定します.
  • データをバインドする場合は、{変数名}にバインドします.
  • このようにして
  • 関数をバインドすることも可能である.
  • 画像を入力すると、直接パスを指定できますが、通常は上部に入力し、インポートした変数名を{変数名}として指定します.
  • スタイルを指定すると、オブジェクトとして挿入されます.これは、styleに入る記号がJavaScriptに影響するため、styleを直接指定するとエラーになります.
      <div style = { { color : 'blue' } }></div></div>
  • スタイルでオブジェクトとして指定されても-シンボルとして指定することはできません.だからカメル命名規則に従って指定します.
      <div style = { { fontSize : 'blue' } }></div></div>
  • function App() {
      let posts = {color : 'blue' , fontSize : '30px'};
      return (
        <div className="App">
          <div className="black-nav">
            개발 Blog
          </div>
          <div style ={ posts }></div>
        </div>
      );
    }
    このように指定することもできます.