Question

我是React的新手，但对本机iOS开发了解很多。我试图围绕技术;我为你的无知事先道歉。请尽量提供帮助而不是伤害。所以我有一个可以工作的登录页面并将数据传递给下一个视图。代码在这里：

  _getHours = () => {
    this.setState({ isLoading: true });
    fetch('https://seniordevops.com/clockin/list', {
        method: 'GET',
        headers: {
            'Accept': 'application/json',
            'Content-Type': 'application/json',
          },
        credentials: 'include'
      })
      .then(response => response.json())
      .then((responseJson) => {
        this.setState({ 
          isLoading: false , 
        });
        this.props.navigator.push({
          title: 'Clock In',
          component: Clockin,
          passProps: {intervals: responseJson}
        });
      })
      .catch(error =>
        this.setState({
          isLoading: false,
          message: 'Something bad happened ' + error
      }));
  }

下一个视图运行顺利然后我到达我必须基于类似的API调用更新FlatList的部分，除了这次参数，代码如下：

  _getHours = (currentProject) => {
    this.setState({currentProject: currentProject });
    fetch('https://seniordevops.com/clockin/list?project=' + currentProject, {
      method: 'GET',
      headers: {
          'Accept': 'application/json',
          'Content-Type': 'application/json',
        },
      credentials: 'include',
    })
    .then(response => response.json())
    .then((responseJson) => {
      alert(JSON.stringify(responseJson));
    })
    .catch(error =>
      this.setState({
        isLoading: false,
        message: 'Something bad happened ' + error
    }));
  }

只有这一次，我不知道该怎么办。我的警报是回馈我想要的JSON，我只是不知道如何处理它。这是'我的FlatList：

<FlatList
  data={this.props.intervals}
  keyExtractor={this._keyExtractor}
  renderItem={this._renderItem}
  ListHeaderComponent={this.renderHeader}
/>

我知道状态更多是动态变量，但我最初传入了一个道具。也许我需要设置默认道具然后传递状态，idk。如何告诉FlatList我有新数据并重新渲染？旁白/红利问题：我是否应该考虑在某个时候重构网络类，如果是，请使用Redux？那是什么意思？如果你能给我一个整体的网络策略，请专注于我的主要问题，然后是奖励积分。

Answer 1

阅读文档，再考虑一下，这是我的解决方案。将此函数添加到iOS等效的ViewController中，在React中我们说默认组件类（我认为？）：

 componentDidMount() {
   this.setState({ hours: this.props.intervals});
 }

这个功能对我来说似乎是ViewDidLoad（）的iOS版本。它是你应该进行API调用的地方，但是我已经使用之前的ViewController制作了，所以我设置了作为初始值传递它的道具。然后改变了我的组件以监控状态而不是支柱。

<FlatList
  data={this.state.hours}
  keyExtractor={this._keyExtractor}
  renderItem={this._renderItem}
  ListHeaderComponent={this.renderHeader}
/>

当然，用一个用于AJAX响应的setState替换了警报。

.then((responseJson) => {
  this.setState({ hours: responseJson});
})

将数据从AJAX调用传递到React Native

1 个答案: