показывать видео в SweetAlert

#javascript #php #html #sweetalert #vue-sweetalert2

#javascript #php #HTML #sweetalert #vue-sweetalert2

Вопрос:

Добрый день, я использую SweetAlert для отображения уведомлений, просматривая официальные документы SweetAlert, они показывают некоторые примеры, например, для отображения изображений, но то, что я пытаюсь сделать, это показать видео на YouTube.

SweetAlert2

 Swal.fire({
  title: 'Sweet!',
  text: 'Modal with a custom image.',
  imageUrl: 'https://unsplash.it/400/200',
  imageWidth: 400,
  imageHeight: 200,
  imageAlt: 'Custom image',
})
 

Любая рекомендация показывать видео Youtube на SweetAlert.

Некоторые примеры, которые я сделал, — это встраивание видео с помощью iframe:

 <iframe width="560" height="315" src="https://www.youtube.com/embed/d_elXY2Lcfk" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
 

Но я хочу, чтобы, просто указав путь, я мог видеть видео.

Ответ №1:

В документации вы можете использовать пользовательский html в качестве тела предупреждения

 Swal.fire({
  title: '<strong>HTML <u>example</u></strong>',
  icon: 'info',
  html:
    '<iframe width="560" height="315" src="https://www.youtube.com/embed/d_elXY2Lcfk" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>',
  showCloseButton: true,
  showCancelButton: true,
  focusConfirm: false,
  confirmButtonText:
    '<i class="fa fa-thumbs-up"></i> Great!',
  confirmButtonAriaLabel: 'Thumbs up, great!',
  cancelButtonText:
    '<i class="fa fa-thumbs-down"></i>',
  cancelButtonAriaLabel: 'Thumbs down'
})