标签: sweetalert2

我在应用程序中的某些对话框中使用了sweetalert2。但是，sweetalert2 网站提供了一些示例，当我将它们复制/粘贴到我的 Web 应用程序代码中时，这些示例报告了此错误：

SyntaxError: await is only valid in async functions and async generators

经过一些研究，我async之前添加了function testSweetalert(). 这虽然解决了语法错误，代码既没有达到陈述resolve('You need to select Ukraine :)')或swal('You selected: ' + country)。

下面的 Javascript 代码在我的 html 代码中是这样调用的：

<button onclick="testSweetalert()">test</button>

<button onclick="testSweetalert()">test</button>

尽管我试图了解有关async函数和使用的更多信息，但Promise我无法弄清楚上述代码有什么问题。这让我特别困惑，因为我在sweetalert2上找到的代码示例在他们的github页面上运行良好。

我已经构建了一个包含HTML和select功能的sweetAlert2 pop.问题是选择框是在HTML下的弹出窗口底部加载的.

            var array = '[{"teachName" : "Pending Account", "teachNum" : "99999999"},{"teachName" : "test, test", "teachNum" : "101-temp"}]';
            var options = {};
            $.map(array,
            function(o){
                options[o.teachNum] = o.teachName;
            });
            swal({
                title: date.format("MM/DD/YYYY"),
                type: 'info',
                input: 'select',
                inputOptions: options ,
                html: 'Teacher: ' + $("#teacher").val() + '<br /><br /><div style="border:2px solid purple;" >' +
                    'Hours: ' +
                    '<input type="text" autofocus id="hours" style="display:block !important;" class="sweet-alert-input"/>' +
                    '<br />Notes: ' +
                    '<br /><input type="text" autofocus id="notes" style="display:block !important;" class="sweet-alert-input"/></div>' +
                    '<button type="' + btn …

我使用 SweetAlert 库在我的应用程序中显示一个弹出窗口。这是我的代码

swal({
    title: "Are you sure?",
    text: "Test message?",
    type: "info",
    showCancelButton: true,
    focusConfirm: false,
    confirmButtonColor: "#DD6B55",
    confirmButtonText: "Yes",
    cancelButtonText: "No"
}, function (isConfirm) {})

我需要在右上角添加一个关闭按钮。根据文档，关闭按钮仅适用于 SweetAlert2 库。

是否可以在 SweetAlert1 库中添加关闭按钮？

我认为我一定以某种方式导入了这个错误，但我不确定。我按照github上的说明进行操作。它说我可以npm install，然后就可以了import swal from 'sweetalert2'。我还必须使用js和css文件吗？

发生的情况是，我在窗口左下角收到一个奇怪的警报，该警报不会消失。

这是我的代码：

import React, { Component } from 'react';
import swal from 'sweetalert2';

class TestSwal extends Component {
  componentDidMount() {
    swal({
      title: 'Are you sure?',
      text: 'You will not be able to recover this imaginary file!',
      type: 'warning',
      showCancelButton: true,
      confirmButtonText: 'Yes, delete it!',
      cancelButtonText: 'No, keep it'
    }).then(
      function() {
        swal('Deleted!', 'Your imaginary file has been deleted.', 'success');
      },
      function(dismiss) {
        // dismiss can …

我目前正在与sweetalert2合作，并且尝试检测警报何时关闭。但是，不会触发DeleteUnsavedImages函数。我认为将功能分配给onclose键会起作用，但是没有运气。

   swal({
       html: data,
       showCloseButton: false,
       showCancelButton: false,
       width: 800,
       showConfirmButton: false,
       onClose: DeleteUnsavedImages()
   }).then(function () {

   });


function DeleteUnsavedImages(){
    var test = "-1";
}

任何帮助，将不胜感激 ：-）

我使用这些框架：

• 甜蜜警报2
• fengyuanchen 的日期选择器

我想使用这两个框架来输入日期。我的问题是日期选择器位于警报的后台，而且也不可用。
这个问题，你可以在这个小提琴中找到：https://jsfiddle.net/vbfhtzf9/2/

<button>Click me!</button>
<script>
    $(document).ready(function() {
        $('button').click(function(){
            swal({
                html: '<input data-toggle="datepicker" type="text" id="#swal-input1" class="swal2-input">',
                        confirmButtonText: 'Next &rarr;',
                        showCancelButton: true,
                        onOpen: function() {
                            $('[data-toggle="datepicker"]').datepicker({
                                startView: 2,
                                autoHide: true,
                                inline: true,
                            });
                        },
            });
        });
    });
</script>

我的问题是，你知道 CSS 等技巧，可以将 Datepicker 放在前面吗？

我期待您的答复！

我正在使用https://sweetalert2.github.io/的 Sweetalert2 ，这是我的配置

  swal({
      title: 'Success!',
      type: 'success',
      toast: true,
      html: response.message,
      showCloseButton: true,
      showCancelButton: true,
      allowEscapeKey: true,
      allowOutsideClick: true,
      //focusConfirm: false,
      confirmButtonText: 'Continue Shopping',
      confirmButtonAriaLabel: 'Continue Shopping',
      cancelButtonText: '<a href="' + cartLink + '" style="color:white;">View Cart and Checkout</a>',
      cancelButtonColor: '#ff6d02',
      cancelButtonAriaLabel: 'Cart',
  });

这是结果

所以，问题是 externalclick true 配置不起作用，并且关闭按钮不在右侧。请问我该如何解决这个问题？

我正在使用 Sweet Alert2 ( https://sweetalert2.github.io/ ) -react 组件，我需要在第二步用（千位分隔符和前缀 =“$”）屏蔽输入，这可能吗？

这里有一些代码

    从 'react' 导入 React, { Component };
    从 'sweetalert2' 导入 Swal；
    从“@material-ui/core”导入{Fab}；
    从 'sweetalert2-react-content' 导入 withReactContent；


    const reSwal = withReactContent(Swal);

    类 NewTask 扩展组件 {


      状态={
        转到个人资料：假
      };


      处理新任务 = async () => {

        reSwal.mixin({
          输入文本'，
          确认按钮文本: '下一步→',
          显示取消按钮：真，
          进度步骤：['1', '2']
        }）。队列（[
          {
            标题：'年龄'，
            文字：“你的年龄”
          },
          {
            标题：“预算”，
            文本：“您的预算”，
            输入：'数字'，
            输入属性：{
              分钟：100，
              最大：1000000
            },
          },

        ]).then((结果) => {
          if (结果.值) {
            reSwal.fire({
              标题：“谢谢你！”，
              确认按钮文本：“可爱！”
            })
          }
        })
      }

      使成为（） {

        返回 …

我想在单击文本时显示带有 sweetalert (swal.fire) 的窗口提示。if 语句和窗口提示符如何在这个库上工作？在此之后，您就会意识到我是这个编程世界的新手。

之后，我想为该输入分配一个值并验证答案是否正确。

<td class="gases" title="Hidr\xc3\xb3geno" id="H">H</td>这是我要单击的元素

Swal.fire({\ntitle:'\xc2\xbfCu\xc3\xa1l es el elemento?',\ntext: 'Introduce el nombre aqu\xc3\xad',\ninput: 'text',\ninputPlaceholder: 'Nombre', })\n

这是我单击该元素时想要出现的提示。单击“确定”按钮后，想要验证引入的名称是否正确...：

if (name === hidr\xc3\xb3geno) {\n     Swal.fire ('Correct!', 'You got the answer right!', 'success') }\n\nelse {\n     Swal.fire ('Incorrect...', 'You failed!', 'error') }\n

谁能建议我应该使用哪个 sweetalert 库以及为什么？

我正在编写一个 node.js Web 应用程序，并在对可以使用哪些奇特的警报库进行一些研究后，发现其中两个看起来相同：SweetAlert和SweetAlert2。