使用 axios 将数据推送到现有 object 中的数组

Question

我想知道我是否可以在 localhost:3000/episodes 上使用 axios.post 将一些数据推送到特定数组。

我有一个看起来像这样的 object：

 {
      "title": "675756",
      "release_date": "2022-01-16",
      "series": "Better Call Saul",
      "img": "https://upload.wikimedia.org/wikipedia/en/0/03/Walter_White_S5B.png", 
      "characters": [],
      "id": 1
    }

我想将字符的id添加到数组中。 我通过form完成，然后像这样handle the submit ：

const handleSubmit = (values) => {
    console.log("dodano aktora do filmu!");
    console.log(values);
    addActorToMovie(values);

    history.goBack();
  };

这是addActorToMovie定义：

export const addActorToMovie = (resp) => ({
  type: types.ADD_CHAR_TO_MOVIE,
  payload: resp,
});

和减速机：

 case types.ADD_CHAR_TO_MOVIE:
      console.log(action.payload);
      return {
        ...state,
        ...state.episodes.map(function (item) {
          return item.id === action.payload.episodeId
            ? {
                id: item.id,
                title: item.title,
                release_date: item.release_date,
                series: item.series,
                img: item.img,
                characters: [...item.characters, action.payload.actor],
              }
            : { ...item };
        }),
      };

一切正常，但问题是我不想在本地做。 我正在使用带有 json-server 的database ，并且我想做一个Axios Request ，以便它将数据添加到database中。 And I don't know how to do this, when I use axios.post it adds an object to my episodes array, if I'm using axios.put it changes an object. 是否有可能像我使用上面的代码一样将数据推送到数组中，但是使用 axios 以便将其添加到database中？

我的方法是这样的：

export const addActorToMovieAxios = (value) => {
  console.log(value);
  return async (dispatch) => {
    try {
      const response = await axios.post(
        `http://localhost:3000/episodes/`,
        value
      );
      console.log(response);
      dispatch(addActorToMovie(response.data));
    } catch (ex) {
      console.log(ex);
    }
  };
};

但正如我所说，这确实向阵列添加了一个新的 object .....

"episodes": [
    {
      "title": "675756",
      "release_date": "2022-01-16",
      "series": "Better Call Saul",
      "img": "https://upload.wikimedia.org/wikipedia/en/0/03/Walter_White_S5B.png",
      "characters": [],
      "id": 1
    },
    {
      "episodeId": 1,
      "actor": "1",
      "id": 2
    }
  ]

Answer 1

在您的调度 function 中，您指的是episodes数组。
您应该明确引用characters数组。
尝试这个

export const addActorToMovieAxios = (value) => {
  console.log(value);
  return async (dispatch) => {
    try {
      const response = await axios.post(
        `http://localhost:3000/episodes/`,
        value
      );
      console.log(response);
      dispatch(addActorToMovie(response.data.characters));
    } catch (ex) {
      console.log(ex);
    }
  };
};