終極版動作必須是普通對象，但我定明文對象

Question

我用終極版 + 反應建立自己的網站，我想用Redux的控制側邊欄visible.The側邊欄被定義語義-UI-反應。因爲我想通過其他組件控制它，所以我在側邊欄的父組件const { visible, dispatch } = this.props中定義了道具，有一個onClick函數來處理這個問題。我將顯示我的代碼。

Uncaught Error: Actions must be plain objects. Use custom middleware for async actions.

這個錯誤讓我困惑了一個下午，我不知道爲什麼！這是我的動作代碼：

**action** 

export const SIDEBARISVISIBLE = 'sidebarVisible' 

export function sidebarVisibleAction() { 
    return { type: SIDEBARISVISIBLE } 
} 

正如你所看到的，我定義的行動的創建者返回一個普通的對象。

這是我的減速器代碼：

**reducer** 

import SIDEBARISVISIBLE from '../actions/outside.js' 

function sidebarVisible(state = { 
    sidebarIsVisible: false 
}, action) { 

    switch (action.type) { 
     case SIDEBARISVISIBLE: 
      return Object.assign({}, state, { 
       sidebarIsVisible: !state.sidebarIsVisible 
      }) 
     default: 
      return state 
    } 
} 

export default sidebarVisible 

而且我的店鋪代碼：

**store** 

import { createStore, applyMiddleware, compose } from 'redux' 
import thunk from 'redux-thunk' 
import sidebarVisible from '../reducers/outside.js' 

export default initialState => { 
    return createStore(
    sidebarVisible, 
    initialState, 
    applyMiddleware(thunk) 
) 
} 

然後，我的組件代碼（部分）：

class OutsideView extends Component { 

    constructor(props) { 
     super(props) 
     this.state = { activeItem: '' } 
    } 

    handleItemClick = (e, { name }) => this.setState({ activeItem: name }) 

    render() { 
     const { activeItem } = this.state 
     const { visible, dispatch } = this.props 

     return (
      <div> 
       <SidebarNav visible={ visible } /> 

       ...... 

        <Menu.Item 
        name='sidebar' 
        active={ activeItem === 'sidebar'} 
        onClick={ (e, {name}) => { 
           this.setState({ activeItem: name }) 
           dispatch(sidebarVisibleAction) 
          } }> 
        <Icon color='red' name='list' /> 
       </Menu.Item> 

OutsideView.PropTypes = { 
    visible: PropTypes.bool.isRequired, 
    dispatch: PropTypes.func.isRequired 
} 

function mapStateToProps(state) { 
    return { 
    visible: state.sidebarIsVisible, 
    } 
} 

export default connect(
    mapStateToProps 
)(OutsideView) 

最後，我的路由器：

import configureStore from './store/index.js' 
const store = configureStore() 

export default class Root extends Component { 

    render() { 
     return (
      <Provider store={ store }> 
      <Router history={ browserHistory }> 
       <Route path="/" component={ OutsideRedux }> 
        <Route path='register' component={ Register } /> 
        <Route path='login' component={ Login } /> 
        <Route path='blog' component={ Blog } /> 
        <Route path='about' component={ About } /> 
        <Route path='home' component={ Home } /> 
        <Route path='ask' component={ Ask } /> 
        <Route path='panel' component={ Panel } /> 
        <Route path='setting' component={ Setting } /> 
        <Route path='user' component={ User } /> 
       </Route> 
      </Router> 
      </Provider> 
     ) 
    } 
} 

所以，我要尋找的答案這個錯誤，他們大多說，你必須設置Redux的-的thunk，並與ApplyMiddleware使用它，我所定義的簡單way.But動作是平原對象。如果我不使用redux-thunk，我想我也不會遇到這個錯誤。所以，我很困惑，如何解決這個問題？

感謝所有幫助

Answer 1

這裏：

dispatch(sidebarVisibleAction)

您傳遞函數sidebarVisibleAction到dispach。你應該把它和傳遞，故其代碼如下：

dispatch(sidebarVisibleAction())

（現在dispatch將得到的對象，不是一個函數）。