Создатель действия в Redux выдает ошибку: TypeError: Невозможно прочитать свойство filter из undefined - PullRequest
1 голос
/ 11 апреля 2019

У меня есть список клиентов. Когда добавляется новый клиент, я хочу, чтобы создатель действия проверил, существует ли уже имя клиента, и, если это так, выдает ошибку. Метод filter (), который я использую, чтобы выяснить, не работает ли клиент с таким именем, не работает ... что я делаю неправильно?

действие:

export const addClient = (client) => {
    return(dispatch, getState) => {
        console.log('state: ' + JSON.stringify(getState())); 
        let clientList = getState().clientList; 
        console.log('clientList: ' + clientList); 
        if (clientList && clientList.map( client => { 
            return client.name;
        }).includes(client.name)) 
            { return ( dispatch({type: 'ADD CLIENT ERROR'}) ) }
        else { dispatch({type: 'ADD CLIENT', client}) }
    }
}

редуктор:

const initState = {
  clientList: [],
  clientErr: null,
};

const clientReducer = (state = initState, action) => {
  switch (action.type) {
    case 'ADD CLIENT ERROR':
      console.log('add client failed');
      return {
        ...state,
        clientErr: 'A client with this exact name already exists, please try again.',
      };
    default:
      return state;
  }
};

export default clientReducer;

Кнопка добавления клиента работает нормально, и отправка отправляется действию, но именно здесь я получаю сообщение об ошибке.

console

Ответы [ 2 ]

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

getState - метод Redux, и здесь вы пытаетесь получить доступ к свойству объекта с помощью точечной нотации. То, что вы можете сделать здесь, это деструктурировать значение, возвращаемое этим методом, следующим образом:

const {
  clients: { clientsList },
} = getState();

, а затем отфильтруйте его в своем операторе if.

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

Измените логику, чтобы найти, если имя существует:

let clientList = getState().clientList
if (clientList && clientList.map( client => {
      return client.name;
    }).includes(client.name)
   )
...