Redux + React-Router不呈現

Question

所以我有相當標准的代碼仍然無法正常工作。 這有什么不對？

我試過這個解決方案，因為我有同樣的錯誤： 解決方案 ，但沒有成功。 我在瀏覽器控制台中的錯誤仍然是：

Warning: React.createElement: type should not be null, undefined, boolean, or number. It should be a string (for DOM elements) or a ReactClass (for composite components)

Uncaught Error: Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object.

我的代碼是：

var React = require('react');
var ReactDOM = require('react-dom');
var Router = require('react-router').Router;
var Route = require('react-router').Route;
var createBrowserHistory = require('history/lib/createBrowserHistory');
var createStore = require('redux').createStore;
var Provider = require('react-redux');
var connect = require('react-redux').connect;

var options = 'someTxt';

var reducer = function (state = {}, action) {
    console.log('reducer was called with state', state, 'and action', action)
    return state;
};

const store = createStore(reducer, options);

function mapStateToProps(state) {
    return {options: state.options};
};

var Index = React.createClass({
    render: function () {
        return (
            <div>
                {this.props.options}
            </div>
        );
    }
});

connect(mapStateToProps, {
    test: () => { type: 'TEST_ACTION' }
})(Index);

ReactDOM.render(
    <Provider store={store}>
        {() =>
            <Router history={createBrowserHistory()}>
                <Route path="/" component={Index}/>
            </Router>}
    </Provider>,
    document.getElementById("container")
);

__________UPDATE__________也請閱讀評論，確實有用的信息

Answer 1

Provider是react-redux模塊的一部分; 不是全部。

您需要更改您的require語句

var Provider = require('react-redux');

至

var Provider = require('react-redux').Provider;

或者使用ES6模塊語法

import { Provider } from 'react-redux';

Answer 2

當你使用帶有大括號的箭頭函數時，你的函數返回對象是不一樣的。 括號表示函數體（因此必須在其中使用return語句）。 以下是它的假設：

connect(mapStateToProps, {
    test: () => {return { type: 'TEST_ACTION' }}
})(Index);