微信小程序之确认框实现
效果图如下:

核心代码如下:
delType:function(e){
var typeId = e.currentTarget.dataset['id'];
console.log("delete:"+typeId)
wx.showModal({
title: '提示',
content: '确认要删除该支出类型?',
success: function (res) {
if (res.confirm) {
console.log('用户点击确定')
wx.request({
url: getApp().globalData.urlPath + "spendingType/delete",
method: "POST",
data: {
typeId: typeId
},
header: {
"Content-Type": "application/x-www-form-urlencoded"
},
success: function (res) {
console.log(res.data.code);
if (res.statusCode == ) {
//访问正常
if (res.data.code == "") {
wx.showToast({
title: "删除成功,返回支出类型列表",
icon: 'success',
duration: ,
success: function () {
wx.navigateTo({
url: '../type/type'
})
}
})
}
} else {
wx.showLoading({
title: '系统异常',
fail
})
setTimeout(function () {
wx.hideLoading()
}, )
}
}
})
} else if (res.cancel) {
console.log('用户点击取消')
}
}
})
}
wxml代码如下:
<text bindtap='delType' data-id="{{item.typeId}}">删除</text>
data-id相当于绑定对应的值,比方说你是根据id来删除对应的数据。
bindtap,即绑定事件。
微信小程序之确认框实现的更多相关文章
- 关于微信小程序 modal弹框组件的介绍
微信小程序 modal: 这里对微信小程序中 modal组件进行详细解析,我想开发微信小程序的小伙伴可以用到,这里小编就记录下modal的知识要点. modal modal类似于javascript中 ...
- 微信小程序下拉框
微信小程序里没有和HTML里的下拉框一样的组件,想要相同的效果只能自己写一个,先看效果 下面来看一下代码: 首先WXML <view class='select_box'> <vie ...
- 微信小程序-修改单选框和复选框大小的方法
方法有两种: 一:采用css的zoom属性 zoom缩放会将元素保持在左上角,并且会有毛边,可能会稍稍改变元素原来的形状. 二:采用css3的transform:scale属性 zoom缩放会将元素保 ...
- 【组件】微信小程序input搜索框的实现
开发小程序的过程,是一个学习知识,解决问题的过程,每当实现了一个需求,总会有很大的成就感,每天记录一个开发过程中的细节.实现效果如下: 官方参考链接:https://developers.weixin ...
- 微信小程序开发——文本框种输入手机号,点击获取验证码无反应的处理方法
异常描述: 如下图,输入手机号码之后,点击右侧的获取验证码,在开发工具是OK的,真机测试无反应: 页面编码跟H5差不多的,H5没出现这个问题,但是小程序就不一样了. 异常分析: 页面结构层面,为了方便 ...
- 微信小程序下拉框实现
小程序中是没有直接的下拉框标签可以使用的,所以下拉框需要手动写,或者使用框架 因为考虑到下拉框展开的时候,可能需要遮挡住其余的样式,这里就用的cover-view标签.(不考虑遮挡的可以换成普通的vi ...
- 微信小程序底部弹框动画
在写小程序的时候,一般会碰到底部弹出动画,就像下面这样的效果 直接进入正题 https://mp.weixin.qq.com/debug/wxadoc/dev/api/api-animation.ht ...
- 微信小程序之----弹框组件modal
modal modal类似于javascript中的confirm弹框,默认情况下是一个带有确认取消的弹框,不过点击取消后弹框不会自动隐藏,需要通过触发事件调用函数来控制hidden属性. 官方文档 ...
- 微信小程序 --- model弹框
model弹框:在屏幕中间弹出,让你进行选择: 效果: 代码: <button type="primary" bindtap="btnclick"> ...
随机推荐
- linux上安装redis-单机版
1. Redis的安装 1.1. Redis的安装 Redis是c语言开发的. 安装redis需要c语言的编译环境.如果没有gcc需要在线安装.yum install gcc-c++ 安装步骤: 第一 ...
- nginx反向代理前后端分离项目(后端多台)
目前软件架构都比较流行前后端分离,前后端的分离也实现了前后端架构的分离,带来的好处 —— 整个项目的开发权重往前移,实现真正的前后端解耦,动态资源和静态资源分离,提高了性能和扩展性. 通常Spring ...
- 前端框架 Vue.js 概述
Vue.js 是什么 图片 Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架.与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用.Vue 的核心库只关注视 ...
- 部署GitLab时, 问题
1. 开启防火墙可能会对 nginx 造成影响. 2. 安装 gitlab 会自带一个 nginx, 启动后会对 现有的nginx 造成影响, 解决方案 参考 连接 1
- Pthon魔术方法(Magic Methods)-运算符重载
Pthon魔术方法(Magic Methods)-运算符重载 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.Python运算符对应的魔术方法 1>.比较运算符 <: ...
- Apache:编译和安装
1.在Fedora / CentOS / Red Hat Enterprise Linux上安装 sudo yum install httpd sudo systemctl enable httpd ...
- 在vps中搭建ftp服务器
1. 服务器配置 首先当然是更新源列表并安装 vsftpd. sudo apt-get update sudo apt-get install vsftpd 安装完成后我们需要对服务器进行进一步的配置 ...
- Welcome to GnuPG 2.2
Welcome to GnuPG 2.2 Installation Instructions Double click the Install package to install GnuPG 2.2 ...
- Unity进阶之ET网络游戏开发框架 07-修正游客登录的异步BUG
版权申明: 本文原创首发于以下网站: 博客园『优梦创客』的空间:https://www.cnblogs.com/raymondking123 优梦创客的官方博客:https://91make.top ...
- ReentrantReadWriteLock中的锁降级
锁降级指的是写锁降级为读锁. 因为读锁与读锁之间不互斥,如果是写锁与读锁或者是写锁与写锁就会互斥,所以由写锁变为读锁就降级了. 如果当前线程拥有写锁,然后将其释放,最后再获取读锁,这种并不能称之为锁降 ...