可以冻结应用程序直到(异步)事件发生吗？

Question

在推到下一个屏幕之前，我想在我的应用程序中显示一个AdMobInterstitial-Ad。

目前，我正在使用以下方法：

1. 显示Ad (加载需要1-2秒)
2. 推到下一个屏幕

。

onpress={ () =>{
    (title.slice(0, 4) === "X-01"
              ? navigation.push(...)
              : navigation.push(...));
    showAsyncAD();
}
}

广告以异步方式加载，因此应用程序推送到下一个屏幕，然后显示广告。我希望它首先加载广告，然后推送到下一个屏幕。

我试过这个：

onpress={() =>
showAsyncAD().then(
() => title.slice(0, 4) === "X-01"
              ? navigation.push(...)
              : navigation.push(...)
                   );
}
}

这确实有效的，但，直到广告出现，用户可以按按钮，他是不允许的。实际上，他可以再次按下按钮，在广告开始播放之前到达屏幕。

我怎么能冻结应用程序，直到广告出现，这样用户就不会做任何他不允许做的事情？

如果一个加载循环是可能的，这将是最好的选择！

谢谢您的意见！

编辑:我想让成为整个应用程序，冻结，直到广告显示出来

Answer 1

您可以使用状态值来显示异步操作处理。

const [processing, setProcessing] = useState(false);

setProcessing(true)
showAsyncAD().then(
  () => {
    setProcessing(false)
    title.slice(0, 4) === "X-01"
                ? navigation.push(...)
                : navigation.push(...)
  })

并禁用执行异步操作时不希望被单击的按钮。例如；

<TouchableOpacity disabled={processing}>
</TouchableOpacity>

更新

如果要禁用整个屏幕，可以在屏幕上显示透明的覆盖View。它将具有屏幕的全部宽度和高度。

return (
  <View style={{
    position: 'relative',
    ...
  }}>
    // your views here
    {processing && <View style={{
      position: 'absolute',
      width: '100%',
      height: '100%',
      backgroundColor: 'transparent'
    }} />}
  </View>
)