1

Не совсем разобрался, подскажите как правильно. Проблема в том что после вызова функций close ничего не происходит, по идее должен удалиться компонент с страницы
notificationReducer.js

import {DELETE_NOTIFICATION } from './types';

const initialState = {
  notifications: [
    {
      id: 1,
      message: 'Text',
    },
  ],
};

const notificationReducer = function (state = initialState, action) {
  switch (action.type) {
    case DELETE_NOTIFICATION:
      return {
        ...state,
        notifications: state.notifications.filter(
          (item) => item.id !== action.payload
        ),
      };
    default:
      return state;
  }
};
export default notificationReducer;

types.js

export const DELETE_NOTIFICATION = 'DELETE_NOTIFICATION';

actions.js

import { DELETE_NOTIFICATION } from './types';
export function deleteNotifcation(id) {
  return {
    type: DELETE_NOTIFICATION,
    payload: id,
  };
}

component.jsx

import { deleteNotifcation } from '../../redux/actions';
export default function component() {
  const close = () => {
    deleteNotifcation(1);
  }
  return (
    ...
    <button type="button" onClick={close}>Click</button>
    ... 
  );
}

1 ответ 1

1

вы должни оборачивать ваш вызов акшона с dispatch иначе ничего не изменится в store. например

import { useDispatch } from 'react-redux';
import { deleteNotifcation } from '../../redux/actions';

export default function MyComponent() {
  const dispatch = useDispatch();

  const close = () => {
    dispatch(deleteNotifcation(1));
  }

  return (
    ...
    <button type="button" onClick={close}>Click</button>
    ... 
  );
}

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.