微信小程序
文章平均质量分 63
偷轮子
这个作者很懒,什么都没留下…
展开
-
微信小程序知识点(中)
1.对象扩展运算符前面我们已经介绍过数组的拓展运算符,对象的扩展运算符 ...也有类型的作用,它可以取出对象里所有可遍历的属性,拷贝到新的对象中。为了可以看得更加清楚,我们可以进行打印对比:...原创 2021-01-19 13:40:53 · 688 阅读 · 0 评论 -
微信小程序自定义组件
一.什么是自定义组件类似于页面,自定义组件拥有自己的wxml模板和wxss样式,组件模板的写法与页面模板相同。组件模板与组件数据结合后生成的节点树,将被插入到组件的引用位置上。在组件模板中可以提供一个<slot>节点,用于承载组件引用时提供的子节点。二、如何编写自定义组件自定义组件和普通页面一样,都有wxml、wxss、json、js文件,不同的是对于自定义的组件,需要在json配置文件中声明为一个组件,另外在组件模板中可以提供一个slot节点,用于承载组件引用时提供...原创 2021-01-17 17:09:04 · 245 阅读 · 0 评论 -
NodeJS和JS的区别
nodejs 是一个平台 ,一个基于Chrome javascript 运行时建立的平台,它是对chrome V8引擎进行了封装的运行环境,简单说nodejs就是把浏览器的解释器封装起来作为服务器运行平台,用类似javascript的结构语法进行编程,在nodejs上运行。nodejs主要从事后台公共,可以系统操作,文件操作,网格系统,数据库操作,也可以建立http服务。nodejs 有个包管理工具 npm ,npm 是nodejs 编写的,npm下载的所有文件都会在一个交过node_modules 的原创 2021-01-16 17:05:29 · 1548 阅读 · 1 评论 -
微信小程序短信验证码登录
目前微信小程序短信验证码登录只支持企业小程序,留坑原创 2021-01-16 16:34:43 · 842 阅读 · 0 评论 -
让微信外的应用(短信、网页、邮件)跳转到小程序--scheme码
获取了小程序的scheme码,就可以像打开网页链接一样,通过短信、邮件、外部网页等微信以外的渠道拉起小程序,URL Scheme链接形式如weixin://dl/business/?t= *TICKET*。Scheme码的说明scheme码可以自定义进入的小程序的页面路径,也可以携带参数,还可以设置是永久有效还是到期失效(比如两小时内或7天内失效)。携带参数、设置有效时间以及场景值(通过URL Scheme打开小程序的场景值为1065),让我们可以使用Scheme码进行活动推广、渠道宣传、返利分享等转载 2021-01-16 16:06:48 · 6332 阅读 · 1 评论 -
通过flex布局实现横向纵向布局并使内容垂直居中
1.test.wxml<view class="content"> <view class="left"><view>left</view></view> <view class="middle">middle</view> <view class="right"> <view class="item">2</view> <view class="ite原创 2020-12-04 15:04:23 · 6033 阅读 · 1 评论 -
NodeJS回调地狱、promise形式和async/await形式对比
第一种回调地狱存在代码可读性低、编写费劲、容易出错等问题。第二种promise写法第三种async/await写法原创 2020-11-30 15:02:15 · 292 阅读 · 0 评论 -
微信小程序页面间传值
小程序传值的方式有正向传值和反向传值正向传值:上一页面 --> 下一页面 url 传值 本地储存 全局的 app 对象反向传值:下一页面 --> 上一页面本地储存 全局的 app 对象一、正向传值url 传值A页面代码// 点击列表clickReleaseItem: function (e) { var release = e.currentTarget.dataset.para; wx.navigateTo({ url: '../../转载 2020-09-23 14:08:34 · 306 阅读 · 0 评论 -
微信小程序NPM使用及第三方依赖安装详解
一、NPM1.1NPM介绍首先我们介绍NPM的使用,NPM是随同NodeJS一起安装的包管理工具,能解决NodeJS代码部署上的很多问题,常见的使用场景有以下几种:允许用户从NPM服务器下载别人编写的第三方包到本地使用(安装第三方依赖过程,安装依赖就是从服务器下载使用别人写的第三方包)。 允许用户从NPM服务器下载并安装别人编写的命令行程序到本地使用。 允许用户将自己编写的包或命令行程序上传到NPM服务器供别人使用。由于新版的nodejs已经集成了npm,所以之前npm也一并安装好了。同样原创 2020-09-23 09:43:13 · 4769 阅读 · 0 评论 -
微信小程序上传图片到云开发控制台存储及从储存下载图片到本地相册全流程
一、选择图片 chooseImage: function (e) { var that = this; wx.chooseImage({ sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有 sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有 success: function (res) { consol原创 2020-09-09 16:19:05 · 3707 阅读 · 0 评论 -
微信小程序实现随机验证码登录功能
一、首先放一下效果图二、WXML<view class='yanzhengma'> <text class='left'>{[code]}</text> <text class='right' bindtap='nextOne'>换一张</text></view>三、CSS.yanzhengma { height: 100rpx; display: flex; align-items: c原创 2020-09-07 09:04:45 · 1472 阅读 · 4 评论 -
防抖与节流技术
在写微信小程序时,针对于input组件的输入值,发现输入值变化时,js文件获取值的变化后频繁的往数据库中取值,导致最后获取的数据不是最后一次输入的关键字所查询到的数据,而是多次输入值的总和,经查询得知这是由于没有使用防抖节流技术引起的,防抖节流技术对input等用户的输入进行预处理之后才传入到自己编写的处理函数中去,可以有以下效果。微信小程序防抖和节流 适用于及时搜索和页面滚动:特点 : 优化代码,减少函数触发,减少页面请求。原理:利用延时器,闭包实现。具体代码实现 :将下面代码复制,在u.转载 2020-08-31 10:03:21 · 190 阅读 · 0 评论 -
设置组件高度100%不生效问题
有时我们设置组件的高度为100%,结果设置之后发现高度并不是100%,比如下图,我们可以看到在此处container设置了100%的高度,但是并没有生效。这是因为class="container"的这个组件虽然height设置成100%的高度,但是100%,是相对于父元素的100%,因此我们需要再设置page元素的height为100%,才能保证container设置的100%height生效,如下图:...原创 2020-07-10 15:02:15 · 1371 阅读 · 0 评论 -
小程序组件超过屏幕问题及禁止页面下拉
1.有事会出现小程序的页面超出屏幕,导致横向和纵向溢出,这时候在wxss文件中加入overflow:hidden来隐藏溢出屏幕的部分。.container { background: #1bd0ad; align-items: stretch; padding: 0; height: 100%; /* 隐藏溢出屏幕的部分 */ overflow:hidden; }2.在禁止下拉的页面的json配置文件中加入如下两条,即可组织页面下拉。"disableScroll原创 2020-07-10 13:58:15 · 1570 阅读 · 0 评论 -
微信小程序上传EXCE/CSV/JSON文件到数据库
官方文档提供两种方法支持上传csv/json数据到云数据,分别是在云开发控制台和使用HTTP API的方式上传csv/json文件到云数据库,另外我们还可以通过自己编写云函数的方法上传excel文件到云数据,下边我们将分别介绍着三种方法。一、使用云控制台上传csv/json数据到云数据库要导入数据,需打开云开发控制台,切换到 “数据库” 标签页,并选择要导入数据的集合,点击 “导入” 按钮,需要注意只支持csv和json格式的数据导入,需要注意的是jJSON 数据不是数组,而是类似JSON Lin.原创 2020-05-14 23:30:20 · 3959 阅读 · 1 评论 -
微信小程序开发环境/正式环境介绍。
正常应用环境下,小程序要建立两套云开发环境,一套云开发环境用于开发人员开发测试会用,另一套环境用于正式上线时使用。第一、可以进行环境区分,因为两套云开发环境里面有两套不同的云函数/云数据库/云存储等,操作开发测试环境的时候不会影响到正式环境;第二、在应用上线后,如果再对小程序功能进行修改时,免不了一些测试行为,使用开发测试环境避免污染正式环境的数据,引起不必要的麻烦;第三、在使用时,首先使用开发测试环境,注意修改app.json和云函数的cloud.init里面关于云环境ID的配置,推荐云函数里原创 2020-05-14 10:46:41 · 4145 阅读 · 0 评论 -
获取input输入值和获取form表单中的组件输入值区别
1.获取input标签输入数据<input bindinput="getValue" value="111" style="border:1rpx solid #123456"></input>在前台wxml标签中写入input标签,在此value的值如果已经写上的话会直接显示在input输入框中,如下:后台通过bindinput方法获取到input的输入值,后台js代码如下图,课件js通过e.detail.value(因为点击事件是与该组件绑定的)的方法获取inp原创 2020-05-12 15:41:13 · 2672 阅读 · 0 评论 -
微信小程序data-携带的数据和表单组件携带的数据详解
data-*携带的数据和表单组件携带的数据:首先组件data-*属性的数据会存储在事件对象里的currentTarget下的dataset里的属性名里,也就是data-color的值会存储在e.currentTarget.dataset.color里;而表单组件的数据则是存储在事件对象的detail里,也就是e.detail.value里。wxml页面:js页面:...原创 2020-05-12 16:32:05 · 642 阅读 · 0 评论 -
height 100%不起作用,100%和100vw/vh的区别
1.height设置成100%时发现高度没有变化在此处我们可以看到我们把page类已经设置了100%,发现高度并没有占满屏幕,那是height:100%这个100%是相对于他的父元素来说的,通过图2我们可以看到page标签的高度就是自适应,因此即使.content的高度设置成100%那么他顶多就是他的父元素的高度,在此处若想使渐变背景能够占满整个屏幕的高度,有两种方法:1、page标签的高度设置成100%,如图3;2.content的height高度为100vh.如图4 ...原创 2020-05-10 23:46:52 · 6542 阅读 · 0 评论 -
腾讯云.云开发与小程序.云开发的区别与联系
浅谈腾讯云·云开发与小程序·云开发的区别2019-11-13阅读5670看到不少同学对此有疑问,所以专门总结了一下两种云开发的区别# 腾讯云·云开发云开发(Tencent Cloud Base,TCB)是腾讯云为移动开发者提供的一站式后端云服务,它帮助开发者统一构建和管理资源,免去了移动应用开发过程中繁琐的服务器搭建及运维、域名注册及备案、数据接口实现等繁琐流程,让开发者可以专注于业务逻辑的实现,而无需理解后端逻辑及服务器运维知识,开发门槛更低,效率更高特点:一站式后端云服务 高.原创 2020-05-09 10:36:40 · 1059 阅读 · 0 评论 -
微信小程序人员组织结构
人员组织结构和权限分配多数情况下,一个团队多人同时参与同一个小程序项目,每个角色所承担的工作或者权限不一样,中大公司的分工更为仔细。为了更形象的表达团队不同角色的关系以及权限的管理,我们通过虚拟一个项目成员组织结构来描述日常如何协同合作完成一个小程序的发布,组织关系如图5-1所示。项目管理成员负责统筹整个项目的进展和风险、把控小程序对外发布的节奏,产品组提出需求,设计组与产品讨论...原创 2020-04-27 11:21:02 · 6396 阅读 · 0 评论 -
关于微信小程序wx.showloading()的使用
大部分场景可能是这样的,用户点击一个按钮,界面出现“加载中...”的Loading界面,然后发送一个请求到后台,后台返回成功直接进入下一个业务逻辑处理,后台返回失败或者网络异常等情况则显示一个“系统错误”的Toast,同时一开始的Loading界面会消失。我们给出一个常见的wx.request的示例代码,如下所示。代码清单4-11 wx.request常见的示例代码var hasClic...原创 2020-04-27 09:34:39 · 19761 阅读 · 0 评论 -
node.js和vue.js
有些人说“这是一种通过javascript语言开发web服务端的东西”。更直白的可以理解为:node.js有非阻se塞,事件驱动/O等特性,从而让高并发(high concurrency)在的轮询和comet构建的应用中成为可能。 浏览器给网站发请求的过程一直没怎么变过。当浏览器给网站发了请求,服务器收到了请求,然后开始搜寻被请求的资源。如果有需要,服务器还会查询一下数据库,最后把响应结果传...原创 2020-04-21 08:42:37 · 3152 阅读 · 2 评论 -
将前台标签的style样式内容转移到css中,由于标签存在默认样式导致的编写的css样式不生效问题
出现问题:把html标签中的style样式挪到css中后,样式就变化了,见下图前台style的内容和css的样式内容一致,但是显示效果却出现不一致的情况,进一步查看发小,css里的样式虽然引入成功了但是却没有生效,如下图经过查找资料得知,内联style的样式优先级最高,当有别的样式设置时(比如button默认的属性值),会有限使用style内联样式的属性,当将style内联...原创 2020-04-20 15:24:46 · 1782 阅读 · 0 评论 -
实现button按钮的内容为图片
1.在实现个人中心页面时会有微信登录功能,在此想实现,以未登录图片代替button按钮的样式,实现样式如下:前台wxml内容如下:<view class="container"> <view class="userinfo"> <button wx:if="{{!hasUserInfo && canIUse}}" open...原创 2020-04-20 11:02:36 · 3144 阅读 · 0 评论 -
云函数环境配置及创建一个简单的云函数
云函数环境配置:1.在项目下新建一个目录。2.指定该目录为云函数的跟目录。在项目的project.config.json文件中,将"cloudfunctionRoot": 字段的值设置为你的云函数根目录,如"cloudfunctionRoot": "云函数根目录"样式,如下图所示,完成该步骤后,上边新建的那个云函数根目录会变成一个有云朵符号的文件夹。3. 在项目的app.js文...原创 2020-03-21 00:16:21 · 7590 阅读 · 3 评论 -
微信小程序知识点(上)
1.流式布局中flex-direction:属性要和display:flex搭配使用。2内容居中的方法:.xxx{height: 80rpx;line-height: 80rpx;}原创 2020-03-17 14:56:35 · 3598 阅读 · 0 评论