React Native - 如何从孙子组件设置 ActivityIndi​​catorIOS 的属性 [英] React Native - How to set properties on ActivityIndicatorIOS from grand-child component

查看:11
本文介绍了React Native - 如何从孙子组件设置 ActivityIndi​​catorIOS 的属性的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想在我的 React Native 应用程序 (index.ios.js) 的顶层使用全局"ActivityIndi​​catorIOS,这样我就可以在需要打开和关闭它时在整个应用程序中控制它.

I would like to use a "global" ActivityIndicatorIOS in the top-level of my React Native app (index.ios.js) so I can control it through out the app when I need to turn it on and off.

应用结构:

index.ios.js    <- ActivityIndicatorIOS here
 |
tabbar.ios.js
 |
tab1.js     <- Need to reference it from here
tab2.js                    "
tab3.js                    "

我真的很想知道执行此操作的最佳方法,而不是在应用程序中的每个视图上重用组件,而是让它位于顶级"NavigatorIOS 上并能够打开和关闭它.

I'd really like to know the best way to do this, rather than reusing the component on each view in the app, have it sit over the "top level" NavigatorIOS and be able to turn it on and off.

推荐答案

您可以使用全局"模式屏幕与此处的示例非常相似:https://rnplay.org/apps/V6vU6g

You can do it very similar to the example here with a "global" modal screen: https://rnplay.org/apps/V6vU6g

这篇文章解释了如何做到这一点:http://browniefed.com/blog/2015/10/18/react-native-easy-overlay-modal-with-navigator/

This article explains how this can be done: http://browniefed.com/blog/2015/10/18/react-native-easy-overlay-modal-with-navigator/

基本上,在您的情况下,您将在所述模式中拥有一个 ActivityIndi​​catorIOS,并且您会将一个函数传递给您的选项卡组件,该函数在您的 index.ios.js 中设置状态是否可见.您可以稍后在链中的任何地方执行此功能.当此状态发生变化时,您的 ActivityIndi​​cator 可以设置为在导航器上呈现(如果您选择).

Basically, in your case, you would have an ActivityIndicatorIOS in said modal, and you would pass down to your tab components a function that sets the state in your index.ios.js on whether it's visible or not. You can execute this function wherever you want later on down the chain. When this state changes, your ActivityIndicator can be set to render over the Navigator (if you choose).

这篇关于React Native - 如何从孙子组件设置 ActivityIndi​​catorIOS 的属性的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆