如何使用React Redux Toastr修复错误以进行确认

Question

使用react redux toastr时出现以下错误。该问题已记录Warning: Function components cannot be given refs. Attempts to access this ref will fail.

这是我写的动作：

export const cancelToggle = (cancelled, eventId) => async (
  dispatch,
  getState,
  { getFirestore }
) => {
  const firestore = getFirestore();
  const message = cancelled
    ? "Are you sure you want to cancel the event?"
    : "This reactivate the event - are you sure?";
  try {
    toastr.confirm(message, {
      onOk: () =>
        firestore.update(`events/${eventId}`, {
          cancelled: cancelled
        })
    });
  } catch (error) {
    console.log(error);
  }
};

这是我在使用它的地方。

<Button
     onClick={() => cancelToggle(!event.cancelled, event.id)}
     type="button"
     color={event.cancelled ? "green" : "red"}
     floated="right"
     content={event.cancelled ? "Reactivate Event" : "Cancel Event"}
 />

这是我遇到的错误：

Warning: Function components cannot be given refs. Attempts to access this ref will fail.

Check the render method of `ToastrConfirm`.
    in ReduxConfirmButton (created by ToastrConfirm)
    in div (created by ToastrConfirm)
    in div (created by ToastrConfirm)
    in div (created by ToastrConfirm)
    in ToastrConfirm (created by ReduxToastr)
    in span (created by ReduxToastr)
    in ReduxToastr (created by Connect(ReduxToastr))
    in Connect(ReduxToastr) (created by App)
    in div (created by App)
    in Provider (created by App)
    in App (created by Connect(App))
    in Connect(App)
    in AppContainer