Ошибка Expo только на телефоне: нарушение инварианта: текстовые строки должны отображаться в компоненте <Text> - PullRequest
Новая
       7

Ошибка Expo только на телефоне: нарушение инварианта: текстовые строки должны отображаться в компоненте <Text>

0 голосов
/ 28 мая 2020

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

enter image description here

вот мое приложение. js файл: 

import React from 'react';
import { createAppContainer } from 'react-navigation';
import { createStackNavigator } from 'react-navigation-stack';
import IndexScreen from "./src/screens/IndexScreen";
import {BlogProvider} from "./src/context/BlogContext";

const navigator = createStackNavigator({
  Index: IndexScreen
}, {
  initialRouteName: 'Index',
  defaultNavigationOptions: {
    title: 'Blog List'
  }
});
const App = createAppContainer(navigator);

export default () => {
  return <BlogProvider><App/></BlogProvider>;
}

и blogContext. js файл: 

import React, {useReducer} from 'react';

const BlogContext = React.createContext();
const reducer = (state, action) => {
    switch (action.type) {
        case 'add':
            return [...state, `Blog post #${state.length + 1}`]
        default:
            return state;
    }

}
export const BlogProvider = ({children}) => {
    const [state, dispatch] = useReducer(reducer,[]);
    const addBlogPost = () => {
       dispatch({type: 'add'})
    }
    return <BlogContext.Provider value={{data: state, addBlogPosts: addBlogPost}}> {children} </BlogContext.Provider>
}
export default BlogContext;

Я вижу эту ошибку только на mobile, при открытии приложения в браузере ошибок не выдает

1 Ответ

0 голосов
/ 28 мая 2020

проблема заключалась в том, что оператор return должен быть заключен в круглые скобки, например: 

 import React, {useReducer} from 'react';
const BlogContext = React.createContext();
const blogReducer = (state, action) => {
    switch (action.type) {
        case 'add':
            return [...state, `Blog post #${state.length + 1}`]
        default:
            return state;
    }

}
export const BlogProvider = ({children}) => {
    const [blogPosts, dispatch] = useReducer(blogReducer,[]);
    const addBlogPost = () => {
       dispatch({type: 'add'})
    };
    return (
        <BlogContext.Provider value={{data: blogPosts, addBlogPost}}>
            {children}
        </BlogContext.Provider>
    );
};
export default BlogContext;
...