如何将输入数据从 ReactJS 传递到 Flask-Python(后端)

How to pass input data from ReactJS to Flask-Python (Backend)

我正在尝试使用 ReactJS 作为前端并使用 Python Flask 作为后端来构建目录网站。我正在尝试将我的 searchbar.js 中的文本输入传递到我的 Python 脚本,但我无法找到一种方法来显示我从前端传递到后端的数据以确保我'数据真的过关了

这是我的 searchbar.js,我尝试将数据存储在一个变量中,并将其传递给我在 python 中创建的 api 路由:

function SearchBar() {
  const [searchedText, setSearchedText] = useState("");
  let navigate = useNavigate();

  const onSearch = () => {
    navigate(`/search?q=${searchedText}`);
    fetch('/ML/search',{
      method: 'POST',
      body: JSON.stringify({
        content:searchedText
      })
    })
  };
  return (
    <div>
      <Input.Search
        placeholder="Enter keyword..."
        onChange={(e) => {
          setSearchedText(e.target.value);
        }}
        onSearch={onSearch}
        onPressEnter={onSearch}
        enterButton></Input.Search>
    </div>
  );
}
export default SearchBar;

这是我在 python 中的 api 路由,用于获取从我的前端传递的数据:

@app.route('/ML/search', methods=['POST'])
def search():
    request_data = json.loads(request.data)
    searchData = request_data['content']
    return searchData

所以基本上我想要发生的是我想将我的 searchbar.js 中的输入传递到我的 Python 后端并将其存储为一个变量,这样我就可以使用该变量来搜索列在 SQL

您可以使用以下代码将数据打印回控制台。

  const onSearch = () => {
    navigate(`/search?q=${searchedText}`);
    fetch('/ML/search',{
      method: 'POST',
      body: JSON.stringify({
        content:searchedText
      })
    }).then(response => response.json()
      .then(data => ({ data, response })))
      .then(({ data, response }) =>  {
        console.log(data)
      })
  };