react 新手學習筆記1

組件的屬性改變時是再次調用組件對象的render方法來從新渲染dom

var Input = React.createClass({
    getInitialState: function() {
        return {value: "hello"};
    },
    handleChange: function(event) {
        this.setState.value = event.target.value;
    },
    render: function() {
        return(
            <div>
            <input type = "text" value = "hello" onChange = {this.handleChange} />
            </div>
            );
    }
});

上面的代碼並不能修改input裏面的文本內容,,由於在調用handleChange事件的時候雖然改變了組件的屬性, 可是在從新繪製的時候仍是會將value屬性修改爲"hello".

因此<input>標籤應該寫成

<input type = "text" value = {this.State.value} onChange = {this.handleChange} />