分离一个太大的减速器 - 得到错误

时间:2017-05-09 06:22:47

标签: javascript react-native redux react-redux

我想在distanceFromPlaceValue缩减器中添加location缩减器 - 因为我有这种形式的redux存储:

import { Map } from 'immutable'
import { Dimensions } from 'react-native'

const searchForm = Map(
  {
    'categories': [],
    // 'mealTypes': [],
    'location': {
      'locationInput': '',
      'place': {},
      'position': {},
      'distanceFromPlaceValue': 10,
      'distanceFromPlaceUnit': 'kilometer',
      'autocompleteResults': {}
    },
    'keywords': ''
  }
)

var { width, height } = Dimensions.get('window')
const ASPECT_RATIO = width / height
const LATITUDE = 19.0760
const LONGITUDE = 72.8777

const LATITUDE_DELTA = 0.01
const LONGITUDE_DELTA = LATITUDE_DELTA * ASPECT_RATIO

const region = Map(
  {
    region: {
      latitude: LATITUDE,
      longitude: LONGITUDE,
      latitudeDelta: LATITUDE_DELTA,
      longitudeDelta: LONGITUDE_DELTA
    }
  }
)

const map = Map(
  region: region
)

const searchPage = Map(
  {
    'isMenuOpen': true
  }
)

const initialState = Map(
  {
    searchForm: searchForm,
    searchPage: searchPage,
    map: map
  }
)

export default initialState

并且我没有将distanceFromPlaceValue案例添加到location缩减器并且并非真正想要 - 减速器变得太大。

这是我的尝试:

const rootReducer = combineReducers(
  {
    searchForm: combineReducers(
      {
        keywords,
        categories,
        location: combineReducers({ location, distanceFromPlaceValue })
      }),
    searchPage,
    map
  }
)

出现此错误:

  

减速器收到的先前状态是意外类型。   期望参数是Immutable.Collection或。的实例   Immutable.Record具有以下属性:" location",   " distanceFromPlaceValue"

我在combineReducers中做错了什么。我做错了什么?

1 个答案:

答案 0 :(得分:2)

combineReducers会将locationdistanceFromPlaceValue嵌套到比我想要的更深的级别,因此您最终会得到如下结构:

{
    'keywords': ''
    'categories': [],
    'location': {
      'location': {
        'locationInput': '',
        'place': {},
        'position': {},
        'autocompleteResults': {}
      }
      'distanceFromPlaceValue': {
        'distanceFromPlaceValue': 10,
        'distanceFromPlaceUnit': 'kilometer'
      }
    }
  }

而不是像searchForm const。

中那样合并在一起

在前往beyond combineReducers时阅读Redux文档,然后考虑一下您希望状态结构最终看起来像什么。

如果你仍然希望合并两个reducer,而不是将它们组合成一个嵌套结构,那么plenty of other libraries可以用不同的方式为不同的效果组合reducer。

之前我曾使用redux-concatenate-reducers执行此操作,但没有使用ImmutableJS结构,所以它可能无法为您开箱即用

const rootReducer = combineReducers(
  {
    searchForm: combineReducers(
      {
        keywords,
        categories,
        location: concatenateReducers([location, distanceFromPlaceValue])
      }),
    searchPage,
    map
  }
)