成功返回数据后无法触发React Native Modalbox

Question

我仍然对React Native还是陌生的，我试图在成功返回数据后让react-native-modalbox弹出。我正在使用mobX（状态管理）和axios（用于http请求）。当前，数据已成功返回（在console.log中可见）。一旦返回数据失败，我尝试了多种方法来触发模态。我已经在下面包含了基本代码。感谢您提供任何帮助。

谢谢

ShopScreen.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, inject } from "mobx-react";
    import Modal from 'react-native-modalbox';


    @inject("shopStore")
    class ShopScreen extends Component {
      constructor(props: Object) {
        super(props);
        this.state = {
          Validate: true,
          buttonInvalid: true
        };
      }


      render() {
        console.log("Render shop");
        return (
          <View>

            <TouchableOpacity style={
              [{
                paddingTop: 10,
                paddingBottom: 10,
                borderRadius: 5,
                marginBottom: 20,
                width: '70%',
                backgroundColor: '#009688'
              }]
            } activeOpacity={.5}
              onPress={this.props.shopStore.getProducts}
            >
              <Text>Get Products</Text>
            </TouchableOpacity>

            <ShowModal />
          </View>
        );
      }
    }
    export default ShopScreen

    @inject("shopStore")
    @observer
    class ShowModal extends Component {
      render() {
        return (
          <Modal style={[styles.modal, styles.modal3]} position={"center"} ref={"modal3"}>
            <Text style={styles.text}>Modal centered</Text>     
          </Modal>
        )
      }
    }

ShopStore.js

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

export default class ShopStore {

  @observable error = [];
  @observable isLoading = false;
  @observable isModalVisible = false;

  @action getProducts = () => {
    this.isLoading = true;
    axios.get('http://192.168.1.9/v1/Products/')
      .then(response => {
        console.log(response.data);
        this.products = response.data;
        this.isLoading = false;
        this.isModalVisible = true;
      }).catch(error => {
        console.log(error);
        this.error = error
        this.isLoading = false
      });
  }

}