React--JSX語法

 

JSX語法，它是js語言的語法拓展。

 

好比2+2 ， 對象.屬性 ， 函數的調用均可以在jsx中書寫。

 

import React from "react";

 

export default class MyCompo extends React.Component{

constructor(){

super();

} 

 

render(){

var xiaoming = {

name : "小明"

};

 

function fun(){

return <ul>

<li>牛奶</li>

<li>咖啡</li>

</ul>

}

 

return (

<div>

<h1>我買了{1+2}個蘋果</h1>

<h1>{xiaoming.name}</h1>

<div>

{fun()}

</div>

</div>

);

}

}

 

注意一下，return的時候千萬不要return空，因此要麼在return的哪一行寫標籤的開始，要麼用圓括號包裹：