javascript - 在 React 中发布数据

Question

我对 javascript 和 React 很陌生，所以才有这个问题。 我需要从组件内部发布数据。 我正在使用 fetch API 进行 POST。这是我的代码。

export function postData(url, sender, media){
  return fetch(url, { headers: { 'Accept': 'application/json', 'Content-Type': 'application/json'},
                      credentials: 'include',
                      method: 'POST',
                      body: JSON.stringify({sender: sender, media: media})
  })
    .then((response) => { return response.json() ;})
    .catch((error) =>{ console.log("Request failed: ", error) ;})

}

在我的组件中，我有两种方法可以获取我打算从子组件中的回调中发布的值。

class MyComponent extends React.Component{

..........
handleClick(sender){
    console.log(data);

  }

  handleSubmit(media){
    console.log(data);
  }
......
render(){
......
passing down handleSubmit and handleClick as props to child
    }
}

如何以及在组件中的何处调用我的 postData 方法以及如何传递 sender 和 media。

Answer 1

嗯，click 和 submit 是单独的事件，因此如果您希望它们都通过，则必须以稍微不同的方式构建事物。

就调用 postData 而言，看起来你必须这样做

import { postData } from foo;

...位于MyComponent 文件的顶部，因此该函数可用。正确导入 postData 后，您可以在事件处理函数中使用它。

我刚刚浏览了您的fetch，但看起来应该没问题，或者至少很容易调试。

<小时/>

总之:修复它，以便您拥有一个事件处理程序，该事件处理程序将作为参数传递 media 和 sender 。然后，导入 postData 并在处理程序中调用它。