同时使用dangerMode和input - sweetalert

如何解决同时使用dangerMode和input - sweetalert

我使用Sweet Alert，所以在执行危险操作之前我会弹出对话框。示例。

swal({
  title: "Are you sure?",text: "Once deleted,you will not be able to recover this imaginary file!",icon: "warning",buttons: true,dangerMode: true,})
.then((willDelete) => {
  if (willDelete) {
    swal("Poof! Your imaginary file has been deleted!",{
      icon: "success",});
  } else {
    swal("Your imaginary file is safe!");
  }
});

但用户可以根据需要输入任何备注，这是可选的，不是必需的。所以会变成这个样子

所以我修改了这样的代码

function RequestUpload(value) {

                swal({
                    title: "Are you sure?",text: "Are you sure want to request to upload?",content: {
                        element: "input",attributes: {
                            placeholder: "Any remarks?",type: "text",},})
                    .then((willDelete,input) => {
                        if (willDelete) {

                            swal(`You typed: ${input}`);
                            //Call ajax here

                            
                        }
                        else {
                            swal(`Is not delete`);
                        }
                       
                    });

            
            }     

但我无法从输入中获取值，它一直显示 undefined。

知道如何解决这个问题吗？

解决方法

输入值作为第一个参数提供。当您单击取消、在弹出窗口外部单击或按 ESC 时，您将获得 null 值，该值将关闭警报（即：触发您的 else）。否则，如果您单击“确定”，它将保留您的输入值：

.then((input) => {
  if (input !== null) {
    swal(`You typed: ${input}`);
    //Call ajax here
  } else {
    swal(`Is not delete`);
  }
});

function RequestUpload(value) {
  swal({
      title: "Are you sure?",text: "Are you sure want to request to upload?",icon: "warning",buttons: true,dangerMode: true,content: {
        element: "input",attributes: {
          placeholder: "Any remarks?",type: "text",},})
    .then((input) => {
      if (input !== null) {
        swal(`You typed: ${input}`);
        //Call ajax here
      } else {
        swal(`Is not delete`);
      }
    });
}

RequestUpload();

<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>