javascript - 使用 Expo AppLoading 从 firebase 预加载数据

Question

在应用程序进入主页之前，我正在尝试使用 Expo 上的 AppLoading 从 firebase 预加载数据。我不断收到错误消息。

“错误：找不到 react-redux 上下文值；请确保组件包装在 <Provider> 中”

import React, { useState } from "react";
import { createStore, combineReducers, applyMiddleware } from "redux";
import { Provider } from "react-redux";
import ReduxThunk from "redux-thunk";
import productsReducer from "./store/productReducer";
import createdProducts from "./store/createdProductReducer";
import storeName from "./store/StoreNameReducer";
import authReducer from "./store/authReducer";
import { useDispatch } from "react-redux";
import * as ProdActions from "./store/productActions";
import AppLoading from "expo-app-loading";

import InventoryNavigator from "./navigation/InventoryNavigator";

const rootReducer = combineReducers({
  products: productsReducer,
  availableProducts: createdProducts,
  auth: authReducer,
  storeName: storeName,
});

const store = createStore(rootReducer, applyMiddleware(ReduxThunk));

export default function App() {
  const [fireBLoaded, setFireBLoaded] = useState(false);
  const dispatch = useDispatch();
  const fetchFirebase = () => {
    dispatch(ProdActions.fetchAvailableProducts());
    dispatch(ProdActions.fetchStoreName());
    dispatch(ProdActions.fetchProducts());
  };
  if (!fireBLoaded) {
    return (
      <AppLoading
        startAsync={fetchFirebase}
        onFinish={() => setFireBLoaded(true)}
        onError={console.warn}
      />
    );
  } else {
    return (
      <Provider store={store}>
        <InventoryNavigator />
      </Provider>
    );
  }
}

我尝试过的：

  const fetchFirebase = async () => {

任何帮助将不胜感激，我对 React Native 还是新手。

标签： javascriptfirebasereact-nativereduxexpo

Answer 1

你的fetchFirebase功能应该是async

像这样 -

const fetchFirebase = async () => {
  // Perform Aysnc operations here...
  dispatch(ProdActions.fetchAvailableProducts());
  dispatch(ProdActions.fetchStoreName());
  dispatch(ProdActions.fetchProducts());
};

我在这里没有看到任何其他错误除了这个