我需要你的帮助。
警告:React.createElement:type无效 - 期望一个字符串(对于内置组件)或一个类/函数(对于复合组件)但得到:undefined。您可能忘记从其定义的文件中导出组件。检查App
的渲染方法。
在App中(由Connect(App)创建)
在连接(应用程序)
在提供者
App.js
import React from 'react';
import { Router, Route } from 'react-router-dom';
import { connect } from 'react-redux';
import { history } from './_helpers/index';
import { alertActions } from './_actions/index';
import PrivateRoute from './_components/PrivateRoute.js';
import Map from './map/Map.js';
import LoginPage from './LoginPage/LoginPage.js';
import RegisterPage from './RegisterPage/RegisterPage.js';
class App extends React.Component {
constructor(props) {
super(props);
const { dispatch } = this.props;
history.listen((location, action) => {
// clear alert on location change
dispatch(alertActions.clear());
});
}
render() {
const { alert } = this.props;
return (
<div className="jumbotron">
<div className="container">
<div className="col-sm-8 col-sm-offset-2">
{alert.message &&
<div className={`alert ${alert.type}`}>{alert.message} </div>
}
<Router history={history}>
<div>
<PrivateRoute exact path="/" component={Map} />
<Route path="/login" component={LoginPage} />
<Route path="/register" component={RegisterPage} />
</div>
</Router>
</div>
</div>
</div>
);
}
}
function mapStateToProps(state) {
const { alert } = state;
return {
alert
};
}
export default connect(mapStateToProps)(App);
index.js
import React from 'react';
import { render} from 'react-dom';
import { Provider } from 'react-redux';
import { store } from './_helpers';
import App from './App.js';
import './index.css'; // postCSS import of CSS module
import { configureFakeBackend } from './_helpers';
configureFakeBackend();
render(
<Provider store={store}>
<App />
</Provider>,
document.getElementById('root') );
答案 0 :(得分:0)
这是我们遵循它可能对您有所帮助。
render(<ConfigureRoute store={store} />, document.getElementByid('root'));
其中ConfigureRoute是
const ConfigureRoute = props => (<Provider store={props.store}>
<Router history={history}>
<App>
<Route
exact
path="/login"
render={routeProps => <LoginContainer {...routeProps} {...props} />}
/></App></Router></Provider>
const App = props => props.children;