navigationOptions 中的 React-Navigation 条件

Question

如果我有未读消息，我将如何使用 if 语句返回不同的图标？ 或者我不会使用 if 语句？也许在某事上设置状态？不知道这里的最佳路线是什么。

static navigationOptions = {
tabBarIcon: ({ focused }) => (
  focused 
  ? <Icon name="ios-mail" 
    style={styles.activeIconRight} 
    />
  : <Icon name="ios-mail"
    style={styles.inActiveIconRight}
    />
),

}

updateUnread = () => {
    if (this.state.unread == true) {
      this.props.navigation.setParams({otherParam: 'NEW'})
    } else {
      this.props.navigation.setParams({otherParam: ' '})
    }
  }

Answer 1

假设你有一个图标来表明它是未读的（这里称为ios-mail-new），那么。

static navigationOptions = ({navigation}) => {
    const { params } = navigation.state;
    tabBarIcon: ({ focused }) => (
      if(params.otherParams === 'NEW') {
        <Icon name="ios-mail-new" 
         style={[styles.activeIconRight, focused && styles.inActiveIconRight]} 
        />
      }
      else {
        <Icon name="ios-mail" 
         style={[styles.activeIconRight, focused && styles.inActiveIconRight]}
        />
      }
),

这里的关键是获取navigation 作为传入的参数。