JSX - ly-yuan-kai/Demo GitHub Wiki

React使用的語法為JSX,與原生的javascript不同

JSX語法跟XML相似,在<tag>中都需要以/做結尾。

JSX中可以利用變數來儲存這些XML語法。

for example:

const tag1 = <input type="text" />

const tag2 = <p>hello world!</p>

const tag3 = <br/>

class 和 for 由於為 JavaScript 保留關鍵字用法,因此在 JSX 中使用 className 和 htmlFor 替代。

const tag4 = <div className="test"></div>

在標籤內使用變數時需用{}包起來。

// Home.js
const message = "Hello World!!"

const h1Tag = <h1>{message}</h1>

class Home extends Component {
  render() {
    return(
      <>
        {h1Tag}
      </>
    )
  }
}
⚠️ **GitHub.com Fallback** ⚠️