React Native 使用Redux出现错误:Element type is invalid,求救!!



  • 完整的错误如下:

    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 `MyAwesomeApp`.
    

    index.android.js

    var React = require('react-native');
    var ReactJChat = require('./containers/ReactJChat');
    var MyAwesomeApp = React.createClass({
      
        render() {
          return (
            <ReactJChat />
          );
        }
    });
    React.AppRegistry.registerComponent('JChatApp', () => MyAwesomeApp);
    
    

    ReactJChat.js

    import React from 'react-native';
    var {
    	Component,
    } = React;
    import { Provider } from 'react-redux';
    import { createStore, applyMiddleware, combineReducers } from 'redux';
    import thunk from 'redux-thunk';
    import rootReducer from '../reducers/index';
    import BaseApp from './BaseApp';
    
    const createStoreWithThunk = applyMiddleware(thunk)(createStore);
    const store = createStoreWithThunk(rootReducer);
    
    export default class ReactJChat extends Component {
    	render() {
    		return (
    			//通过Provider把store传给了真正的app入口,即BaseApp
    			<Provider store = { store }>
    				<BaseApp />
    			</Provider>
    		);
    	}
     }
    

    BaseApp.js

    import { bindActionCreators } from 'redux';
    import { connect } from 'react-redux';
    import * as actions from '../actions';
    
    class BaseApp extends Component {
    
    	constructor(props) {
    		super(props);
    		this.initialRoute = {
    			name: 'mainActivity',
    			component: MainActivity,
    		}
    	}
    
        renderScene(route, navigator) {
    		let Component = route.component;
    		return ( 
    			<Component 
    				{ ...route.params }
    				navigator = { navigator }
    			/>
    		);
    	}
    
        render() {
    		return (
    			<View>
    			<Navigator
    				initialRoute = { {name: 'mainActivity'} }
    				configureScene = { this.configureScene }
    				renderScene = { this.renderScene }
    			/>
    			</View>
    		);
    	}
    }
    
    function mapStateToProps(state) {
    	return {
    		state: state
    	}
    }
    
    function mapDispatchToProps(dispatch) {
    	return bindActionCreators(actions, dispatch);
    }
    
    export default connect(mapStateToProps, mapDispatchToProps) (BaseApp);
    
    

    我没用Redux架构之前App是可以跑起来的,Redux相关项目也应该正确导入了,但是现在怎么也找不到解决办法。求指点迷津!



  • export必须和import搭配 不能用require引入



  • ...的解构不对,意思就是es6的写法有问题,问题出在组件的属性的...的解构上



  • @EvanJin 你的意思是这个{ ...route.params } 这个写法不对? 不会啊,我之前也是这样写的,没问题。



  • @KenChoi 说:

    var ReactJChat = require('./containers/ReactJChat');

    这里改import



  • @sunnylqm 改了,好像真是这个问题,真是操蛋。。。谢谢谢哈