在反应导航中更新导航参数

Question

我试图从两个不同的地方导航到同一个屏幕并传递不同的参数来显示其他内容。

导航代码

    // I am navigating to Worklogs screen from both places. 
    // In the first case only passing the current date as parameter
    // and in the second case one extra parameter showPending
    <View style={styles.row}>
          // first touchable. don't want to show pending worklogs if navigated using this
          <Touchable 
            style={styles.widgets}
            onPress={() => this.navigateToScreen('Worklogs', {date: this.getToday()})}
          >
            <View style={{ flex: 1}}>
              <View style={{ flex: 2, alignItems: 'center' }}>
                <Image 
                  source={require('../assets/images/todayworklog.png')}
                  style={{ resizeMode: 'contain', height: 50}}
                />
              </View>

              <View style={{ flex: 1 }}>
                <Text> Today Worklog </Text>
                <Text style={{ alignSelf: 'center', fontSize: 12, color: '#33b0df' }}>{worklogs.total_time} Hours</Text>
              </View>
            </View>
          </Touchable>

          // 2nd touchable. show pending worklogs if navigated from here
          <Touchable 
            style={styles.widgets}
            onPress={() => this.navigateToScreen('Worklogs', {date: this.getToday(), showPending: true})}  
          >
            <View style={{ flex: 1}}>
              <View style={{ flex: 2, alignItems: 'center' }}>
                <Image 
                  source={require('../assets/images/pendingworklog.png')}
                  style={{ resizeMode: 'contain', height: 50}}
                />
              </View>

              <View style={{ flex: 1 }}>
                <Text> Pending Worklog </Text>
              </View>
            </View>
          </Touchable>
        </View>

  // navigate to screen code
  navigateToScreen(screenName, parameters) {
    if(this.isEmpty(parameters)) {
      this.props.navigation.navigate(screenName);
    } else {
      this.props.navigation.navigate(screenName, parameters);
    }
  }

在Worklogs屏幕的render方法中，我正在检查showPending值以呈现其他组件。

    const { params } = this.props.navigation.state;

    { (params && params.showPending)
      ? <PendingWorklogList pendingWorklogs={this.state.pending_worklogs} />
      : <View />
    }

现在，如果我通过点击第一个<Touchable />导航到Worklogs屏幕，showPending不在参数中，并且<PendingWorklogList />组件未呈现。从第二个<Touchable />导航将showPending添加到参数，并呈现<PendingWorklogList />。

但是，如果我通过点击第一个<Touchable />返回并再次导航到Worklogs，showPending参数仍然存在，那么正在呈现<PendingWorklogList />。但是，只有当我从第二个<PendingWorklogList />导航时才能呈现<Touchable />。