react-form表单

import React from "react";
// import "../css/style1.css";

class Form extends React.Component{
    constructor() {
        super();
        this.state = {
            text: '旺旺',
            select: "日本",
            textarea:"帮助大家思考的结局撒娇啊开始打算看电视"
        };

        //当函数中要用到this时，需要绑定this
        this.handleText = this.handleText.bind(this);
        this.handleSelect = this.handleSelect.bind(this);
        this.handleTextarea = this.handleTextarea.bind(this);
        this.submit = this.submit.bind(this);
    }
    handleText(e) {
        this.setState({
            text: e.target.value
        });
    }
    handleSelect(e) {
        this.setState({
            select: e.target.value
        });
    }
    handleTextarea(e) {
        this.setState({
            textarea: e.target.value
        });
    }
    submit(e) {
        console.log("提交");
        //取消默认行为
        e.preventDefault();
    }
    render() {
        return (
            

                

                    姓名：
                    
                
                

                    性别：
                    男
                    女
                    {/*使用checked会出错，应该用defaultChecked*/}
                
                

                    喜好：
                    篮球
                    足球
                    羽毛球
                
                

                    国籍：
                    
                    {/*通过设置select的value来设置默认选中值（根据option的value）*/}
                        中国
                        日本
                        美国
                    
                
                

                    备注：
                    
                
                

                    
                
            
        )
    }
}

export default Form;