微信小程序之界面交互反馈

交互反馈就是在用户出发某事件之后,给用户一个反馈信息,这要是一个很友好的习惯。

在小程序中是通过一下几种方式实现的:

1.wx.showToast()方法

showToast: function (postscollected, postcollected) {
    wx.setStorageSync("posts_collected", postscollected);
        //跟新数据绑定变量,从而且还图片
        this.setData({
        collected: postcollected
    })
        //这里调用了wx.showToast()方法  
    wx.showToast({
        title: postcollected?"收藏成功":"取消收藏",
        duration:2000,
        icon:"success",
    })
}, 

实现效果如图:

微信小程序之界面交互反馈

再次点击收藏按钮:

微信小程序之界面交互反馈

2.wx.showModal()方法

showModal: function (postscollected,postcollected){
var that = this
    //这里调用了wx.showModal()方法
wx.showModal({
    title: ‘收藏‘,
    content:postcollected?‘是否收藏该篇内容?‘:‘取消收藏该文章?‘,
    showCancel: "true",
    cancelText: "取消",
    confirmText: "确定",
    success:function(res){
        if(res.confirm){
            wx.setStorageSync("posts_collected", postscollected);
            //跟新数据绑定变量
            that.setData({
                collected: postcollected
            })
        }
    }
})                

不同状态之下点击收藏按钮出现如下效果:

微信小程序之界面交互反馈

收藏以后点击按钮:

微信小程序之界面交互反馈

原网址:https://blog.****.net/qq_40876689/article/details/80034886

微信小程序之界面交互反馈

上一篇:websocket 心跳及重连


下一篇:小程序-demo:快速开始