我正在使用 Sweet Alert2 ( https://sweetalert2.github.io/ ) -react 组件,我需要在第二步用(千位分隔符和前缀 =“$”)屏蔽输入,这可能吗?
这里是一些代码
import React, { Component } from 'react'; import Swal from 'sweetalert2'; import { Fab } from '@material-ui/core'; import withReactContent from 'sweetalert2-react-content'; const reSwal = withReactContent(Swal); class NewTask extends Component { state = { goToProfile: false }; handleNewTask = async () => { reSwal.mixin({ input: 'text', confirmButtonText: 'Next →', showCancelButton: true, progressSteps: ['1', '2'] }).queue([ { title: 'Age', text: 'Your Age' }, { title: 'Budget', text: 'Your Budget', input: 'number', inputAttributes: { min: 100, max: 1000000 }, }, ]).then((result) => { if (result.value) { reSwal.fire({ title: 'thank u !', confirmButtonText: 'Lovely!' }) } }) } render() { return ( New ); } } export default NewTask;
我不知道如何控制它。感谢您的帮助
最佳答案
我知道已经过去三个月了,但我希望我还能帮到你。
我刚遇到这个问题,google了一下没有得到任何解决方案,所以我用这个方法来实现我想要的:
swal.fire({
text: 'myText',
input: 'text',
inputAttributes: {
id: 'myInput'
},
onOpen: function(el) {
var container = $(el);
container.find('#myInput').mask('$ 0000.00');
}
该解决方案使用 Jquery 的掩码插件 ( you can see the documentation here ) 和来自 SweetAlert2 的 onOpen
属性。
在 onOpen
处,您可以传递一个获取 swal 容器的函数,使用 JQuery 通过 id 查找输入并使用您要求的掩码调用 .mask()
方法。
在 Jquery's Mask Plugin 官方网站上你可以看到更多的掩码示例。
下午好!
关于reactjs - SweetAlert 2 掩码输入,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57319900/