Компонент не обновляет право

Question

В моем приложении у меня в шапке вид 35x35, который окрашен в цвет статуса человека, который вошел в систему; который работает как шарм, кроме небольшого сбоя обновления

Поведение на данный момент:

Я нажимаю на вид (чтобы перейти к экрану SelectACDState) // отлично работает

Я выбираю свое новое состояние, нажимая его, и оно перемещает меня назад // отлично работает

Я вернулся к экрану, где я первоначально щелкнул статус-представление

Переменная изменяется прямо в globals.js, но в представлении все еще отображается старый цвет состояния (но если я перехожу на другой экран в tabNavigator, представление меняется на правильный цвет)

App.js:

{all imports}

export default createStackNavigator({

{...}

  Home: {
    navigationOptions: ({ navigation }) => ({
      title: null,
      headerRight: (
        <TouchableOpacity
          style={[
            styles.ACDstateButton,
            (style = { backgroundColor: global.BColor })
          ]}
          onPress={() => {
            navigation.navigate("SelectACDState");
          }}
        />
      )
    }),

{...}

  SelectACDState: {
    screen: SelectACDState,
    navigationOptions: { header: null }
  }
});

SelectACDState.js:

{all imports}


export default class SelectACDState extends Component {
  showACDState = (itemValue, Bcolor) => {
    this.setState({});
    global.BColor = Bcolor;
    global.ACDState = itemValue;
    this.setState({});
  };

  setACDState = (itemValue, itemIndex) => {
    AsyncStorage.setItem("ACDState", itemValue);
    this.setState({});
    global.ACDState = itemValue;
    this.showACDState(itemValue);
  };

  onPress = () => {
    this.props.onPressItem(this.props.id);
  };
  render() {
    const { goBack } = this.props.navigation;

    return (
      <View style={styles.padding2}>
        <FlatList
          data={[
            { key: `${MLT.t("Abgemeldet")}`, Bcolor: "#FFFFFF" },
            { key: `${MLT.t("Anwesend")}`, Bcolor: "#FFFFAE" },
            { key: `${MLT.t("ACD")}`, Bcolor: "#7BEC36" },
            { key: `${MLT.t("Nachb")}`, Bcolor: "#c8f4b5" },
            { key: `${MLT.t("Pause")}`, Bcolor: "#FAA46B" }
          ]}
          renderItem={({ item }) => (
            <View
              style={{
                backgroundColor: item.Bcolor,
                borderWidth: 1,
                height: 50,
                borderColor: "black"
              }}
            >
              <TouchableOpacity
                onPress={() => {
                  this.showACDState(item.key, item.Bcolor);
                  goBack();
                }}
              >
                <Text
                  style={[
                    styles.rowText,
                    (style = { fontSize: 30, alignSelf: "center" })
                  ]}
                >
                  {item.key}
                </Text>
              </TouchableOpacity>
            </View>
          )}
        />
      </View>
    );
  }
}