наблюдаемая избыточность / избыточная ошибка: действия должны быть простыми объектами - PullRequest
Новая
       16

наблюдаемая избыточность / избыточная ошибка: действия должны быть простыми объектами

1 голос
/ 04 апреля 2019

Я использую приставку с наблюдаемой редукцией и получаю странную ошибку:

Действия должны быть простыми объектами. Использовать пользовательское промежуточное ПО для асинхронных> действий. 

/* 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 () и передаю внутри сирийного номера, который нам нужно проверить.

Внутри Epic я передаю серийный номер json-серверу, который проверяет, существует ли этот номер в моей «базе данных». Если существует серийный номер, ответ сервера - .json, содержащий некоторые параметры.

Так что, если ответ не пустой, нам нужно написать успешное завершение: true в избыточном хранилище.

Но в конце мы получаем успешный запрос GET, а затем ошибка: действия должны быть простыми объектами. Используйте пользовательское промежуточное программное обеспечение для асинхронных действий. , но без изменений в избыточном хранилище и ничего из действия SERIAL_NUMBER_CHECK_SUCCESS.

1 Ответ

1 голос
/ 05 апреля 2019

Наконец-то я нашел решение.Я только что пропустил return , прежде чем вызывать действие в моем эпосе. 

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});
      }
    })
}
...