![](https://img-blog.csdnimg.cn/20201014180756913.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
微信小程序
chunchun1230
这个作者很懒,什么都没留下…
展开
-
微信小程序怎么获取当前页面的url
使用getCurrentPages可以获取当前加载中所有的页面对象的一个数组,数组最后一个就是当前页面。var pages = getCurrentPages() //获取加载的页面var currentPage = pages[pages.length-1] //获取当前页面的对象var url = currentPage.route //当前页面urlvar options = currentPage.options //如果要获取url中所带的参数可以查看op.转载 2020-09-04 13:15:44 · 4577 阅读 · 0 评论 -
微信小程序,计算时分秒时间差
shijiancha: function (faultDate, completeTime) {var stime = Date.parse(new Date(faultDate));var etime = Date.parse(new Date(completeTime));var usedTime = etime - stime; //两个时间戳相差的毫秒数var days = Math.floor(usedTime / (24 * 3600 * 1000));//计算出小时数.转载 2020-07-02 16:12:36 · 11474 阅读 · 3 评论 -
微信小程序文件预览源码(实用--打开pdf)
微信小程序的文件预览微信小程序的文件预览需要先使用wx.downloadFile下载文件,然后使用下载文件的临时路径通过wx.openDocument进行文件的预览项目中,有的需要打开pdf 来阅读信息。就需要用小程序自带的api方法。wxml代码:<button bindtap='preview'>工作简历预览</button>js代码://简历预览preview: function() {varthat = this;...转载 2020-07-02 10:34:55 · 1793 阅读 · 0 评论 -
微信小程序-列表渲染、获取列表传递值
1.目的通过几个简单的例子,介绍如何实现列表渲染,及在列表中传递参数和跳转界面。2.列表渲染.wxml<view> <block wx:for="{{items}}" wx:for-item="item" wx:key="000" wx:for-index="index"> <view>{{index}}:{{it...转载 2020-03-24 08:36:16 · 2482 阅读 · 0 评论 -
微信小程序动态生成二维码
效果图如下:实现wxml<!-- 存放二维码的图片--><view class='container'> <image bindtap="previewImg" mode="scaleToFill" src="{{imagePath}}"></image></view><!-- 画布,用来画二维码...转载 2020-03-13 09:43:57 · 1310 阅读 · 0 评论 -
微信小程序之数据类型(array、Number)转换
数组转成字符串//index.js//获取应用实例const app = getApp()Page({ onLoad: function () { // 数组转成字符串 var ojbA,objB; ojbA = new Array("age",1993,3,12); objB = ojbA.join("~");// 按照~转成字符串。当然也...原创 2020-03-12 17:29:18 · 2724 阅读 · 0 评论 -
解决“微信小程序disabled属性不生效”的问题!
微信小程序中带disabled属性的表单组件有(点击可以进入官方文档):button,checkbox,input,picker,radio,slider,switch,textarea如果是固定禁用组件的话,直接放上disabled就好,简单粗暴,如: 1. 忽略值的情况:<button disabled>测试</button>2. 使用值的...原创 2020-03-10 12:26:03 · 4292 阅读 · 2 评论 -
微信小程序实现上传图片
wx.chooseImage({ count: 1, //即一张 sizeType: ['compressed'], // original 原图,compressed 压缩图,默认二者都有 sourceType: ['album', 'camera'], // album 从相册选图,camera 使用相机, success: functi...原创 2020-02-29 17:40:47 · 621 阅读 · 0 评论 -
微信小程序-截取时间字符串(显示年月日)
主要用到:substring(0, 10)js:var that = this wx.request({ url: 'https://xxxxx', headers: { 'Content-Type': 'application/json' }, method: 'GET', ...转载 2020-02-29 14:09:39 · 4326 阅读 · 1 评论 -
微信小程序实现点击图片放大预览
1.点击事件2.放大3.左右滑动查看上、下一张在绑定点击事件的时候我们需要同时获取到点击图片的url和这一组数据的ID(通过这个id从数据里面找到你点击的这一组数据然后从中取出这一组图片就可以了)wxml:<view class="weui-cells jindu_xinxi"> <view class="kh_title">留言时间轴&l...原创 2020-02-27 22:14:29 · 5416 阅读 · 1 评论 -
微信小程序-数组操作
Page({ data: { list:[{ id:1, name:'芒果', count:1 },{ id:2, name:'香蕉', count:6 }, }] }})向前插入数据//要增加的数组var newa...转载 2020-02-27 20:53:35 · 2128 阅读 · 0 评论 -
微信小程序上传单张或多张图片
wxml:<!-- 上传作品 --><view class='upload-works' style='height:{{screenHeight}}px' wx:if="{{isUpWork}}"> <view class='work-box'> <view class='works-tit'>图片上传:</v...转载 2020-02-27 20:37:26 · 694 阅读 · 0 评论 -
微信小程序对象与字符串互转
对象转字符串var str = JSON.stringify(weather);字符串转对象var weatherObj = JSON.parse(str);原创 2020-02-26 22:04:11 · 5831 阅读 · 0 评论 -
微信小程序之登录页并存储用户
效果图:login.wxml:<!--pages/login/login.wxml--><view class="container"> <view class="login-icon"> <image class="login-img" src="/images/logo.png"></image&...转载 2020-02-26 20:40:33 · 1383 阅读 · 0 评论 -
微信小程序中字符串转JSON
当我们在小程序中,使用wx.request(),执行网络请求的接口的时候,如果遇到服务器返回的数据不是json类型的时候,就可以利用JSON.parse(res.data),转化为JSON对象如:for (let i = 0; i < upimgs.length; i++) { wx.uploadFile({ url: url地址, me...原创 2020-02-26 19:15:04 · 2864 阅读 · 0 评论 -
页面之间跳转使用 navigator标签,wx.navigateTo ,wx.redirectTo
1、URL就是跳转的页面路径.上面代码中就是navigator目录下的navigator页面,title是参数。navigator下redirect属性是值在当前页打开.如果不加redirect就是跳转到新页面.都可以携带参数。如果需要传多个参数, 用 & 链接即可<navigator url="../navigator/navigator?title=我是navigat...转载 2020-02-26 16:19:42 · 1253 阅读 · 0 评论 -
微信小程序获取复选框checkbox选中的值
wxml:<checkbox-group bindchange="checkboxChange"> <label class="weui-cell weui-check__label" wx:for="{{checkboxItems}}" wx:key="value"> <checkbox ...原创 2020-02-26 16:10:00 · 13199 阅读 · 0 评论 -
微信小程序:点击图片进行预览
wxml:<view class='index_showpic'> <view class='li_pic' wx:for="{{imgArr}}" wx:key='index'> <image src='https://{{item}}' bindtap='previewImg' data-src='{{item}}' class=...转载 2020-02-25 15:05:32 · 453 阅读 · 0 评论 -
微信小程序动态获取当前时间显示到页面
index/index.wxml<!--index.wxml--><view class="container"> <!-- 建立按钮,为按钮绑定函数 --> <button bindtap="getTime">点击获取当前时间</button> <!-- wx:if判断是否存在 --> <tex...原创 2020-02-25 15:01:28 · 1716 阅读 · 0 评论 -
wx.getLocation 获取当前位置
微信小程序获取当前地理位置使用wx.getLocation 方法,但是需要注意的使用这个别忘记申请权限需要在app.json 中添加permission ,如下 "permission": { "scope.userLocation": { "desc": "你的位置信息将用于小程序位置接口的效果展示" } }, "sitemapLocation...转载 2020-02-24 21:37:53 · 11145 阅读 · 1 评论 -
微信小程序使用三目运算
在微信小程序中判断条件太多,可以使用三目运算符来进行如:{{item.role==-1?‘伙伴’:(item.role== 0?‘家长’:(item.role== 1?‘教工’:(item.role== 2?‘教师’:(item.role==3?‘校长’:’’))))}}如: <text >{{(topic.tab=="ask")?"问答":((topic.tab=...原创 2020-02-21 14:27:00 · 5221 阅读 · 0 评论 -
微信小程序点击列表的每一项传递参数进入列表的详情页
列表代码:<block wx:for="{{taskdjs}}"> <view class="weui-cells list_item" bindtap="gotorepair" data-id="{{item.ID}}"> <view class="weui-cell weui-cell_access" hover...原创 2020-02-21 10:44:27 · 2422 阅读 · 0 评论 -
微信小程序之登录页-------实例
login.wxml:<!--pages/login/login.wxml--><view class="container"> <view class="login-icon"> <image class="login-img" src="/images/logo.png"></image> &l...原创 2020-02-19 15:53:41 · 1256 阅读 · 0 评论 -
微信小程序之滚动选择器(时间日期选择器)
微信小程序自己封装了很多控件,用起来确实很方便,如果这是Android里面,还需要自己去定义,不废话,效果图:一起来看看怎么实现的呢?看完你应该就该说,尼玛,这就行啦….这个效果呢,要用到picker组件,动画从底部弹起的滚动选择器,现支持三种选择器,通过mode来区分,分别是普通选择器,时间选择器,日期选择器,默认是普通选择器。看下相应的属性:具体的来看看代...转载 2020-01-09 13:14:52 · 930 阅读 · 0 评论 -
微信小程序之物流状态时间轴
(一)实现效果(三)实现代码1、wxml代码:<view class='g_con'> <view class='topExpress'> <view class='topExpress-left'> <image src='/images/Exchange_goods_map_1.png' style='...转载 2020-01-09 11:28:01 · 698 阅读 · 0 评论 -
微信小程序——时间轴的实现
做起来其实很简单:一个时间轴包括一个圆圈(css实现圆圈或者找一个圆圈图片)+一条线(css实现直线或者找一个直线的图片)+内容来看我的代码(代码很不规范,请忽略):wxml<view class='weui-cell-third'> <view class="page__title"> <image class='page-image...转载 2020-01-09 11:21:50 · 1946 阅读 · 1 评论 -
微信小程序 获取元素高度(获取元素节点信息)
1.如果高度要px单位的话:let query = wx.createSelectorQuery();query.select('.content').boundingClientRect(rect=>{ let height = rect.height; console.log(height);}).exec();2.如果高度要rpx单位的话,那么可以用宽高比换算获得...转载 2020-01-07 15:51:11 · 10966 阅读 · 1 评论 -
微信小程序之授权登录(附完整源码)
微信小程序之授权登录一、前言由于微信官方修改了 getUserInfo 接口,所以现在无法实现一进入微信小程序就弹出授权窗口,只能通过 button 去触发。官方连接:https://developers.weixin.qq.com/community/develop/doc/0000a26e1aca6012e896a517556c01二、实现思路自己写一个微信授权登录页...转载 2019-12-19 11:12:35 · 2019 阅读 · 0 评论 -
小程序请求接口统一封装到一个JS文件中
在我们做小程序时,数据请求数据请求是避免不了的,然而我们用官方自带的请求方式,会给我们带来很多重复的工作,所以我就借鉴大神们的博客,写了一个简单的请求方式。1.首先我们在utils中新建一个api.js文件,将一下代码粘贴进去:const host ='http://localhost:8081/activity/web/loginFrom/';//这个是你们的接口域名const ap...转载 2019-12-17 09:48:49 · 444 阅读 · 0 评论 -
js判断对象数组中是否存在某个对象
1. 如果要判断数组中是否存在某个元素的话很好判断,直接用数组的indexOf方法就好,存在返回当前索引不存在返回-1var arr=[1,2,3,4]arr.indexOf(3) // 2arr.inde2. 要只是判断的话是可以遍历后判断对象的属性是否相同的,像这种:arr.forEach(item=>{ if(item.name=='Alex'){ ...转载 2019-12-16 13:19:24 · 664 阅读 · 0 评论 -
微信小程序页面跳转参数传递
可以使用标签直接传递 <navigator class="gotoDetail" target="self" url="../detail/detail?vedioSrc={{item.videoSrc}}"></navigator> 然后在跳转到的页面onLoad钩子函数中 使用options接受参数 onLoad: function (options) ...转载 2019-12-16 08:47:00 · 221 阅读 · 0 评论 -
微信小程序之列表渲染后跳转详情页面(页面跳转带参数 和 js获取参数)
1.列表页面样式:<view class="table"> <block wx:for="{{staffList}}" wx:key="{{index}}"> <view class="tr" bindtap="onStaffDetail" data-index='{{index}}'> <view class="...转载 2019-12-12 16:33:27 · 943 阅读 · 1 评论 -
微信小程序app.js onLaunch异步,首页onLoad先执行
本来按照事件顺序,小程序初始化时触发App里的onLaunch,后面再执行页面Page里的onLoad,但是在onLaunch里请求授权信息本就为异步执行,等待返回值的时候Page里的onLoad事件就已经执行了。app.js 代码//app.jsApp({ onLaunch: function () { console.log('onLaunch'); wx.r...转载 2019-12-12 09:01:25 · 6651 阅读 · 4 评论 -
微信小程序sessionId不一致问题
前言:在做微信小程序时候出现了明明微信小程序已经登录授权了,但是在此请求验证的seesion是不是过期的时候,却拿不到对应的sessionId。每次请求接口的时候总是显示未登录,刚开始也是一头雾水,通过百度查资料才知道,原来是微信搞的鬼:我们如果想访问我们自己的后台的数据就必须先经过微信的服务器,微信服务器在中间卡了一个坎。Http本来就是无状态的超文本传输协议,我们自己写的后台用...转载 2019-12-11 11:48:42 · 828 阅读 · 0 评论 -
微信小程序用户授权,以及判断登录是否过期的方法
初始界面:判断用户是否过期(如果未过期则重新登录):获取用户信息:获取用户的信息并在前台显示:主要实现两个功能:①判断登录是否过期,如果过期则就重新登录,如果没过期就提示未过期②获取用户的信息,并在前台显示index.wxml? 1 2 3 4 5 6 7 ...转载 2019-12-11 08:48:17 · 6558 阅读 · 2 评论 -
微信小程序app.js给全局变量globalData赋值
微信小程序app.js 中,从数据库读取登录数据后,想把登录信息变为全局遍历,这里为globalData赋值和其他的页面赋值不同。需要先定义 that=this 之后用that.globalData进行赋值onLaunch: function() { var that = this; wx.request({ url: 'http://www.test.ph...转载 2019-12-10 15:43:11 · 4960 阅读 · 0 评论 -
微信小程序app.js中设置公有变量
初始化GlobalData在App.js的最上方可以设置GlobalData的初始值。App({globalData:{appid: '1wqas2342dasaqwe232342xxxxxxxxxx',//appid需自己提供,此处的appid我随机编写secret: 'e0dassdadef2424234209bwXXXXXXXXXXXXXX',//secret需自己提供,此处...转载 2019-12-10 15:27:38 · 447 阅读 · 0 评论 -
微信小程序笔记——小程序movable-view实现左滑删除功能
一:前言movable-view(点击查看官方文档)左滑的元素高度需要是固定的,因为movable-view要求必须设置width和height;效果图:wxml:js:wxss:...转载 2019-12-06 09:26:39 · 658 阅读 · 0 评论 -
微信小程序获取用户openid
1、wx.login(OBJECT)调用接口获取登录凭证(code)进而换取用户登录态信息,包括用户的唯一标识(openid) 及本次登录的 会话密钥(session_key)。用户数据的加解密通讯需要依赖会话密钥完成。2、code 换取 session_key 这是一个 HTTPS 接口,开发者服务器使用登录凭证 code 获取 session_key 和 openid。其...转载 2019-12-04 09:04:21 · 273 阅读 · 0 评论 -
微信小程序获取openid
微信小程序获取openid,理论就不多说了,直接上代码。在这里我是直接调用的官方所提供的http接口。https://api.weixin.qq.com/sns/jscode2session?appid=APPID&secret=SECRET&js_code=JSCODE&grant_type=authorization_code控制台输出如图所示:第一个r...原创 2019-12-03 16:00:37 · 94 阅读 · 0 评论