Невозможно получить ActivityIndicator для отображения с mobX в React Native - PullRequest
Новая
       8

Невозможно получить ActivityIndicator для отображения с mobX в React Native

0 голосов
/ 30 октября 2018

Я пытался заставить ActivityIndicator отображаться при выполнении http-запроса (Axios), я использую mobX для создания http-запроса. Я пробовал многочисленные варианты без успеха. Мой код выглядит следующим образом:

ProductScreen.js 

import React, { Component } from "react";
import { AsyncStorage, TouchableOpacity, TouchableHighlight, StyleSheet, Text, View, Button, AppRegistry, Image, TextInput } from 'react-native';
import { observable } from "mobx";
import { observer, injexct } from "mobx-react";
import Loading from '../components/Loading'

@inject("productStore")
class ProductScreen extends Component {   constructor(props: Object) {
    super(props);   }

  render() {
    return (
      <View>
        <TouchableOpacity style={
          [{
            paddingTop: 10,
            paddingBottom: 10,
            borderRadius: 5,
            marginBottom: 20,
            width: '70%',
            backgroundColor: '#009688'
          }]
        } activeOpacity={.5}
          onPress={this.props.productStore.getProductDetails}
        >
          <Text>Get Product Details</Text>
        </TouchableOpacity>
        {this.props.productStore.isFetching == true? <Loading />: null }
      </View>
    );   } } export default ParkScreen

Loading.js 

import React, { Component } from 'react'
import {
  StyleSheet,
  View,
  Text,
  ActivityIndicator
} from 'react-native'

export default class Loading extends Component {
  render() {
    return (
      <View>
          <ActivityIndicator color="white" />
          <Text>Loading...</Text>
      </View>
    )
  }
}

ProductStore.js 

import { observable, action, runInAction } from "mobx";
import axios from 'axios';

export default class ProductStore {

  @observable isFetching = false;

  @action getProductDetails = () => {
    this.isFetching = true;
    console.log(location_number);
    axios.get('http://192.168.1.9/v1/details/')
      .then(response => {
        console.log(response.data);
        this.isFetching = false;
      }).catch(error => {
        console.log(error);
        this.error = error
        this.isFetching = false
      });
  }

}

Спасибо за вашу помощь заранее.

...