。React.render()函數(shù)的第一個(gè)參數(shù)只能是一個(gè)標(biāo)簽，不能是并列的兩個(gè)標(biāo)簽。不過一個(gè)標(biāo)簽里的子標(biāo)簽可以隨便的添加，所以最好的方法就是，在外面添加一個(gè)

使用組件（Component）

上面的方法是直接將你想要的寫在React.render()里，通常的做法是引用組件

定義一個(gè)組件

class 組件名 extends React.Component(
    //your code
);

組件里可以添加很多功能，比如想要添加一個(gè)按鈕，你只需直接寫你想要的DOM結(jié)構(gòu)，而不需要使用javascript語法：createElement()、appendChild()等

class 組件名 extends React.Component(
    render(){
        return (Batman);
    }
);

在組件里寫好你想要的東西，使用React.render()進(jìn)行渲染

React.render(
    <組件名/>,
    想要渲染的位置
)

完整代碼可以如下

效果、頁面結(jié)構(gòu)

我們看到，頁面上出現(xiàn)了我們想要的按鈕，頁面結(jié)構(gòu)里也成功添加了標(biāo)簽。注意?。?！組件名首字母必須大寫?。?！引用組件注意代碼<組件名/>，一個(gè)符號(hào)都不能錯(cuò)的?。?！

使用props

props用來獲取組件的靜態(tài)屬性，可以先看下面的一個(gè)小例子：

不必驚慌，修改的地方只有組件的render()和實(shí)際渲染的render()兩個(gè)函數(shù)。

第一個(gè)render()添加了

的type屬性，該屬性值指向{this.props.buttontype}，意思是該組件名為buttontype的靜態(tài)屬性。這個(gè)render()還將的顯示文字指向{this.props.children}，意思是該組件的子元素這個(gè)靜態(tài)屬性

第二個(gè)render()函數(shù)添加了的靜態(tài)屬性buttontype，和一個(gè)text類型的子元素Batman

結(jié)論就是：在渲染真實(shí)DOM的時(shí)候，會(huì)創(chuàng)建一個(gè)

標(biāo)簽，它的type屬性值為submit，文字顯示為Batman

效果、頁面結(jié)構(gòu)，哈哈哈，沒啥區(qū)別，沒區(qū)別就對(duì)了：

props的傳遞性

props只能從父元素向下傳遞給子元素：

當(dāng)有多個(gè)屬性你想傳遞的時(shí)候，你的代碼可能就會(huì)是這樣的，會(huì)重復(fù)很多遍{this.props.propsName}：

如果你不想重復(fù)很多遍繁瑣的{this.props.propsName}，那你可以使用擴(kuò)展運(yùn)算符...表示取到所有的靜態(tài)屬性并且都使等于{this.props.propsName}，所以我們的代碼可以稍作簡化：