Пользовательский интерфейс заблокирован после отображения выпадающего оповещения - PullRequest
0 голосов
/ 11 октября 2019

Я пытаюсь отобразить сообщение об ошибке через выпадающее предупреждение, которое я подключил к избыточному. У меня есть это в основном файле App.js, и компонент слушает изменение состояния ошибки и пропадет через анимацию, чтобы показать сообщение об ошибке. Проблема заключается в том, что после отображения сообщения об ошибке и возврата в исходное состояние я не могу нажать кнопку «Назад».

Я пытался переместить компонент после и до SwitchNavigator.

// Drop down component

const DropDownAlert = props => {
  const containerHeight = 120;
  const ytranslate = new Animated.Value(-containerHeight);
  useEffect(() => {
    Animated.sequence([
      Animated.spring(ytranslate, {
        toValue: 0, //Animate to YPosition: 20
        useNativeDriver: true,
        easing: Easing.linear,
        friction: 100,
        tension: 0
      }),
      Animated.spring(ytranslate, {
        delay: 3000, //waits 3s
        toValue: -(containerHeight + 25), //Animate to YPosition: 20
        useNativeDriver: true,
        easing: Easing.linear,
        friction: 100,
        tension: 0
      })
    ]).start(() => {props.removeAlertMessage});
  });

  if(!props.alertMessage.isMessage){
    return null
  }

  return (
    <View style={styles.container}>
      <Animated.View
        style={{
          ...props.style,
          transform: [{ translateY: ytranslate }],
          opacity: 0.8,
          borderWidth: StyleSheet.hairlineWidth,
          borderColor: theme.SECONDARY_COLOR
        }}
      >
        <View style={styles.content}>
          <View style={styles.iconContainer}>
            <MaterialCommunityIcons
              name="alert-circle-outline"
              size={32}
              color={theme.TERTIARY_COLOR}
            />
          </View>
          <Text style={styles.text}>{props.alertMessage.message}</Text>
        </View>
      </Animated.View>
    </View>
  );
};

// app.js return statement

return (
    <Provider store={store}>
      <AlertMessage/>
      <SwitchNavigator uriPrefix={prefix} />
    </Provider>
  );

Таким образом, я хотел бы иметь возможность отображать сообщение об ошибке в раскрывающемся оповещении, и как только оно вернется, я смогу нажать кнопку "Назад".

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...