SweetAlert 2 掩码输入

Question

我正在使用 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({
              标题：“谢谢你！”，
              确认按钮文本：“可爱！”
            })
          }
        })
      }

      使成为（） {

        返回 （
          
            新的
          
        ）；
      }
    }

    导出默认的NewTask；



    

我不知道如何控制这个。感谢您的帮助

Answer 1

我知道已经过去三个月了，但我希望我仍然可以帮助你。

我刚刚遇到这个问题并搜索答案但没有得到任何解决方案，所以我使用这种方法来实现我想要的：

swal.fire({
    text: 'myText',
    input: 'text',
    inputAttributes: {
        id: 'myInput'
    },
    onOpen: function(el) {
        var container = $(el);
        container.find('#myInput').mask('$ 0000.00');
    }

该解决方案使用 Jquery 的 Mask 插件（您可以在此处查看文档）和onOpenSweetAlert2 的属性。在 处onOpen，您可以传递一个函数来获取 swal 容器，使用 JQuery 通过 id 查找输入，并使用.mask()您要求的掩码调用该方法。

在 Jquery's Mask Plugin 官方网站上您可以看到更多遮罩示例。

下午好！