首页 > 解决方案 > Redux 不会按 ID 从状态数组中删除项目

问题描述

我不明白这段代码有什么问题,我传入了 ID 并过滤掉了状态,但它只是不会删除,无法弄清楚,希望得到一些帮助。片:

import { createSlice } from "@reduxjs/toolkit";

const movieSlice = createSlice({
  name: "movie",
  initialState: { favoriteMovies: [] },
  reducers: {
    addMovie: (state, action) => {
      state.favoriteMovies = [...state.favoriteMovies, action.payload];
    },
    removeMovie: (state, action) => {
      state.favoriteMovies = state.favoriteMovies.filter(
        (movie) => movie.imdbID !== action.payload
      );
    },
  },
});

export const { addMovie, removeMovie } = movieSlice.actions;
export const selectMovie = (state) => state.movie.favoriteMovies;

export default movieSlice.reducer;

调度:

const MovieDetail = ({ movie }) => {
  const [isFavorite, setIsFavorite] = useState(false);
  const dispatch = useDispatch();
  const imdbID = movie.imdbID;

  const handleAddFavorite = () => {
    dispatch(addMovie({ movie }));
    setIsFavorite(true);
  };
  const handleRemoveFavorite = () => {
    dispatch(removeMovie({ imdbID }));
    console.log(imdbID);
    setIsFavorite(false);
  };

它什么时候应该删除,然后再次添加。我传入的 id 是正确的。

标签: reactjsredux

解决方案


您发送的方式

    dispatch(removeMovie({ imdbID }));

imdbID最终会变成action.payload.imdbID.

所以你需要访问它,或者像这样发送

    dispatch(removeMovie(imdbID));

推荐阅读