Ios 在后退动作中对本机重新加载屏幕A作出反应

我让ScreenA单击下一个ScreenB，然后返回到屏幕A不调用函数componentWillMount（）

ScreenA->Next->ScreenB->Back（）->ScreenA

import React from "react";
import { Button, Text, View } from "react-native";

class ScreenA extends Component {
  constructor(props){
    super(props)
      this.state = {
        dataSource: new ListView.DataSource({
          rowHasChanged: (row1, row2) => row1 !== row2,
        })
      }
  }

  componentWillMount() {
        fetch(MYCLASS.DEMAND_LIST_URL, {
                method: 'POST',
                headers: {
                  'Accept': 'application/json',
                  'Content-Type': 'application/json',
                },                    
                body: JSON.stringify({
                  userId:'17'})
            })
            .then((response) => response.json())
            .then((responseData) => {
              if (responseData.status == '1') {
                var data =  responseData.data
                this.setState({                  
                  dataSource: this.state.dataSource.cloneWithRows(data),
                });
              }
            })
            .done();
      }


  onPress = () => {
    this.props.navigate("ViewB");
  };

  render() {
    return (
      <View>
        <Text>test</Text>
        <Button title="Next" onPress={this.onPress} />
      </View>
    );
  }
}

如何在后退动作中重新加载Rout屏幕

类别屏幕A

import React from "react";
import { Button, Text, View } from "react-native";

class ScreenA extends Component {
  constructor(props){
    super(props)
      this.state = {
        dataSource: new ListView.DataSource({
          rowHasChanged: (row1, row2) => row1 !== row2,
        })
      }
  }

  componentWillMount() {
        fetch(MYCLASS.DEMAND_LIST_URL, {
                method: 'POST',
                headers: {
                  'Accept': 'application/json',
                  'Content-Type': 'application/json',
                },                    
                body: JSON.stringify({
                  userId:'17'})
            })
            .then((response) => response.json())
            .then((responseData) => {
              if (responseData.status == '1') {
                var data =  responseData.data
                this.setState({                  
                  dataSource: this.state.dataSource.cloneWithRows(data),
                });
              }
            })
            .done();
      }


  onPress = () => {
    this.props.navigate("ViewB");
  };

  render() {
    return (
      <View>
        <Text>test</Text>
        <Button title="Next" onPress={this.onPress} />
      </View>
    );
  }
}

从“React”导入React；
从“react native”导入{按钮、文本、视图}；
类ScreenA扩展组件{
建造师（道具）{
超级（道具）
此.state={
数据源：新建ListView.dataSource({
行已更改：（行1，行2）=>行1！==行2，
})
}
}
组件willmount（）{
获取（MYCLASS.DEMAND\u列表\u URL{
方法：“POST”，
标题：{
“接受”：“应用程序/json”，
“内容类型”：“应用程序/json”，
},                    
正文：JSON.stringify({
用户ID:'17'}）
})
.then（（response）=>response.json（））
.然后（（响应数据）=>{
如果（responseData.status==“1”）{
var数据=响应数据
这个.setState（{
dataSource:this.state.dataSource.cloneWithRows（数据），
});
}
})
.完成（）；
}
onPress=（）=>{
此.props.navigate（“视图B”）；
};
render（）{
返回(
测试
);
}
}

类屏幕b

从“React”导入React 从“react native”导入{Button}

---

类ScreenB扩展组件{
render（）{
const{goBack}=this.props.navigation；
报税表（
)
}
}    

Class ScreenA

import React from "react";
import { Button, Text, View } from "react-native";

class ScreenA extends Component {
  constructor(props){
    super(props)
      this.state = {
        dataSource: new ListView.DataSource({
          rowHasChanged: (row1, row2) => row1 !== row2,
        })
      }
  }

  componentWillMount() {
    this.getData()
  }

  getData() {
        fetch(MYCLASS.DEMAND_LIST_URL, {
                method: 'POST',
                headers: {
                  'Accept': 'application/json',
                  'Content-Type': 'application/json',
                },                    
                body: JSON.stringify({
                  userId:'17'})
            })
            .then((response) => response.json())
            .then((responseData) => {
              if (responseData.status == '1') {
                var data =  responseData.data
                this.setState({                  
                  dataSource: this.state.dataSource.cloneWithRows(data),
                });
              }
            })
            .done();
      }


  onPress = () => {
    this.props.navigate("ViewB", { onSelect: this.onSelect, getData: () => this.getData() });
  };

  render() {
    return (
      <View>
        <Text>test</Text>
        <Button title="Next" onPress={this.onPress} />
      </View>
    );
  }
}

从“React”导入React；
从“react native”导入{按钮、文本、视图}；
类ScreenA扩展组件{
建造师（道具）{
超级（道具）
此.state={
数据源：新建ListView.dataSource({
行已更改：（行1，行2）=>行1！==行2，
})
}
}
组件willmount（）{
这个文件名为getData（）
}
getData（）{
获取（MYCLASS.DEMAND\u列表\u URL{
方法：“POST”，
标题：{
“接受”：“应用程序/json”，
“内容类型”：“应用程序/json”，
},                    
正文：JSON.stringify({
用户ID:'17'}）
})
.then（（response）=>response.json（））
.然后（（响应数据）=>{
如果（responseData.status==“1”）{
var数据=响应数据
这个.setState（{
dataSource:this.state.dataSource.cloneWithRows（数据），
});
}
})
.完成（）；
}
onPress=（）=>{
this.props.navigate（“ViewB”，{onSelect:this.onSelect，getData:（）=>this.getData（）}）；
};
render（）{
返回(
测试
);
}
}

B类

class ScreenB extends Component {
   componentWillUnmount() {
     this.props.navigation.state.params.getData()
   }

   render() {
    const {goBack} = this.props.navigation;

    return( 
          <Button title="back" onPress={goBack()} /> 
         )
   }
}

类ScreenB扩展组件{
组件将卸载（）{
this.props.navigation.state.params.getData（）
}
render（）{
const{goBack}=this.props.navigation；
报税表（
)
}
}

作为使用堆栈的react导航。当我们导航到另一个屏幕时，当前屏幕保持不变，另一个屏幕显示在当前屏幕上。这意味着我们仍然有能力。仅当组件再次创建时，组件才会重新加载（回收），但此时组件不会更改。我们可以重新加载数据并重新渲染数据

默认情况下，react导航不为onBack事件提供任何api。但是我们可以通过一些技巧来实现我们的目标

方式1 使用一个函数来处理onBack事件并将其传递到导航屏幕

class ScreenA extends Component {
  onBack() {
    // Back from another screen
  }

  render() {
    const { navigation } = this.props
    return (
      <Button title="Open ScreenB" onPress={() => navigation.navigate('ScreenB', { onBack: this.onBack.bind(this) })} />
    )
  }
}

// In this ScreenB example we are calling `navigation.goBack` in a function and than calling our onBack event
// This is not a safest as if any device event emmit like on android back button, this event will not execute
class ScreenB extends Component {
  goBack() {
    const { navigation } = this.props
    navigation.goBack()
    navigation.state.params.onBack();  // Call onBack function of ScreenA
  }

  render() {
    return (
      <Button title="Go back" onPress={this.goBack.bind(this)} />
    )
  }
}

// In this ScreenB example we are calling our onBack event in unmount event.
// Unmount event will call always when ScreenB will destroy
class ScreenB extends Component {

  componentWillUnmount() {
    const { navigation } = this.props
    navigation.state.params.onBack();
  }

  render() {
    return (
      <Button title="Go back" onPress={() => this.props.navigation.goBack()} />
    )
  }
}

类ScreenA扩展组件{
onBack（）{
//从另一个屏幕返回
}
render（）{
const{navigation}=this.props
返回(
navigation.navigate（'ScreenB'，{onBack:this.onBack.bind（this）}）}/>
)
}
}
//在这个ScreenB示例中，我们在函数中调用'navigation.goBack'，而不是调用onBack事件
//这不是最安全的，因为如果任何设备事件像安卓上的“后退”按钮一样出现，则不会执行此事件
类ScreenB扩展了组件{
戈巴克（）{
const{navigation}=this.props
navigation.goBack（）
navigation.state.params.onBack（）；//调用ScreenA的onBack函数
}
render（）{
返回(
)
}
}
//在这个ScreenB示例中，我们在unmount事件中调用onBack事件。
//当ScreenB将销毁时，卸载事件将始终调用
类ScreenB扩展了组件{
组件将卸载（）{
const{navigation}=this.props
navigation.state.params.onBack（）；
}
render（）{
返回(
this.props.navigation.goBack（）}/>
)
}
}

方式2

---

尝试响应导航侦听器

我们在这方面有一些限制。我们有模糊和焦点事件。你可以把你的逻辑放在焦点上。每当您从另一个屏幕返回时，ScreenA将聚焦，我们可以执行我们的逻辑。但有一个问题，每当我们第一次获得焦点或最小化并重新打开应用程序时，都会执行此操作

方式3

---

我不确定这样做，我没有试过

你的导航库是什么？react NavigationNonpress={（）=>{this.props.navigate（“ViewB”，{getData:（）=>this.getData（）}；}}}}请加入这个房间：我有问题返回按钮单击重新加载屏幕在聊天中给我新的ans