如何在sweetalert2上输入确认对话框？

如何解决如何在sweetalert2上输入确认对话框？

function order(id){
     const { value: numberinput } = await Swal.fire({
        title: 'You are ordering' + id + 'are you sure?',text: 'When you press the "Order!" button,your order will be processed.',icon: 'warning',showCancelButton: true,cancelButtonColor: '#d33',confirmButtonColor: '#3bc42b',cancelButtonText: 'Cancel',confirmButtonText: 'Order!',reverseButtons: true,input: 'number',inputLabel: 'portion size: \n ‍',inputPlaceholder: 'Enter portion',inputAttributes: {
            min: 1,max: 20,step: 1
        },inputValue: 1,}).then((result) => {
  if (result.isConfirmed) {
    Swal.fire({
      title: 'Your order has taken!',text: 'Your order of ${numberinput} portions is being prepared',icon: 'success',confirmButtonText: 'OK!'
    })
  } else if (result.isdismissed)
      Swal.fire({
        title: 'Abandoned!',text: 'Your order of ${numberinput} servings has been abandoned',icon: 'error',confirmButtonText: 'OK!'
        })
})
}

这不起作用，有一个 swal2 示例：

const ipAPI = '//api.ipify.org?format=json'

const inputValue = fetch(ipAPI)
  .then(response => response.json())
  .then(data => data.ip)

const { value: ipAddress } = await Swal.fire({
  title: 'Enter your IP address',input: 'text',inputLabel: 'Your IP address',inputValue: inputValue,inputValidator: (value) => {
    if (!value) {
      return 'You need to write something!'
    }
  }
})

if (ipAddress) {
  Swal.fire(`Your IP address is ${ipAddress}`)
}

我想问题是我没有写 if (numberinput) 但我不知道我怎么能写 if(number) 和 if(result.isConfirmed)/if(result.isdismissed) 一起。有人可以帮我吗？我尝试了很多东西，但都失败了。

解决方法

在使用 .then() 时不应使用 await。 await 将返回 Swal.fire() 的结果，然后您可以编写普通的同步代码来使用该结果。这将允许您使用从该结果分配的变量。

async function order(id) {
  const {
    value: numberinput,isConfirmed,isDismissed
  } = await Swal.fire({
    title: 'You are ordering ' + id + ' are you sure?',text: 'When you press the "Order!" button,your order will be processed.',icon: 'warning',showCancelButton: true,cancelButtonColor: '#d33',confirmButtonColor: '#3bc42b',cancelButtonText: 'Cancel',confirmButtonText: 'Order!',reverseButtons: true,input: 'number',inputLabel: 'portion size: \n ‍',inputPlaceholder: 'Enter portion',inputAttributes: {
      min: 1,max: 20,step: 1
    },inputValue: 1,})

  if (isConfirmed) {
    Swal.fire({
      title: 'Your order has taken!',text: `Your order of ${numberinput} portions is being prepared`,icon: 'success',confirmButtonText: 'OK!'
    })
  } else if (isDismissed) {
    Swal.fire({
      title: 'Abandoned!',text: `Your order has been abandoned`,icon: 'error',confirmButtonText: 'OK!'
    })
  }
}

order(123);

<script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>