码迷,mamicode.com
首页 > 其他好文 > 详细

React中的表单应用

时间:2018-05-10 15:49:04      阅读:143      评论:0      收藏:0      [点我收藏+]

标签:body   tin   stat   文本   and   type   state   不能   AC   

React中的表单应用

用户在表单填入的内容,属于用户跟组件的互动,所以不能用this.props读取。

var Input = React.createClass({
    //初始化组件数据
    getInitialState(){
        return {value:‘hello‘};
    },
    handleChange(event){
        this.setState({value:event.target.value})
    },
    render(){
        var  value = this.state.value;
        <div>
            <input type=‘text‘ value={value}  onChange={this.handleChange} />
            <p>{value}</p>
        </div>
    }
});

ReactDOM.render(
    <Input />,
    document.body
);

上面代码中,文本输入框的值,不能用this.props.value读取,而要定义一个onChange事件的回调函数,通过event.target.value读取用户的值。textarea元素、select元素、radio元素都属于这种情况,

React中的表单应用

标签:body   tin   stat   文本   and   type   state   不能   AC   

原文地址:https://www.cnblogs.com/guolintao/p/9019519.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!