React.js 知識點總結(jié)：

之前已大量使用過 Vue.js 所以對于學習 React.js 有所幫助，看起來還是 Vue.js 好學一些。
測試在瀏覽器環(huán)境使用，文件引入：

-- react.js     核心文件
-- react-dom.js DOM操作相關(guān)
-- babel.js     JSX 轉(zhuǎn)換成 js, 只是在測試的時候使用，實際生產(chǎn)環(huán)境需要在服務(wù)器端轉(zhuǎn)換完成再使用

JSX 文件

jsx 文件可以寫在 script 里面，但是要注意 type = text/babel, 不可以直接作為 javascript 使用。

組件

創(chuàng)建組件

var MyCom = React.createClass({
    // 設(shè)置 props 默認值
    getDefaultProps() {
        return {
            title: 'Default Title'
        }
    },
    // 設(shè)置 state 默認值
    getInitialState() {
        return {
            count: 5,
            maxNum: 10
        }
    },
    // btn 事件
    addCount() {
        if(this.state.count >= this.state.maxNum){
            return false
        }
        this.setState({
            count: this.state.count+1
        })
    },
    // 渲染結(jié)構(gòu)
    render() {
        return (
            <div ref="rootbox">
                <h3>{this.props.title}</h3>
                <div>{this.state.count}</div>
                <button onClick="addCount">click</button>
            </div>
        )
    }
})

使用組件

ReactDOM.render(
    <MyCom title="this is a title" />,
    document.getElementById('app')
)