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作为传递的参数。

navigationOptions中的React-Navigation条件

1 个答案: