应用程序关闭后隐藏/取消react-native Android Toast的正确方法是什么

Question

我使用react-router库和历史道具来浏览我的react-native应用程序。如果用户不在起始页上，则单击 Android 设备上的后按会将其导航到起始页。如果用户已经位于 StartPage 上，则后按会导致一个 toast（来自“react-native”的 AndroidToast），并显示一条消息“再次单击以关闭”。两次点击 backpress 之间的时间是通过一个简单的时间戳来计算的。

    if(this.props.history.location.pathname !== "/start") {
      this.props.history.push("/start")
    }

    else {

      if ((moment().diff(this.state.backPressTimeStamp)) <= 1500) {
        // this.setState({
        //   visible: false
        // })
        BackHandler.exitApp()
      }

      else {
        this.setState({
          backPressTimeStamp: moment(),
          visible: true,
        }, () => {
          this.hideToast();
        })
      }
    }
    return true
  }

toast 由渲染方法内部调用的函数返回（ios = 无后压）

  loadToast = () => {
    if (Platform.OS === 'android') {
      return (
          this.state.visible && <View>
            <Toast
              visible={this.state.visible}
              duration={ToastAndroid.SHORT}
              gravity={ToastAndroid.BOTTOM}
              x_offset={0}
              y_offset={125}
              message={"click again to close"}
            />
          </View>
      )
    }
    else {
      return null
    }
  }

[....]

render() {
 return(
  ...
  {this.loadToast()}
  ...
 )
}

一切都按预期工作，但我似乎无法弄清楚如何在应用程序关闭后隐藏/关闭Toast。无论可见值是否设置为 false / hideToast 函数是否被调用，它都会在持续时间内保持可见。

任何关于如何在应用程序关闭后强制 Toast 隐藏/关闭的想法将受到高度赞赏！

戴夫

Answer 1

我知道这有点晚了，也许你已经明白了，但你是否尝试过直接使用 SimpleToast.show 而不是组件？

import SimpleToast from 'react-native-simple-toast';
SimpleToast.show(message, SimpleToast.SHORT);

并且您必须在 iOS 上将其显式设置为 SimpleToast.SHORT/LONG，以便它自动隐藏。