redux / redux-observable error：动作必须是普通对象

Question

我正在使用带有redux-observable的redux并得到这个奇怪的错误：

动作必须是普通对象。使用自定义中间件进行异步>操作。

/* Component.jsx */
import React from "react"
import { serialNumberCheck } from '../actions'

const Component = props => {
  ...
  <button
    onClick={() => props.serialNumberCheck('123456789123456')}
  >
    Check
  </button>
  ...
}

const mapDispatchToProps = dispatch =>
  bindActionCreators({serialNumberCheck}, dispatch)

export default compose(
  reduxForm({
    ...
  }),
  withStyles(styles),
  connect(mapDispatchToProps)
)(Component)



/* actions.js */
export const SERIAL_NUMBER_CHECK = 'SERIAL_NUMBER_CHECK'
export const SERIAL_NUMBER_CHECK_SUCCESS = 'SERIAL_NUMBER_CHECK_SUCCESS'

export const serialNumberCheck = (serialNumber) => ({
  type: SERIAL_NUMBER_CHECK,
  payload: serialNumber
})

export const serialNumberCheckSuccess = (data) => ({
  type: SERIAL_NUMBER_CHECK,
  payload: data
})



/* epics.js */
...
import { serialNumberCheck } from "../actions"
import ... from 'rxjs'

...
function serialNumberCheckEpic(action$) {
  return action$
    .ofType(SERIAL_NUMBER_CHECK)
    .switchMap((data) => {
      return ajax.getJSON(`http://localhost:3004/sn/?sn=${data.payload}`)
      .map((data) => data)
    })
    .map(data => {
      if(data.length !== 0) {
        serialNumberCheckSuccess({success: true});
      }
    })
}

...
export const rootEpic = combineEpics(
  ...
  serialNumberCheckEpic
);



/* reducer.js */
import {
  SERIAL_NUMBER_CHECK_SUCCESS,
} from '../actions'

...
export default function epicReducer(state = initialState, action) {
  switch (action.type) {
    case SERIAL_NUMBER_CHECK_SUCCESS:
      return {
        ...state,
        success: action.payload
      }
  }
}

/* JSON-SERVER RESPONSE */
[
  {
    "id": 1,
    "sn": "123456789123456"
  }
]

在组件里面我调用函数serialNumberCheck（）并传递我们需要检查的sierial数字。

在Epic中我将序列号传递给json-server，检查这个号码是否存在于我的“数据库”中。如果存在序列号，则服务器响应为.json，其中包含一些参数。

因此，如果响应不为空，我们需要写成功：在redux store中为true。

但最终我们获得了成功的GET请求，然后出现错误：操作必须是普通对象。使用自定义中间件进行异步操作。但在redux-store中没有任何更改，也没有从SERIAL_NUMBER_CHECK_SUCCESS操作中进行任何更改。

Answer 1

最后，我找到了解决方案。在我的史诗中调用动作之前，我错过了回归。

function serialNumberCheckEpic(action$) {
  return action$
    .ofType(SERIAL_NUMBER_CHECK)
    .switchMap((data) => {
      return ajax.getJSON(`http://localhost:3004/sn/?sn=${data.payload}`)
      .map((data) => data)
    })
    .map(data => {
      if(data.length !== 0) {
        + return serialNumberCheckSuccess({success: true});
      }
    })
}