Question

我是Python开发学习JavaScript和React，我已经构建了一个简单的React应用程序，它消耗了我创建的API。我已经找到了如何从我的API中使用fetch到GET并在应用中使用该数据。

但是，我一直试图从组件中获取表单数据，将其存储为名为object的{{1}}，然后我会将其传递给request_data按钮{ {1}}。

你是怎么做到的？

submit_task()

Answer 1

以您的形式

<form id="submit_job" onSubmit={this.onSubmit}>
                    <label>
                        Material ID:
                        <input type="text" name="material_id" onChange={this.handleChange}/>
                    </label>
                    <br/>
                    <label>
                        Transcode Profile:
                        <ProfileList profiles={this.state.profiles}/>
                    </label>
                    <br/>
                    <label>
                        Start Date:
                        <input type="text" name="start_date" onChange={this.handleChange}/>
                    </label>
                    <br/>
                    <label>
                        End Date:
                        <input type="text" name="end_date" onChange={this.handleChange}/>
                    </label>
                    <br/>
                    <button type="submit">Submit</button>
                </form>

现在在你的班级

handleChnage = (e) => {
 this.setState({...this.state.request_data, [event.data.target]: event.data.value})
}

        onSubmit = () => {
          console.log(this.state.request_data)   // you should be able to see your form data
      }

并在您的构造函数中

constructor(){
        super();
        this.state = {
            "profiles": [],
            material_id: null,
           start_data: null,
           end_data: null
        };

        this.handleChange = this.handleChange.bind(this)
    };

React，如何将表单数据发布到API端点？

1 个答案: