首页 > 解决方案 > 如果数据存在,则更改反应本机标头的按钮

问题描述

我想检查数据是否存在,如果数据存在则显示红色按钮,如果没有数据则显示蓝色按钮。我试图这样做,但它不起作用。例如,如果有任何 DM, Instagram转到 DM 的按钮,按钮会随着 DM 的未读数量变为不同的颜色,如果没有 Dm,则它是简单的按钮。

static navigationOptions = ({ navigation }) => {
    const { params = {} } = navigation.state;
    const { notifications } = this.props.notification;

      return {
        headerRight: (
          <View>
            {
              (notifications.length > 0) ? (
                <TouchableOpacity onPress={() => params.handleSave()}>
                  <Badge>
                    <Text>{notifications.length}</Text>
                  </Badge>
                </TouchableOpacity>
              ) : (
                  <TouchableOpacity onPress={() => params.handleSave()}>
                    <Ionicons
                      name="ios-notifications-outline"
                      style={{ paddingRight: 15 }}
                      size={24}
                      color="white"
                    />
                  </TouchableOpacity>
                )
            }
          </View>
        )
      };
    }

标签: androidreact-nativereduxreact-redux

解决方案


创造两种不同的风格和条件

style={[navigation.state.yourstate ? styles.selectedButtonStyle : styles.normalButtonStyle]}

推荐阅读