将redux-react与react-router一起使用时无效的prop'component'

Mar*_*ahl 3 javascript reactjs react-router react-redux

connect在我的情况下从react-redux 使用时,反应路由器不会将我的react组件视为有效组件。并且有一个警告:propType失败:component提供给无效的propRoute

index.js

import { connect } from 'react-redux'
import { createStore } from 'redux'
import { Provider } from 'react-redux'
import plattformApp from './reducers'

var React = require('react');
var ReactDOM = require('react-dom');
var ReactRouter = require('react-router');
var Router = ReactRouter.Router;
var Route = ReactRouter.Route;
var hashHistory = ReactRouter.hashHistory;
var Main = require('./components/Main');

let store = createStore(plattformApp)

ReactDOM.render(
  <Provider store={store}>
    <Router history={hashHistory}>
        <Route path='/' component={Main}>
        </Route>
    </Router>
  </Provider>,
  document.getElementById('app')
)
Run Code Online (Sandbox Code Playgroud)

Main.js

var React = require('react');
var ReactRouter = require('react-router');
var Link = ReactRouter.Link;
var KNGui = require("../components/KNGui");
var Search = require("../components/Search");

var Main = React.createClass({
  render: function () {
    return (
        <div>
        </div>
    )
  }
});

function mapStateToProps(state) {
  return { test: state }
}

export default connect(mapStateToProps)(Main)
Run Code Online (Sandbox Code Playgroud)

Yur*_*nko 5

现在var Main包含完整的模块。

要访问组件,您需要

var Main = require('./components/Main').default;
Run Code Online (Sandbox Code Playgroud)

要么

import Main from './components/Main';
Run Code Online (Sandbox Code Playgroud)

获取组件。