Update react-native component inside TabNavigator

234 views Asked by At

Using react-native and react-navigation I need control a conditional render every time that user enter in a especific tab. When use enter the first time react-native-camera is enable, after onBarCodeRead I set the showCamera flag to false calling redux action and redirect user to another screem. Now I need set this flag to true when user enter in this tab again, but my component inside a TabNavigator never is rebuild.

render() {
    if(!this.props.showCamera){
      return null;
    }else{
      return (
        <View style={styles.container}>
          <Camera
            ref={(cam) => {
              this.camera = cam;
            }}
            style={styles.preview}
            aspect={Camera.constants.Aspect.fill}
            onBarCodeRead={this.onBarCodeRead.bind(this)}
            barCodeTypes={[
              Camera.constants.BarCodeType.qr
            ]}>
            <Image style={styles.borderImage} source={require("../../img/qrBorder.png")} />
          </Camera>
        </View>
      );
    }
  }

  onBarCodeRead(event) {
    this.props.setShowCamera(false);
    const { navigate } = this.props.navigation;
    navigate('ContactAddDetail', { selectedId: event.data });
  }
0

There are 0 answers