JZTXT

uniapp自带的提示窗口

发布时间 2023-04-26 10:38:27作者: web格调
一、成功提示弹窗
uni.showToast({
　　title: '成功提示',
　　//将值设置为 success 或者直接不用写icon这个参数
　　icon: 'success',
　　//显示持续时间为 2秒
　　duration: 2000
})
二、加载提示弹窗
//前端数据请求时，显示加载提示弹框
uni.showLoading({
　　title: '加载中...'
});
// 数据从后端接口返回后，提示弹框关闭
uni.hideLoading();
三、确认框
uni.showModal({
    title: "提示",
    content: "确认删除该条信息吗？",
    success: function (res) {
       if (res.confirm) {
       // 执行确认后的操作
       } else {
       // 执行取消后的操作
       }
   },
});
四、删除二次确认
uni.showModal({
　　title: '提示',
　　// 提示文字
　　content: '确认删除该条信息吗？',
　　// 取消按钮的文字自定义
　　cancelText: "取消",
　　// 确认按钮的文字自定义
　　confirmText: "删除",
　　//删除字体的颜色
　　confirmColor:'red',
　　//取消字体的颜色
　　cancelColor:'#000000',
　　success: function(res) {
　　if (res.confirm) {
　　　　// 执行确认后的操作
　　}
　　else {
　　　　// 执行取消后的操作
　　}
　　}
})
五、选项提示
uni.showActionSheet({
    itemList: ['选项一', '选项二', '选项三'],
    // 字体颜色
    itemColor: "#55aaff",
    success (res) {
       // 选择其中任意一项后，获取其索引（res.tapIndex），从0开始
       console.log(res.tapIndex)
    },
    fail (res) {
       // 取消后的操作
    }
})
六、自定义图标
uni.showToast({
    title: '查询中',
    //图片位置
    image: '../../static/loading.gif',
    duration: 2000   
})