使用 FormData 传递 JSON 格式参数到 API 的方法

在开发中，我们经常需要将 JSON 格式的参数传递到 API 接口。当 API 接口要求请求体格式为 FormData 时，如果直接使用 JSON.stringify() 将参数序列化为 JSON 字符串，可能会导致参数无法正常传递。

问题：

代码中将参数放到 body 上，但 JSON 格式的参数没有被正确识别：

*update({ payload, callback, extra }, { call, select, put }) {
  // const formData = new FormData();
  // formData.append('model', JSON.stringify(payload));
  // const jsonData = JSON.stringify(payload)
  const res = yield call(saveGoods, payload);
  if (res) {
    const pageNum = yield select(state => state.mallGoods.data.pagination.current);
    yield put({
      type: 'fetch',
      payload: {
        page: {
          page: pageNum - 1,
        },
        ...(extra || {}),
      },
    });
    message.success('保存成功!');
  } else {
    message.error(res.msg);
  } 
  if (callback) callback(res);
},
export async function saveGoods(params) {
  return request(`/t2game-cms/mall/permission-ignore/produceAdd`, {
    method: 'POST',
    body: params,
  });
}

原因：

可能是因为接口要求的请求体格式是 FormData 而不是 JSON。在这种情况下，需要使用 FormData 来包装参数并将其传递给请求体。

解决方案：

使用 FormData 包装参数：

export async function saveGoods(params) {
  const formData = new FormData();
  formData.append('model', JSON.stringify(params));
  return request(`/t2game-cms/mall/permission-ignore/produceAdd`, {
    method: 'POST',
    body: formData,
  });
}

将请求体的 Content-Type 设置为 application/json：

如果接口要求使用 JSON 格式的参数，需要将请求体的 Content-Type 设置为 application/json，并将参数序列化为 JSON 字符串。

export async function saveGoods(params) {
  return request(`/t2game-cms/mall/permission-ignore/produceAdd`, {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json'
    },
    body: JSON.stringify(params),
  });
}

总结：

根据 API 接口要求的请求体格式选择合适的参数传递方式：

如果 API 要求请求体格式为 FormData，则使用 FormData 包装参数。
如果 API 要求使用 JSON 格式的参数，则将请求体的 Content-Type 设置为 application/json，并将参数序列化为 JSON 字符串。

通过以上方法，可以确保 JSON 格式的参数能够被 API 接口正确识别和处理。