大佬教程收集整理的这篇文章主要介绍了有没有办法在Sweetalert,Reactjs中添加带有输入字段的取消按钮,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
我正在尝试在 ReactJs 中创建一个 Swal 警报,该警报必须包含一个带有继续和取消按钮的输入字段。这是我现在的代码:
swal({
icon: "warning",text: 'Are you sure you want to conTinue? This operation is not reversible',content: {
element: "input",attributes: {
placeholder: title + " reason",},}).then(comment => {
if (comment === null || comment === ''){
swal({icon: 'error',text: 'You need to type the cancellation reason'});
return false
}
})
此代码仅创建了一个“确定”按钮,我在 comment 变量中获得了用户的输入,但我需要添加一个“继续”按钮和一个“取消”按钮才能离开警报。我尝试在 swal 选项中添加 button 参数,这会创建按钮,但我无法从用户那里获得输入。
我还尝试在内容中添加原始 HTML 并使用 handle 方法获取输入,但到目前为止我还没有做到这一点。
也许这个解决方案很简单,但我无法得到它。非常感谢帮助
我找到了解决这个问题的方法,以防万一有人不得不做类似的事情。我刚刚通过执行 document.createElement('input') 创建了输入,然后我根据用户点击了继续或取消获得了值:
const cancellation_reason = document.createElement('input');
swal({
icon: "warning",text: 'Are you sure you want to conTinue? This operation is not reversible',content: {
element: cancellation_input,attributes: {
placeholder: title + " reason",},buttons: {
conTinue: 'conTinue',cancel: 'cancel'
}
}).then(option => {
switch (option){
case 'conTinue':
if (cancellation_input.value === null || cancellation_input.value === ''){
swal({icon: 'error',text: 'You need to type the cancellation reason'});
return false
}
prop(runID,null,path,cancellation_input.value).then(showMesaggE);
break;
case 'cancel':
break;
}
})
以上是大佬教程为你收集整理的有没有办法在Sweetalert,Reactjs中添加带有输入字段的取消按钮全部内容,希望文章能够帮你解决有没有办法在Sweetalert,Reactjs中添加带有输入字段的取消按钮所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。