Создатель действия в Redux выдает ошибку: TypeError: не удается прочитать свойство «фильтр» неопределенного
У меня есть список клиентов. Когда добавляется новый клиент, я хочу, чтобы создатель действия проверял, существует ли уже имя клиента, и если да, то отображал ошибку. Метод filter(), который я использую, чтобы узнать, существует ли уже клиент с таким именем, не работает... что я делаю неправильно?
действие:
export const addClient = (client) => {
return(dispatch, getState) => {
console.info('state: ' + JSON.stringify(getState()));
let clientList = getState().clientList;
console.info('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.info('add client failed');
return {
...state,
clientErr: 'A client with this exact name already exists, please try again.',
};
default:
return state;
}
};
export default clientReducer;
Кнопка добавить клиента работает нормально и отправка отправлена в действие но вот где я получаю ошибку.
ƒ getState() { if (isDispatching) { throw new Error('Вы не можете вызывать store.getState() во время выполнения редьюсера. ' + 'Редуктор уже получил состояние в качестве аргумента. ' + 'Pas…
как вы можете видеть здесь, getState() - это метод, а не объект
ой! так что я могу сделать getState().clientList.filter() ?
вы можете деструктурировать clientList из объекта, который getState() вернет -> const { clientList } = getState();, а затем отфильтровать его в своем выражении if
Я думаю, что моя проблема в том, что мой начальный список клиентов пуст. Я получаю эту ошибку, пытаясь добавить самого первого клиента.
когда я делаю это: const { clientList } = getState(); console.info(clientList) , он регистрирует undefined
Ответы 2
Измените логику, чтобы узнать, существует ли имя:
let clientList = getState().clientList
if (clientList && clientList.map( client => {
return client.name;
}).includes(client.name)
)
Я не знал, что include() — это метод, это круто. Но viciousP помог мне понять выше, что getState на самом деле является методом, getState(), поэтому я все еще получаю сообщение об ошибке, используя это, карта не определена.
пусть clientList = getState().clientList; if (clientList && clientList.map( client => { return client.name; }).includes(client.name))
Я только что отредактировал свой код выше и включил ваш фрагмент. Я больше не получаю сообщение об ошибке, однако ошибка не регистрируется. Он по-прежнему добавляет нового клиента, хотя клиент с таким именем уже существует.
Просмотрите выходные данные console.info, чтобы найти проблему console.info('state: ' + JSON.stringify(getState()); let clientList = getState().clientList; console.info('clientList: ' + clientList); if ( clientList && clientList.map( client => { return client.name; }).includes(client.name) ) { return ( dispatch({type: 'ADD CLIENT ERROR'}) ) } else { dispatch({type: ' ДОБАВИТЬ КЛИЕНТ', клиент}) }
вы должны пойти с client.clientsList
getState — это метод Redux, и здесь вы пытаетесь получить доступ к свойству объекта с помощью записи через точку. Здесь вы можете деструктурировать значение, возвращаемое этим методом, следующим образом:
const {
clients: { clientsList },
} = getState();
а затем отфильтруйте его в своем операторе if.
Это работает по большей части, но где-то в моем коде есть ошибка. Когда я ввожу имя клиента и добавляю его, он добавляет файл client. Затем, когда я повторяю одно и то же имя клиента, он все равно добавляет его, однако, если я делаю это в третий раз подряд, он говорит, что добавление клиента не удалось. Так что работает только после третьего добавления одного и того же имени.
Я думаю, это потому, что в первый раз он добавляет имя, а во второй раз имя === null, поэтому оно не читается как уже существующее. Почему он равен нулю во второй раз?
получил его на работу! хотел бы я поставить обе галочки, но я дам ему, так как он дал мне больше кода для работы. Хотя без вас не обошлось, спасибо!
Приятно слышать, что это работает :) Надеюсь, вы узнали здесь что-то об отладке.
не могли бы вы показать console.info(getState) вашего действия?