我如何显示带有背景的 ActivityIndicator 弹出窗口

马诺杰·巴德瓦杰

Api Handler和hitapi是我的方法我想在调用hitapi方法时显示加载所以请建议我如何为带有背景的ActivityIndi​​cator创建弹出窗口

class ApiHandler {


  hitapi(url,data,method) {

  }

}

const api = new ApiHandler();
export default api;

加载组件:

 <View style={styles.container}>

     <ActivityIndicator
      animating
      color="#fff"
     size="large"
     style={styles.activityIndicator}
   />

   </View>

// Stylesheet for ActivityIndicator
const styles = StyleSheet.create ({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    marginTop: 70
  },
  activityIndicator: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    height: 80
  }
})
萨加·乔汉

首先使用 property 初始化 state isLoading,例如:

state = {
  isLoading: false
}

然后在您的服务启动时将其状态更改为 true。

this.setState({isLoading: true})

并在收到位置服务器的响应后将其设置为 false,无论响应成功还是失败。

this.setState({isLoading: false})

现在用你的内部渲染方法替换这段代码:

<View style={styles.container}>
  {this.state.isLoading ? (
    <ActivityIndicator
      animating
      color="#fff"
      size="large"
      style={styles.activityIndicator}
    />
  ) : null}
</View>

如果this.state.isLoading为真,将显示活动指示器。

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章