SweetAlert2: 未知参数 “onOpen” 如何解决此警告?

huangapple go评论101阅读模式
英文:

how can I resolve this warning: SweetAlert2: Unknown parameter "onOpen"?

问题

以下是代码部分的翻译:

  1. my sweet alert show this warning, how can I resolve this? any idea
  1. 我的Sweet Alert显示这个警告如何解决有什么想法
  1. don't know what causes this warning when I fire this Sweet Alert, it shows this warning.
  1. 不知道在我触发Sweet Alert时是什么导致了这个警告它显示这个警告
  1. here is the alert component code:
  1. 这是警报组件的代码
  1. import Swal from "sweetalert2";
  1. import Swal from "sweetalert2";
  1. const ToastComponent = Swal.mixin({
  1. const ToastComponent = Swal.mixin({
  1. toast: true,
  2. position: "top-end",
  3. showConfirmButton: false,
  4. timer: 3000,
  5. timerProgressBar: true,
  6. onOpen: (toast) => {
  7. toast.addEventListener("mouseenter", Swal.stopTimer);
  8. toast.addEventListener("mouseleave", Swal.resumeTimer);
  9. },
  10. });
  1. toast: true,
  2. position: "top-end",
  3. showConfirmButton: false,
  4. timer: 3000,
  5. timerProgressBar: true,
  6. onOpen: (toast) => {
  7. toast.addEventListener("mouseenter", Swal.stopTimer);
  8. toast.addEventListener("mouseleave", Swal.resumeTimer);
  9. },
  10. });
  1. export const Alert = (type = "", title = "", description = "") =>
  2. Swal.fire(title, description, type);
  1. export const Alert = (type = "", title = "", description = "") =>
  2. Swal.fire(title, description, type);
  1. export const Toast = (type = "", title = "") =>
  2. ToastComponent.fire({
  3. icon: type,
  4. title,
  5. });
  1. export const Toast = (type = "", title = "") =>
  2. ToastComponent.fire({
  3. icon: type,
  4. title,
  5. });

请注意,上述翻译中,我将HTML实体编码"转换为双引号"以更好地呈现代码。如果您需要进一步的帮助,请随时提问。

英文:

my sweet alert show this warning, how can I resolve this? any idea
SweetAlert2: 未知参数 “onOpen” 如何解决此警告?
SweetAlert2: 未知参数 “onOpen” 如何解决此警告?

don't know what causes this warning when I fire this Sweet Alert, it shows this warning.

here is the alert component code:

  1. import Swal from "sweetalert2";
  2. const ToastComponent = Swal.mixin({
  3. toast: true,
  4. position: "top-end",
  5. showConfirmButton: false,
  6. timer: 3000,
  7. timerProgressBar: true,
  8. onOpen: (toast) => {
  9. toast.addEventListener("mouseenter", Swal.stopTimer);
  10. toast.addEventListener("mouseleave", Swal.resumeTimer);
  11. },
  12. });
  13. export const Alert = (type = "", title = "", description = "") =>
  14. Swal.fire(title, description, type);
  15. export const Toast = (type = "", title = "") =>
  16. ToastComponent.fire({
  17. icon: type,
  18. title,
  19. });

答案1

得分: 1

From

  1. onOpen: (toast) => {
  2. toast.addEventListener("mouseenter", Swal.stopTimer);
  3. toast.addEventListener("mouseleave", Swal.resumeTimer);
  4. }

To

  1. didOpen: (toast) => {
  2. toast.addEventListener('mouseenter', Swal.stopTimer);
  3. toast.addEventListener('mouseleave', Swal.resumeTimer);
  4. }
英文:

In case of onOpen didn't work, I think you can use didOpen.

From

  1. onOpen: (toast) => {
  2. toast.addEventListener("mouseenter", Swal.stopTimer);
  3. toast.addEventListener("mouseleave", Swal.resumeTimer);
  4. }

To

  1. didOpen: (toast) => {
  2. toast.addEventListener('mouseenter', Swal.stopTimer)
  3. toast.addEventListener('mouseleave', Swal.resumeTimer)
  4. }

I made a playground here.
Codepen.

huangapple
  • 本文由 发表于 2023年4月4日 13:59:59
  • 转载请务必保留本文链接:https://go.coder-hub.com/75925943.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定