检查数据是否发布在reactJS中

时间:2018-06-25 02:10:55

标签: javascript reactjs post

新的反应在这里。现在,我尝试按照之前的堆栈溢出帖子React: Fetch DELETE and PUT requests通过API进行发布。这是我的代码:

 submitHandler = (event) => {
    const state = this.state.newClient
    this.setState({creating: false, submitable:false});
    this.resetNewClient();
    event.preventDefault();
    const formData = new FormData();
    formData.append('slug', state.slug);
    formData.append('name', state.name);
    formData.append('description', state.description);
    return fetch('https://reqres.in/api/users', {
        method: 'POST',
        body: formData
    })
    .then(response => response.json())
    .then((json) => {
    console.log('success')
    })
}

如果有误,请更正我的代码。 SubmitHandler由一个按钮触发,而newClient是一个包含段,名称和描述的数组。但是,除了我的代码是否正确之外,我要知道的是如何检查数据是否正确发布到API中。如果有必要,这里是componentDidMount来获取数据。

componentDidMount() {
    fetch("https://reqres.in/api/users?page=3")
    .then(data => data.json())
    .then(datum => {
        const results = datum.data.map(x => {
        return {
          slug: x.id,
          name: x.first_name,
          description: x.last_name
        }
    })
    this.setState({ clients: results });
    });
}

如果还有更好的方法可以做到这一点,我也想知道。谢谢

1 个答案:

答案 0 :(得分:0)

我通常构造一个JavaScript对象并执行JSON.stringify来发布数据。

const postData = {
  slug: state.slug,
  name: state.name,
  description: state.description
};
return fetch('https://reqres.in/api/users', {
  method: 'POST',
  body: JSON.stringify(postData)
})