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

核心代码如下:
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"> ...
随机推荐
- 解决vue-cli项目开发中跨域问题
一.开发环境中跨域 使用 Vue-cli 创建的项目,开发地址是 localhost:8080,需要访问非本机上的接口http://10.1.0.34:8000/queryRole.不同域名之间的访问 ...
- JavaScript之控制表单元素的值
表单元素.value 获取表单元素的值 表单元素.value='这是修改后的值' 修改表单元素的值 案例: (1)html <input type="text" id=&qu ...
- Node.js 项目中解决 SQL 注入和 XSS 攻击
1.SQL 注入 SQL 注入,一般是通过把 SQL 命令插入到 Web 表单提交或输入域名或页面请求的查询字符串,最终达到欺骗服务器执行恶意的 SQL 命令. SQL 注入示例 在登录界面,后端会根 ...
- idea中log4j的简单使用
首先,我们需要建立一个 maven 项目 (如果你没有配置maven 请参考https://www.cnblogs.com/PerZhu/p/10714077.html配置) 接下来开始配置 pom. ...
- sqlserver数据,将一行某一列字符串的值用“_”分割分别填充到这一行的其他列
分割字符到列DECLARE @a VARCHAR(10)SET @a ='00G-2-1102'SELECT CHARINDEX('-',@a,CHARINDEX('-',@a))SELECT CHA ...
- jmeter bodydata参数传递
参见:接口测试, jmeter bodydata 传送的参数,在请求中显示为空 新增http header信息头:
- php审核流程详解
在公司运营中,人员的变动及请假.离职情况都很普遍,这就需要有一个管理系统来系统的做一套流程,可以提升工作效率节省时间.在流程中需要有顺序的进行提交审核,接下来我们做一套简单的新建流程以及提交审核的系统 ...
- js正则表达式验证、匹配数字、匹配字符串、匹配中文、匹配任意字符备忘录
本文转自:91博客 :原文地址:http://www.9191boke.com/235792704.html 正则表达式或“regex”用于匹配字符串的各个部分,下面是我创建正则表达式的备忘录.包括一 ...
- 《TensorFlow2深度学习》学习笔记(二)手动搭建并测试简单神经网络(附mnist.npz下载方式)
本实验使用了mnist.npz数据集,可以使用在线方式导入,但是我在下载过程中老是因为网络原因被打断,因此使用离线方式导入,离线包已传至github方便大家下载: https://github.com ...
- MSP430 LaunchPad开发板入门教程集合
MSP-EXP430G2开发板是德州仪器提供的开发工具,也称为LaunchPad,用于学习和练习如何使用其微控制器产品.该开发板属于MSP430 Value Line系列,我们可以对所有MSP430系 ...