从withHedler中的withReducer检索重构本地调度函数

时间:2017-03-22 23:13:38

标签: javascript reactjs recompose

我有一个已经连接到redux商店并且已注入dispatch的组件。我正在尝试使用withReducerwithHandlers更新组件的本地状态,如下所示:

const reducer = (state, action) => {
  switch (action.type) {
    case 'SET_ACTIVE_TAB':
      console.log('recieved action', action)
      const { activeTab } = action
      return activeTab
    default:
     return state
  }

}

const initialState = 'actions'

const handlers = withHandlers({
  onTabClick: props => (e, { name }) => {
    const { dispatchLocal } = props
    dispatchLocal({
      type: 'SET_ACTIVE_TAB',
      activeTab: name
    })
  }
})

const enhancer = withReducer('activeTab', 'dispatchLocal', reducer, initialState)

我发现当我compose时:

compose(handlers, enhancer)(LayerListItem)

dispatchLocal道具未在handler内定义。使用recompose创建和绑定动作创建者以更新应用程序状态的最佳方法是什么。

1 个答案:

答案 0 :(得分:0)

您应该将withReducer移到withHandlers的右侧:

compose(
  withReducer(...),
  withHandlers(...)
)

通过这种方式,withReducer将首先创建调度函数并将其附加到props,然后withHandlers可以使用它。