如何将输入数据从 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)
})
};
我正在尝试使用 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)
})
};