showModal
内置方式,功能有限,比如:输入内容不符合要求时,也会关闭当前窗口
不满足需求,用下面的 <uni-popup> 实现方式
官方文档:
https://uniapp.dcloud.net.cn/api/ui/prompt.html#showmodal
uni.showModal({
title:"文件夹名",
editable:true,
confirmText: "确定",
cancelText: "取消",
success: function (res) {
if (res.confirm) {
saveNoteType
}
}
})
popup实现方式
可以自定义窗口内容
例子
关键:
createFolderDialog后面不能有(),否则无法将输入内容传入该函数:before-close="true":必须通过代码关闭窗口。如果设置为false或不设置此项,点击按钮会自动关闭,导致 校验输入内容 失败后也会自动关闭窗口@close="closeFolderDialog":由于设置了:before-close="true",所以必须给 【关闭按钮】 增加 点击事件
<!-- 新建文件夹输入框 -->
<uni-popup ref="createFolderDialog" type="dialog">
<uni-popup-dialog mode="input" title="文件夹名"
@confirm="doCreateFolderDialog"
@close="closeFolderDialog"
:before-close="true"></uni-popup-dialog>
</uni-popup>
显示对话框:
this.$refs.createFolderDialog.open()
【关闭】按钮事件:
closeFolderDialog(){
this.$refs.createFolderDialog.close()
},
【确定】按钮事件:
// 形参 val 就是输入的内容
doCreateFolderDialog(val){
console.log("val:",val)
if(this.val === ""){
uni.showToast({
icon: 'none',
title: "请输入文件夹名"
})
return
}
// 必须手动关闭窗口
this.$refs.createFolderDialog.close()
},