使用ReactJS + Redux + Cloud Endpoints获取初始页面数据

Question

我使用ReactJS + Redux + Google Cloud Endpoints。 现在，对于初始页面加载，我必须通过Cloud Enpoints提取并显示数据。 那将如何实现？ 完整的代码示例表示赞赏！

Answer 1

基本上，您可以使用空白面板装载应用程序，可以是覆盖面板，也可以是加载微调器，然后在componentDidMount()获取数据。 来自React docs 。

通过AJAX加载初始数据

在componentDidMount中获取数据。 响应到达时，将数据存储在状态下，触发渲染以更新UI。

异步获取数据时，在卸载组件之前，使用componentWillUnmount取消所有未完成的请求。

该示例获取所需的Github用户的最新摘要：

 var UserGist = React.createClass({ getInitialState: function() { return { username: '', lastGistUrl: '' }; }, componentDidMount: function() { this.serverRequest = $.get(this.props.source, function (result) { var lastGist = result[0]; this.setState({ username: lastGist.owner.login, lastGistUrl: lastGist.html_url }); }.bind(this)); }, componentWillUnmount: function() { this.serverRequest.abort(); }, render: function() { return ( <div> {this.state.username}'s last gist is <a href={this.state.lastGistUrl}>here</a>. </div> ); } }); ReactDOM.render( <UserGist source="https://api.github.com/users/octocat/gists" />, mountNode );