React中如何将Promise中的数据传递给Toastify？

要实现把API返回的data.message传递给toast.promise的success提示，只需两步调整：

• 在Promise的resolve方法中传入要传递的消息内容
• 将success配置项改为函数，接收resolve传递的值并返回提示文本

修改后的完整代码 #

const myPromise = new Promise((resolve, reject) =>
  fetch(`${baseURL}/accounts/getData`, {
    method: 'POST',
    headers: {
      "Content-Type": "application/json",
      "authorization": `Bearer ${auth?.user?.authToken}`
    },
    body: JSON.stringify(data)
  })
  .then(res => res.json())
  .then(data => {
    if (data?.status === 'success' && data?.message) {
      // 把API返回的消息传入resolve
      resolve(data.message);
    } else {
      // 抛出带自定义消息的错误
      throw new Error(data?.message || '请求失败');
    }
  })
  .catch(error => {
    // 把错误信息传入reject
    reject(error.message);
  })
)

toast.promise(myPromise, {
  pending: "Loading...",
  // 用函数接收resolve传递的消息，返回最终提示文本
  success: (message) => `${message}`,
  // 同理，error也可接收reject传递的错误信息
  error: (errorMessage) => `${errorMessage}`
}, {
  position: "top-center",
  autoClose: 5000,
  hideProgressBar: false,
  closeOnClick: true,
  pauseOnHover: true,
  draggable: true
});

关键说明 #

1. 传递数据到Promise状态：在API请求成功时，通过resolve(data.message)把需要显示的消息传递出去；错误场景下，将错误信息通过reject(error.message)传递，让提示更精准。
2. 函数式配置提示文本：toast.promise的success和error支持传入函数，函数会自动接收Promise resolve/reject时传递的值，你可以直接返回该值，或者拼接成更友好的提示格式。

内容的提问来源于stack exchange，提问作者Sugar Code