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}
</>
)
}
}