如何在事件内传递功能组件?

时间:2019-05-08 16:30:48

标签: javascript reactjs

因此,我有一个表单,我希望用户在用户单击“提交”按钮时显示用户填写的值作为JSON对象的结尾。

在Form.js中,

state={
group:[
type-A{col1: "",
col2:""
}
]
}


handleSubmit(event) {
        event.preventDefault();
        <Credentials value={JSON.stringify(this.state)}/>
      }
change = e =>{
        this.setState({[e.target.name]: e.target.value})
    };
 render(){
        return(
            <div class="classform">
            <form >
             <label>
                    Column1:
                    <br/>
                    <input type="text"
                    name="group1"
                    placeholder="Column1"
                    value={this.state.column1}
                    onChange={e=> this.change(e)}
//other fields
//input form fields
 <button onClick={this.handleSubmit}>Submit</button>

在Credentials.js中,

    return (
        <p>{value}</p>
    )
}

export default Credentials

以上代码在第二行(<Credentials value={JSON.stringify(this.state)}/>)的handleSubmit()中给我一个错误

当用户单击“提交”按钮时,我想获取一个在表单的输入字段中输入的数据的JSON对象,并在用户更新字段中的任何信息时对其进行更新。

1 个答案:

答案 0 :(得分:4)

将组件移动到render方法。并使用条件渲染。

<img />

URLFOR($Resource.Static)