小程序的弹窗效果

以下各项OBJECT参数说明详见官方文档-弹窗

1、wx.showToast(OBJECT)

显示消息提示框
示例代码：

wx.showToast({
  //提示内容
  title: '成功',
  //提示图标样式：success/loading
  icon: 'success',
  //提示显示时间
  duration: 2000
})

success效果：

loading效果：

---

2、wx.hideToast()

隐藏消息提示框

wx.showToast({
    title: '没有更多内容了了！',
    icon: 'loading',
    duration: 10000
})
//提示窗会在2秒后关闭
setTimeout(function(){
    wx.hideToast()
},2000)

---

3、wx.showModal(OBJECT)

​显示模态弹窗

代码：

wx.showModal({
    //提示标题
    title:'网络提示',
    //提示内容
    content:'当前不在wifi网络环境，确定要继续吗？',
    //是否显示取消按钮，默认true
    showCancel:true,
    //取消按钮文字，默认'取消'
    cancleText:'取消',
    //取消按钮文字颜色，默认'#000000'
    cancelColor:'#000000',
    //确认按钮文字,默认'确认'
    confirmText:'继续',
    //确认按钮文字颜色，默认'#3CC51F'
    confirmColor:'#3CC51F',
    //调用成功回调函数
    success:function(res){
        console.log(res);
        //点击确定按钮res内容: Object{errMsg: "showModal:ok", confirm: 1}
        //点击取消按钮res内容: Object{errMsg: "showModal:ok", confirm: 0}

    },
    //调用失败回调函数
    fail:function(){

    },
    //无论调用成功还是失败会执行的回调函数
    complete:function(){

    }
})

效果：

---

4、wx.showActionSheet(OBJECT)

​显示操作菜单

wx.showActionSheet({
    //按钮文字数组，最多6个
   itemList: ['我是第一个按钮', '咱是第二个按钮', '我是第三个按钮'],
    //按钮文字颜色，默认'#000000'
    itemColor:'#000000',
    //调用成功时的回调函数
    success: function(res) {
        //cancel:是否点击取消按钮
        if (!res.cancel) {
            //tapIndex:点击按钮，从上到下的顺序，从0开始
            console.log(res.tapIndex)
        }
    },
    //调用失败时的回调函数
    fail:function(){

    },
    //无论调用成功或者失败时的回调函数
    complete:function(){

    }
})

效果：