簡體   English   中英

如何使用后退按鈕添加自定義隊列

[英]How to add custom queues with back button

我正在查看 SweetAlert2 的文檔示例,它生成一個帶有步驟的窗口並包含返回按鈕。

我找不到根據需要配置不同隊列的方法。 根據文檔,可以使用 .queue() 對其進行配置,但它對我不起作用。

有誰知道怎么做?

 const steps = ['1', '2', '3'] const swalQueueStep = Swal.mixin({ confirmButtonText: 'Forward', cancelButtonText: 'Back', progressSteps: steps, input: 'text', inputAttributes: { required: true }, reverseButtons: true, validationMessage: 'This field is required' }) async function backAndForth () { const values = [] let currentStep for (currentStep = 0; currentStep < steps.length;) { const result = await swalQueueStep.fire({ title: 'Question ' + steps[currentStep], inputValue: values[currentStep], showCancelButton: currentStep > 0, currentProgressStep: currentStep }) if (result.value) { values[currentStep] = result.value currentStep++ } else if (result.dismiss === 'cancel') { currentStep-- } else { break } } if (currentStep === steps.length) { Swal.fire(JSON.stringify(values)) } } backAndForth()
 <script src="https://cdn.jsdelivr.net/npm/sweetalert2@9"></script>

const steps = ['1', '2', '3']
const swalQueueStep = Swal.mixin({
    confirmButtonText: 'Forward',
    cancelButtonText: 'Back',
    progressSteps: steps,
    input: 'text',
    inputAttributes: {
        required: true
    },
    reverseButtons: true,
    validationMessage: 'This field is required'
})
async function backAndForth() {
    const values = []
    let currentStep
    for (currentStep = 0; currentStep < steps.length;) {
        if (steps[currentStep] == 1) {
            var result = await swalQueueStep.fire({
                title: 'Question .' + steps[currentStep],
                inputValue: values[currentStep],
                showCancelButton: currentStep > 0,
                currentProgressStep: currentStep
            })
        } else if (steps[currentStep] == 2) {
            var result = await swalQueueStep.fire({
                title: 'Question ..' + steps[currentStep],
                inputValue: values[currentStep],
                showCancelButton: currentStep > 0,
                currentProgressStep: currentStep
            })
        } else if (steps[currentStep] == 3) {
            var result = await swalQueueStep.fire({
                title: 'Question ...' + steps[currentStep],
                inputValue: values[currentStep],
                showCancelButton: currentStep > 0,
                currentProgressStep: currentStep
            })
        } else {
            break
        }
        if (result.value) {
            values[currentStep] = result.value
            currentStep++
        } else if (result.dismiss === 'cancel') {
            currentStep--
        } else {
            break
        }

        if (currentStep === steps.length) {
            Swal.fire(JSON.stringify(values))
        }
    }
}
backAndForth();

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM