阵营本机：如何更新依赖于联播网，响应

假设视图我有两个屏幕：主屏幕& LocationScreen阵营本机：如何更新依赖于联播网，响应

步骤：首先我从主屏幕导航（状态= {位置：“A”}）至LocationScreen。在LocationScreen

改变的位置（状态= {位置：“B”}）

它传递到主屏幕和改变位置从A到B

现在，主屏幕查看具有依赖于位置的状态。

所以我的问题是，如何更新主屏幕的视图内容，因为内容来自网络响应后位置更新？

来源

2017-07-22 subhajit

你所遭受的是React中状态管理的一个常见问题。为了减轻麻烦，还有另一个名为Redux的库。给它一个阅读。

要回答你的问题，Redux提供了一个连接函数，它有两个参数：1）mapStateToProps & 2）mapDispatchToProps。您可以使用这两个函数和名为“componentWillReceiveProps（nextProps）”的生命周期方法轻松解决您的问题。

这里是你可以参考的例子：https://stackoverflow.com/a/38203735/2164029

来源

2017-07-22 05:35:14 atitpatel

感谢您的回复，但它如何帮助我更新主屏幕的视图内容，因为内容来自网络响应后位置更新？ – subhajit

然后，您可能应该在请求网络响应时启动活动指示器，并在您收到响应后立即停止响应。然后你可以使用状态变量更新视图。 – atitpatel

Redux是一个很好的阅读。当状态发生变化时，是否会自动重新更新（更新意味着重新加载完整组件）组件？ – subhajit

终极版是应用状态管理一个伟大的工具，特别是对于那些在在应用一些地方共享的状态。

尽管如此，我认为正常的React状态应该足够了。

将屏幕上的Location屏幕更改为Home屏幕后，Home屏幕可以触发数据抓取。通过将内容存储在组件状态中，您可以轻松地在渲染功能中引用它们。 this.setState触发组件的重新呈现，因为任何state更改或prop更改将导致重新呈现

例如，

class HomeScreen extends Component { 
    ... 
    onLocationChange(newLocation) { 
    this.setState({ loading: true, newLocation }); // Loading data, and storing new location 
    fetchDataBasedOnLocation().then((data) => { 
     this.setState({ content: data. loading: false }); 
    }); 
    } 

    render() { 
    return (
     ... 
     {Your content in this.state.content} 
     ... 
    ); 
    } 
}

希望这对您有所帮助！

来源

2017-07-22 09:28:00 hyb175

阵营本机：如何更新依赖于联播网，响应

回答

相关问题