Проблемы, возникающие при конвертации React-Native из приложения на основе Expo с получением инвариантных нарушений - PullRequest
Новая
       65

Проблемы, возникающие при конвертации React-Native из приложения на основе Expo с получением инвариантных нарушений

0 голосов
/ 27 февраля 2020

Я застрял на приведенной ниже ошибке, код изначально был написан с помощью Expo, и я скопировал его и разобрал много ошибок, хотя эта ошибка немного озадачена, и я не могу найти решение этой проблемы, когда я поиск.

Любая помощь будет признательна ... новость здесь, поэтому не может публиковать снимки экрана, ссылка ниже покажет ошибку.

Скриншот ошибки на Android Эмулятор

Я получаю следующую ошибку: 

Invariant Violation: Element type is invalid: expected a
string (for built-in components) or a class/function (for
composite components) but got: object.

Check the render method of `_default`.

This error is located at:
  in Provider (at App.js:48)
  in Provider (at App.js:47)
  in Provider (at App.js:46)
  in _default (at renderApplication.js:40)
  in RCTView (at AppContainer.js:101)
  in RCTView (at AppContainer.js:119)
  in AppContainer (at renderApplication.js:39)

Я поместил код из моего приложения. js, TrakkContext. js и CreateDataContext. js ниже, поскольку они, кажется, являются источником ошибки.

** ПРИЛОЖЕНИЕ. js Код **

import React from 'react';
import { createAppContainer, createSwitchNavigator } from 'react-navigation';
import { createStackNavigator } from 'react-navigation-stack';
import { createBottomTabNavigator } from 'react-navigation-tabs';
import AccountScreen from './src/screens/AccountScreen';
import SigninScreen from './src/screens/SigninScreen';
import SignupScreen from './src/screens/SignupScreen';
import TrakkCreateScreen from './src/screens/TrakkCreateScreen';
import TrakkDetailScreen from './src/screens/TrakkDetailScreen';
import TrakkListScreen from './src/screens/TrakkListScreen';
import { Provider as AuthProvider } from './src/context/AuthContext';
import { setNavigator } from './src/navigationRef';
import ResolveAuthScreen from './src/screens/ResolveAuthScreen';
import { Provider as LocationProvider } from './src/context/LocationContext';
import { Provider as TrakkProvider } from './src/context/TrakkContext';
import { FontAwesome } from 'react-native-fontawesome';

const trakkListFlow = createStackNavigator({
  TrakkList: TrakkListScreen,
  TrakkDetail: TrakkDetailScreen
});

trakkListFlow.navigationOptions = {
  title: 'My Trakks',
  tabBarIcon: <FontAwesome name="th-list" size={20} />
};

const switchNavigator = createSwitchNavigator({
  ResolveAuth: ResolveAuthScreen,
  loginFlow: createStackNavigator({
    Signup: SignupScreen,
    Signin: SigninScreen
  }),
  mainFlow: createBottomTabNavigator({
    trakkListFlow,
    TrakkCreate: TrakkCreateScreen,
    Account: AccountScreen
  })
});

const App = createAppContainer(switchNavigator);

export default (App) => {
  // export default class YourApp extends Component<{}> {
  return (
    <TrakkProvider>
      <LocationProvider>
        <AuthProvider>
          <App
            ref={navigator => {
              setNavigator(navigator);
            }}
          />
        </AuthProvider>
      </LocationProvider>
    </TrakkProvider>
  );
};

** TrakkContext. js Код **

import createDataContext from './createDataContext';
import trakksAPI from '../api/trakks';

const trakkReducer = (state, action) => {
    switch (action.type) {
        case 'fetch_trakks':
            return action.payload;
        default:
            return state;
    }
};

const fetchTrakks = dispatch => async () => {
    response = await trakksAPI.get('/trakks');
    dispatch({ type: 'fetch_trakks', payload: response.data });
};
const createTrakks = dispatch => async (name, locations) => {
    const str_locations = JSON.stringify(locations);
    const response = await trakksAPI.post('/trakks', { name, str_locations });
};

export const { Provider, Context } = createDataContext(
    trakkReducer,
    { fetchTrakks, createTrakks },
    []
);

** CreateDataContext. js Код **

import React, { useReducer } from 'react';

export default (reducer, actions, defaultValue) => {
    const Context = React.createContext();
    const Provider = ({ children }) => {
        const [state, dispatch] = useReducer(reducer, defaultValue);
        const boundActions = {};
        for (let key in actions) {
            boundActions[key] = actions[key](dispatch);
        }
        return (
            <Context.Provider value={{ state, ...boundActions }}>
                {children}
            </Context.Provider>
        );
    };
    return { Context, Provider };
};
...