微信小程序-界面提示框和消息

井眼2024-06-18 22:09

一.Loading加载框

小程序提供了wx.showLoading用来在加载界面的时候使用，比如加载图片和数据的时候可以使用。

常常和wx.hideLoading()配合使用，否则加载框一直存在。

其效果如下：

代码如下：

复制代码

    //显示加载消息
    wx.showLoading({
      //提示内容不会换行，注意字数
      title: '数据加载...',
      //是否透明蒙层，防止触摸穿透
      mask:true
    })

        //关掉loading提示框，和showLoading连用
        wx.hideLoading()

二.模态对话框和消息提示框

模态对话框：wx.showModal 用来展示和用户的对话，比如是否删除，是否修改等。

消息提示框：wx.showToast 用来和模态对话框配合使用，比如删除成功，删除失败等。

模态对话框效果：

代码：

复制代码

    const {confirm} = await wx.showModal({
      title: '提示',
      content: '是否删除？'
      // complete: (res) => {
      //   if (res.cancel) {
          
      //   }
    
      //   if (res.confirm) {
          
      //   }
      // }
    })

消息对话框效果：

代码：

复制代码

      //显示消息提示框
       wx.showToast({
         title: '成功',
         icon:'none',
         duration:2000
       })