
微信小程序
weixin_40333655
这个作者很懒,什么都没留下…
展开
-
编译后模拟器元素上方有一块空白区域,需要向上滑动才能看到下面的内容与屏幕上边框对齐。
这个问题在前端设计的时候很容易疏忽,导致手机调试显示的效果让人很郁闷,特此记录一下处理办法。在wxml的container对应的css文件中的container定义加入这行:/**app.wxss**/.container { padding: 0rpx; /* 加入这行就可以了,该属性是设置内边距的*/ height: 100%; display: flex; fle...原创 2019-03-26 15:58:37 · 260 阅读 · 0 评论 -
(八)小程序表单
转载https://www.cgtblog.com/wx/3308.htmlform表单,将组件内的用户输入的提交。当点击表单中formType为submit的组件时,会将表单组件中的value值进行提交,需要在表单组件下各组件上加上name属性来作为key。说明:①report-submit是否返回formId用于发送模板消息,例如:购买商品购买成功时会发送通知。②bindrese...转载 2019-05-16 11:56:04 · 765 阅读 · 0 评论 -
(九)物流查询的实现(参考学习下其列表显示)
转载http://baijiahao.baidu.com/s?id=1605114822981027176&wfr=spider&for=pchttp://baijiahao.baidu.com/s?id=1605204809130185991&wfr=spider&for=pc利用全国物流查询的小功能了解请求接口的使用。购买接口在开始程序之前,首先购买...转载 2019-05-16 16:26:20 · 899 阅读 · 0 评论 -
(十)登录实现以及获取用户信息及通过自己服务器进行授权登录和数据解密还有临时保存数据的一种写法
获取用户信息https://developers.weixin.qq.com/community/develop/doc/0000a26e1aca6012e896a517556c01wx.getUserInfo(Object object)开发者注意了!小程序获取「用户数据」方式更新,快去升级吧获取信息两种方式:1、使用 button 组件,并将 open-type 指定为 getUser...转载 2019-05-16 17:49:21 · 1917 阅读 · 0 评论 -
关于wx:for控制属性下的列表渲染(重要)
wx:for在组件上使用 wx:for 控制属性绑定一个数组,即可使用数组中各项的数据重复渲染该组件。默认数组的当前项的下标变量名默认为 index,数组当前项的变量名默认为 item<view wx:for="{{array}}">{{index}}: {{item.message}}</view>Page({ data: { array: [{ ...转载 2019-05-27 15:48:03 · 4231 阅读 · 0 评论 -
微信小程序 CSS 选择器::after和::before的简单使用(看看)
前言前两天看文档看到选择器那块儿的时候,前面4个基本都能理解:.class,#id,element,element, element,但后面两个::after和::before(文档中说,分别表示在view 组件的后面和前面插入内容),表示有点没有理解。于是上网仔细查了下。以下是笔记基本概念::before 用法:view::before,表示在该view组件的前面加入内容::after...转载 2019-05-27 17:48:29 · 13663 阅读 · 0 评论 -
微信小程序css篇----定位(position)
一.定位:position属性允许你对元素进行定位。二.定位机制:有三种:普通流,浮动流,绝对定位。三.定位属性值:static,relative,absolute,fixed,inherit,-ms-page,initial,unset(后面3个属性是小程序中有的,没看懂是什么样子)1.static:元素框正常生成,块级元素生成一个矩形框,作为文档流的一部分,行内元素则会创建一个或者多个行...转载 2019-05-27 17:51:09 · 571 阅读 · 0 评论 -
微信小程序开发——设置属性及样式选择器(重要)
代码示例1、属性设置xxx.wxml<view style='background-color:#DC143C;width:100%;height:30px;'>样式属性</view> <view style='background-color:#D8BFD8;width:100%;height:30px;'>背景属性</view>&l...转载 2019-05-27 17:54:04 · 5621 阅读 · 0 评论 -
微信小程序开发者自己服务器获取到openid和session_key 后生成登录态。并且登录态的有效性判断
微信小程序中做用户登录与登录态维护的实现详解让用户登录,标识用户和获取用户信息,以用户为核心提供服务,是大部分小程序都会做的事情。我们今天就来了解下在小程序中,如何做用户登录,以及如何去维护这个登录后的会话(Session)状态。下面来看看详细的介绍:小程序的登陆流程微信小程序的登陆涉及到的有三剑客有: 小程序客户端 微信服务器 自己的服务器下面我们就来逐步分解一下这个流程图:步骤一:在...转载 2019-05-23 17:52:32 · 12573 阅读 · 8 评论 -
微信小程序之变量作用域问题及定义当前页面的全局变量
文件作用域在javaScript文件中声明的变量和函数只在该文件中有效;不同的文件中可以生命相同的名字的变量和函数,不会相互影响。通过全局函数getApp() 可以获取全局的应用实列,如果需要全局的数据可以在app() 中设置,如://app.jsapp({ globalData:1})// a.js// The localValue can only be used in...转载 2019-06-05 12:01:33 · 5007 阅读 · 0 评论 -
JavaScript 函数声明的几种方法与作用域
1.函数声明和函数表达式有什么区别函数就是一段可以反复调用的代码块。函数还能接受输入的参数,不同的参数会返回不同的值。JavaScript有三种方法,可以声明一个函数。1.function命令function命令声明的代码区块,就是一个函数。function命令后面是函数名,函数名后面是一对圆括号,里面传入函数的参数。函数体放在大括号里面。function add(s) { co...转载 2019-06-05 15:36:07 · 398 阅读 · 0 评论 -
es6函数默认参数作用域
使用默认参数时,参数会形成一个独立的作用域,此作用域与函数体中的作用域是平行关系var x = 0;function foo(x, y = function(){ x = 2; console.log(x); }) { var x = 3; y(); console.log(x);}foo();console.log(x);es6代码直接复制到支持es6语法...转载 2019-06-05 15:44:25 · 142 阅读 · 0 评论 -
深入浅析var,let,const的异同点
一、let和var区别1.关于变量提升,var能变量提升,let不能// 关于var 如下所示console.log(a); //输出undefined,此时就是变量提升var a = 2; console.log(a); //2 //相当于下面的代码var a; //声明且初始化为undefinedconsole.log(a); //输出undefineda=2; /...转载 2019-06-05 16:57:32 · 189 阅读 · 0 评论 -
JS中for循环里面的闭包问题的原因及解决办法
我们先看一个正常的for循环,普通函数里面有一个for循环,for循环结束后最终返回结果数组function box(){ var arr = []; for(var i=0;i<5;i++){ arr[i] = i; } return arr;}//alert 输出一个弹出框alert(box()) ...转载 2019-06-05 17:06:38 · 3982 阅读 · 1 评论 -
小程序json字符串转JavaScript对象的方法
success: function (res) { console.log(res.data) var jsonStr= res.data; jsonStr = jsonStr.replace(" ",""); if(typeof jsonStr!= 'object'){ j...转载 2019-05-31 17:42:00 · 613 阅读 · 0 评论 -
微信小程序之多列表的显示和隐藏功能(附源码)
https://www.jianshu.com/p/d96a4ccbcce4转载 2019-05-31 17:42:39 · 2009 阅读 · 0 评论 -
通过wxs文件,动态改变前端特定字体颜色以及对wxs的详解和wxs中的几种数据类型(重要)
效果如图所示,点位状态根据是否故障改变颜色wxs文件 - utils-color.wxs 代码如下function fontColor(str){ var color = ""; if(str.indexOf("故障") >= 0) color = "red"; else color = "#999"; return color;}//导出wx...原创 2019-06-04 11:21:18 · 1147 阅读 · 0 评论 -
微信小程序免费SSL证书https、TLS版本问题的解决方案
微信小程序与第三方服务器通讯的域名5个必要条件1、一个已备案的域名,不是localhost、也不是127.0.0.1,域名不能加端口2、加ssl证书,也就是https://~~~4、HTTPS 服务器的 TLS 版本支持1.2及以下版本,一般就是1.0、1.1、1.2要同时支持这三个版本,一个也不能少,要不然就会出现下面这种情况5、微信小程序后台加上合法域名设置(一个月内改的次数是有限的,...转载 2019-05-16 10:52:11 · 3678 阅读 · 0 评论 -
(七)列表渲染
wx:for在组件上使用wx:for控制属性绑定一个数组,即可使用数组中各项的数据重复渲染该组件。默认数组的当前项的下标变量名默认为index,数组当前项的变量名默认为item。循环展示一个swiper(滑块视图容器)。①在界面层(wxml)中展示swiper(tst.wxml)以下仅展示内容作为示例,可以展示图片等,展示图片只需在swiper-item标签下添加image标签即可。...转载 2019-05-16 10:04:51 · 479 阅读 · 0 评论 -
(六)小程序设置及获取数据
一、组件text①在界面中显示text标签(tst.wxml,页面名称自定义)②编译预览注意:1. text标签中内容不能打回车,显示时,会把回车显示出来。③此时内容是静态的,设置交互层js文件中的data,在界面层显示在tst.js文件设置页面初始化数据data:在tst.wxml文件中显示数据:2. input1)input的用法①在界面中显示input标签,值...转载 2019-05-16 08:59:29 · 957 阅读 · 0 评论 -
微信小程序使用后台播放器播放音乐
首先在页的JSON配置项添加“requiredBackgroundModes” : [“autio”]如下图配置说明见链接配置好后台运行的音频后,可以在页的js文件的onHide或onShow添加上以下代码,实现后台播放音乐 onHide: function (){ //后台播放音乐 const backgroundAudioManager = wx.getBack...原创 2019-03-27 14:39:26 · 11587 阅读 · 2 评论 -
底部tab导航标签栏的设置
启用导航标签栏效果如下:启用的方法为:在根目录下的app.json配置文件内,添加"tabBar"配置项如下:图标路径为icon文件夹下,tabBar图标只支持本地路径。 "tabBar":{ "list":[ { "pagePath":"pages/audio/index", "text":"首页", "iconPa...原创 2019-03-27 14:49:16 · 1397 阅读 · 0 评论 -
map组件中经纬度信息通过wx.getLocation获取的方法
当前要获取用户的地理位置信息需要获取用户授权。获取授权的方法为:在页面JSON配置文件添加权限配置项 "permission": { "scope.userLocation": { "desc": "你的位置信息将用于小程序位置接口的效果展示" } },然后再页面wxml文件,添加map组件的引用 <map longitude="{{long}}...原创 2019-03-27 15:43:12 · 1203 阅读 · 0 评论 -
module,exports,require的模块化应用
首先看官方例程// 下面是写在逻辑文件common.js 内的function sayHello(name) { console.log(`Hello ${name} !`)}function sayGoodbye(name) { console.log(`Goodbye ${name} !`)}module.exports.sayHello = sayHelloexpor...原创 2019-03-29 10:44:17 · 476 阅读 · 0 评论 -
小程序的settimeout和setinterval
settimeout和setinterval()函数都属于定时任务,一。settimeout延迟一段时间执行函数,并且执行一次后自动停止该定时器。(不知道是不是这样理解)setTimeout(function(){console.log(“settimeout”)},4000)场景是我们可能希望一个任务隔一段时间后再执行。二。setinterval()函数是每隔一段时间便执行,如果想停止...转载 2019-03-29 10:52:57 · 1216 阅读 · 0 评论 -
微信小程序checkbox的排列方向
参考链接https://blog.youkuaiyun.com/wangshop_11/article/details/54236745关于微信小程序中的checkbox组件,需要在checkbox-grop包裹下,在添加一个标签来包裹,在不考虑排列放下的前提下默认排列是水平的module.jsPage({ data: { imageUrls: ['http://img02.tooopen....转载 2019-03-29 11:19:21 · 2115 阅读 · 1 评论 -
block并不是一个组件
注意: block并不是一个组件,它仅仅是一个包装元素,不会在页面中做任何渲染,只接受控制属性。https://developers.weixin.qq.com/miniprogram/dev/framework/view/wxml/conditional.html...原创 2019-03-29 11:37:49 · 495 阅读 · 0 评论 -
wx:if和hidden的消耗
原创 2019-03-29 11:39:43 · 175 阅读 · 0 评论 -
模板template的应用,和import、include的应用
template应用import、include应用原创 2019-03-29 11:44:09 · 589 阅读 · 0 评论 -
WXS的语法介绍
WXS(WeiXin Script)是小程序的一套脚本语言,结合 WXML,可以构建出页面的结构。WXS 与 JavaScript 是不同的语言,有自己的语法,并不和 JavaScript 一致。WXS 模块WXS 代码可以编写在 wxml 文件中的 标签内,或以 .wxs 为后缀名的文件内。模块每一个 .wxs 文件和 标签都是一个单独的模块。每个模块都有自己独立的作用域。即在一...原创 2019-03-29 13:59:45 · 9050 阅读 · 1 评论 -
(一)页面跳转的四种方法及页面跳转中相对路径问题
转载https://www.cnblogs.com/hrone/p/8067036.html首先页面跳转的相对路径中经常出现“…/”,例如“…/test/test”,这表示当前路径下test文件夹下的test.js页面逻辑。 触发跳转的页面与test文件夹处于同级,所以是当前页面下的test文件夹。wx.navigateTo({}) ,保留当前页面,跳转到应用内的某个页面,使用 wx.nav...原创 2019-05-15 10:06:48 · 17860 阅读 · 0 评论 -
(二)微信小程序注册页面 — 生命周期以及导航页面间参数传递
小程序还有很多组件,其他组件请自行学习。本篇文章讲解“ 注册页面——生命周期”。交互传参小程序交互时,直接在链接地址上将参数写上即可。①新建tst页面②为了方便,在index页面中添加跳转到tst页面的链接,并传参③编译预览注册页面——生命周期页面传参之后,需要接参,在小程序中用js进行交互接参。Page()函数用来注册一个页面。接受一个 object 参数,其指定页面的...转载 2019-05-15 10:33:40 · 358 阅读 · 0 评论 -
(三)微信小程序注册页面-页面事件处理函数
转载https://www.cgtblog.com/wx/3297.htmlhttp://www.4317.org/news/?3373.html1)onPullDownRefresh:下拉刷新监听用户下拉刷新事件。需要在app.json的window选项中或页面配置中开启enablePullDownRefresh。可以通过wx.startPullDownRefresh触发下拉刷新,调用...原创 2019-05-15 15:34:56 · 1670 阅读 · 0 评论 -
(四)小程序注册页面—初始化数据
初始化数据将作为页面的第一次渲染。data将会以JSON的形式由逻辑层传至渲染层,所以其数据必须是可以转成JSON的格式:字符串,数字,布尔值,对象,数组。例:初始化数据(tst.js文件)渲染层可以通过WXML对数据进行绑定。在WXML文件中对数据进行绑定的标签:{{ 数据 }}例:初始化数据在WXML中渲染绑定(tst.wxml文件)。编译预览:另一个例子:...转载 2019-05-15 15:50:31 · 1399 阅读 · 0 评论 -
微信小程序请求webapi调试抓包工具Fiddler以及wx.request请求webapi时web服务器端解析不到code问题
手机用fiddler抓包电脑最好是笔记本(我用的是台式电脑,分的局域网IP为192.168.1.130,手机连接的同一个网络下的WIFI),这样能和手机保持统一局域网内;其他不多说,直接说步骤了。一.对PC(笔记本)参数进行配置配置fiddler允许监听到https(fiddler默认只抓取http格式的)打开Fiddler菜单项Tools->TelerikFiddler Opt...原创 2019-05-20 17:57:45 · 5406 阅读 · 0 评论 -
(五)小程序事件
一、什么是事件?事件是视图层到逻辑层的通讯方式。事件可以将用户的行为反馈到逻辑层进行处理。事件可以绑定在组件上,当达到触发事件,就会执行逻辑层中对应的事件处理函数。事件对象可以携带额外信息,如id,dataset,touches。二、事件分类事件分为冒泡事件和非冒泡事件:1)冒泡事件:当一个组件上的事件被触发后,该事件会向父节点传递。2)非冒泡事件:当一个组件上的事件被触发后,该事...转载 2019-05-15 17:12:07 · 1211 阅读 · 0 评论 -
微信小程序wxss为输入框添加图标
使用background:url(), 因微信小程序不支持本地图标,所以将本地图片转成base64.图片转base64下面首先是wxss内容。.input-text {height:80rpx;margin: 0 auto;border: 1px solid #d2d2d2;background: url(data:image/png;base64,iVBORw0KGgoAAAA...原创 2019-08-16 09:49:24 · 2639 阅读 · 0 评论