我不知道如何在單擊 ReactJS 中的按鈕時運行 .py 檔案。我想要的只是在單擊 React 應用程式中的按鈕時使用燒瓶獲取 .py 檔案創建的資料。我在該按鈕上設定了一個鏈接，該鏈接將重定向到另一個我想在其上顯示獲取的資料的網頁。React 應用程式和 .py 檔案在同一臺機器上。我不知道該怎么做。我在 React 應用程式中的 app.js 檔案在“http://localhost:3000”上運行
const onClickHandler = () => {
//fetching the data from the server localhost:5000/page_name
const url = "http://localhost:5000/data";
const [name, setName] = useState("");
const [password, setPassword] = useState("");
try {
const res = await fetch(url);
const data = await res.json();
console.log(data);
setName(data.name);
setPassword(data.password);
} catch (error) {
console.log(error);
}
};
return(
<div>
<button onClick={onClickHandler}>Click me</button>
{name}
{password}
</div>
);
我的 .py 檔案在“http://localhost:5000/my_link”上運行
from flask import Flask
from flask_cors import CORS
app = Flask(__name__)
CORS(app)
@app.route('/data',methods=['GET', 'POST'])
def my_link():
print("I got Clicked")
return {'name': "geek", "password": "This is PWD"}
if __name__ == '__main__':
app.run(debug=True)
uj5u.com熱心網友回復：
如果您對 api 的作業原理有一點誤解。
首先你應該對你的資料進行 jsonify，所以用 jsonify 包裝你的回報。
return jsonify({'name': "geek", "password": "This is PWD"})
然后在做任何花哨的訪問 /data 端點并查看是否有任何資料之前......應該或檢查您的代碼。
如果一切正常，請嘗試：
fetch('http://localhost:5000/data')
.then((response) => response.json())
.then((data) => console.log(data));
應該回傳一些資料。
在進入 React 之前，你應該了解 api 和 fetch 庫。
轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/511247.html
上一篇：我需要顫動中的可選按鈕
下一篇：按鈕在單擊時不執行任何操作