React Native - 渲染中没有返回任何内容

问题描述 投票:3回答:2

我的应用程序存储在/src/index.js中,但我也有/App.js和/index.js。

我不知道这些之间的区别,我认为这是我得到这个错误的原因。

enter image description here

/index.就是

import { AppRegistry } from 'react-native';
import App from './App';
AppRegistry.registerComponent('client', () => App);

/app.就是

import App from './src/index';

export default App;

/双人床/index.就是

import React from 'react';
import { AppRegistry } from 'react-native';
import { Provider, connect } from 'react-redux';
import { addNavigationHelpers } from 'react-navigation';

import Navigator from './routes/route';
import store from './store/configureStore';


const App = ({ dispatch, nav }) => {

    <Navigator
        navigation={addNavigationHelpers({
            dispatch,
            state: nav,
        })}
    />
};

const mapStateToProps = state => ({
    nav: state.nav,
});



const AppWithNavigation = connect(mapStateToProps)(App);

export default () => {

    <Provider store={store}>
        <AppWithNavigation />
    </Provider>

}

我使用create react native package来构建这个项目,然后尝试按照一些指南来实现与redux的反应导航。

react-native react-redux react-navigation
2个回答
7
投票

您的默认导出不返回任何内容:

export default () => {

    <Provider store={store}>
        <AppWithNavigation />
    </Provider>

}

要使用箭头函数返回JSX,您需要使用() => ( <JSX /> )或等效的花括号:() => { return ( <JSX /> ) }

export default () => (    
    <Provider store={store}>
        <AppWithNavigation />
    </Provider>
)

要么 :

export default () => {
    return (    
       <Provider store={store}>
           <AppWithNavigation />
       </Provider>
   )
}

2
投票

你忘了return components

const App = ({ dispatch, nav }) => {
    return(
        <Navigator
            navigation={addNavigationHelpers({
                dispatch,
                state: nav,
            })}
        />
    )
};


export default () => {
    return(
        <Provider store={store}>
            <AppWithNavigation />
        </Provider>
    )
}
© www.soinside.com 2019 - 2024. All rights reserved.