如何在反应网络应用程序中获取和表示由python生成的数据
问题描述:
我目前正在开发一个小型项目来构建一个Web应用程序,以便可视化我已完成的一些Python脚本生成的一些本地数据以及前端数据可视化被写入反应。我有点困惑,我怎么能获取数据来代表我的网络应用程序。我看到了一些使用fetch()而不是jQuery的建议。但是我所做的一切都是在本地托管的,那么我如何向React发出Python脚本的请求,以及如何从Python中的fetch()请求中检索params?谢谢!如何在反应网络应用程序中获取和表示由python生成的数据
import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';
import RadarChart from './components/RadarChart';
import LineChart from './components/LineChart';
class App extends Component {
constructor() {
super();
this.state = {
bioData: {},
appData: {}
}
}
componentWillMount() {
this.getChartData();
}
static lastSyncTime = "2017-06-28";
getChartData() {
// TODO: AJAX calls/fetch() request here to retrieve data as well as pass a param: lastTimeSync to Python scripts
this.setState({
});
}
render() {
return (
<div className="App">
<div className="App-header">
<img src={logo} className="App-logo" alt="logo" />
<h2>Daily Report</h2>
</div>
<LineChart chartData={this.state.bioData} />
<br/>
<button onClick = {this.handleRefreshLine}>Refresh</button>
<br/>
<RadarChart chartData={this.state.appData} />
</div>
);
}
}
export default App;
答
像这样的东西可以帮助你:
getChartData() {
$.getJSON("https://yourserver.com/your/python/api", { lastTimeSync: App.lastSyncTime }).then(results => {
this.setState({ appData: results.appData, bioData: results.bioData })
})
}
你需要在你的Python后端公开的API。您需要创建一个接受参数并返回数据的端点。如果使用fetch(或axios),那么您将使用来自后端的响应更新您的状态。尽管提供了特定的代码示例,但问题太广泛了。 –
@ChaseDeAnda thx男子。我只是在寻找一个方向,而不是完全的代码。我会尝试你的建议! –