首页 > 解决方案 > 从第二个操作添加一些数据后如何刷新选项卡

问题描述

我使用过 react native 选项卡视图。我在第一个选项卡中有列表视图。我想从另一个屏幕添加一个项目到列表视图。刷新数据。我尝试遵循代码。

tabLiability =() =>{
    return <TabLiability ref={(ref) => {
        this.tabLiability = ref;
    }} goToPage={this.goToPage}/>
}

componentWillReceiveProps(nextProps) {
    console.log("********** recived", nextProps);

    this.tabLiability.test()

}

TypeError: _this.tabLiability is not a function Can't call setState (or forceUpdate) on an unmounted component。这是一个空操作,但它表明您的应用程序中存在内存泄漏。要修复,请取消 componentWillUnmount 方法中的所有订阅和异步任务。

标签: react-native

解决方案


通过任何其他选项卡的操作更改任何选项卡中的数据。

感谢这个https://stackoverflow.com/a/46721776/11392122中的这个人 @xSkrappy,我从上面的链接中得到了基本的想法,并根据我的需要进行了更改。

因为我需要通过其他选项卡更改选项卡中的数据。所以我用这种方法解决了。

在您实际放置本机基本选项卡的文件中创建一个函数。我已将该功能置于各州。(在制表符文件中)

this.state= {
msg:"hey",
totalSale: 0,
changefunc : (x) => {
this.setState({
totalSale: x,
}); }

我的主要目标是在某些选项卡中获取此 totalSale 的更新值。因此,我还在我的状态中放置了一个函数名称 changeFunc,因此我将在其他选项卡中调用此函数来设置整个选项卡的 totalSale 的状态。

要将其发送到其他选项卡,我不知道其他选项卡程序,我只是在这里使用了本机基本选项卡。所以下一步是:

<Container>
<Tabs  transparent  >
<Tab heading='Sale'>
   <SaleTab sampleProp= {this.state.changefunc}/>
</Tab>
<Tab >
   <TotalTab navigation={this.props.navigation}  sampleProp= 
    {this.state.totalSale}  />
</Tab>

所以现在在 saleTab 中,每当我改变 totalSale 的值时,我就调用它:

 this.props.sampleProp(tsale);  //tsale is any value entered for totalSale

并且为了访问其他选项卡中更改的值,我直接在标签上调用它:

 <Label>{this.props.sampleProp} PKR</Label>

确保您在构造函数中传递道具,如下所示:

 constructor(props){
 super(props);
 ...// your code stuff
 }

推荐阅读