微信小程序之界面交互反馈
交互反馈就是在用户出发某事件之后,给用户一个反馈信息,这要是一个很友好的习惯。
在小程序中是通过一下几种方式实现的:
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.csdn.net/qq_40876689/article/details/80034886
微信小程序之界面交互反馈的更多相关文章
- 微信小程序:JS 交互逻辑
微信小程序:JS 交互逻辑 一.JS 交互逻辑 一个服务仅仅只有界面展示是不够的,还需要和用户做交互:响应用户的点击.获取用户的位置等等.在小程序里边,我们就通过编写 JS 脚本文件来处理用户的操作. ...
- 鸿蒙的远程交互组件应用及微信小程序的远程交互组件应用
注:鸿蒙的远程交互组件应用相对复杂 ,访问网络时,首先要配置网络权限,华为官方文档有问题,在此引用我老师配置的模板,见附件 过程:1.导入鸿蒙的网络请求模块fetch 2.发起对服务器的请求(在这过程 ...
- 微信小程序与webview交互实现支付
实现原理:点击h5网页的支付按钮——(跳转)——>嵌套改h5的小程序的支付页面——(处理支付)——>跳转至支付完成后的页面 注意:(1)网页h5中,引入微信的jssdk <scrip ...
- 微信小程序与Html交互
微信小程序与H5页面交互 https://www.jianshu.com/p/22e951d83841
- 微信小程序--ajax服务器交互及页面渲染
网上找的帖子大多是直接在onload中请求数据.而我想实现的是点击按钮,然后请求服务器,接着返回数据,前端页面渲染.所以搞了挺久的,在此记录一下. 请求是按照微信官方给出的,wx.request 在这 ...
- 微信小程序基础之交互操作控件
好久没有写关于微信小程序的文章了,今天简单的发表一篇,内容比较简单,包括:ActionSheet上拉菜单.AlertAction提示框.SuccessAction完成框.LoadingAction加载 ...
- 微信小程序-前后端交互
前台手机验证码登录 <view>手机号:</view> <input value="{{phone}}" bindinput="bindPh ...
- 微信小程序的界面下拉刷新
小程序的下拉刷新的值设置:需要设置app.json的window中 "navigationBarTextStyle":true
- 微信小程序--分享界面自定义图片
一般小程序页面都会大于等于1页,每个页面右上角都会有分享功能,建议把以下方法封装到app.js文件,在页面直接调用该方法,避免重复代码,提高性能.(代码用到ES6语法,若不支持,请自行还原js) // ...
随机推荐
- R语言实战(二) 创建数据集
2.1 数据集的概念 不同的行业对于数据集的行和列叫法不同.统计学家称它们为观测(observation)和变量(variable),数据库分析师则称其为记录(record)和字段(field),数据 ...
- 转:标签中的href如何调用js
在HTML中,<a>标签的href属性用于指定超链接的目标的URL.在所有浏览器中,链接的默认外观是: 未被访问的链接带有下划线而且是蓝色的 已被访问的链接带有下划线而且是紫色的 活动 ...
- python对接elasticsearch的基本操作
基本操作 #!/usr/bin/env python # -*- coding: utf-8 -*- # author tom from elasticsearch import Elasticsea ...
- [Visual Basic]冒泡排序及优化
冒泡排序 注意点 越界问题:i的边界是n-1,也就是说是对总共的第1~n个数进行排列(最后一个数处于被比较状态,不需要额外主动比较):j的初始值或最终值与当前i的值 有关题目中往往会改变i的值来考察, ...
- Java并发编程之CAS二源码追根溯源
Java并发编程之CAS二源码追根溯源 在上一篇文章中,我们知道了什么是CAS以及CAS的执行流程,在本篇文章中,我们将跟着源码一步一步的查看CAS最底层实现原理. 本篇是<凯哥(凯哥Java: ...
- tomcat源码分析01-启动过程概览
导读:tomcat是一个开源的web服务器,它实现了我们常用的Servlet,JSP,EL等相关规范,因为其性能稳定,开源等因素得到越来越多开发者的青睐,出于学习的目的,我决定研读其源码,并将阶段性成 ...
- 《Explaining and harnessing adversarial examples》 论文学习报告
<Explaining and harnessing adversarial examples> 论文学习报告 组员:裴建新 赖妍菱 周子玉 2020-03-27 1 背景 Sz ...
- 题解 P1002 【过河卒】
正文 简单描述一下题意: 士兵想要过河,他每一次可以往下走一格,也可以往右走一格,但马一步走到的地方是不能走的,问走到\(n\)行,\(m\)列有多少种走法 我们显然应该先根据马的位置将不能走的格子做 ...
- 使用VirtualBox 版本 6.1.2 r135662, 安装ubuntu18
VDI是VirtualBox的基本且独有的格式.目前应该还没有支持这种格式的其他软件. VMDK是专门为VMWare开发,但其他虚机像Sun xVM,QEMU,VirtualBox,SUSE Stud ...
- word2vec 和 glove 模型的区别
2019-09-09 15:36:13 问题描述:word2vec 和 glove 这两个生成 word embedding 的算法有什么区别. 问题求解: GloVe (global vectors ...