iOS系统对js中的new Date()方法有格式要求let dt = new Date("2019-07-24 19:57") // dt会返回valid Date正确写法应该是let dt = new Date("2019/07/24 19:57")而实际应该过程中日期格式大部分都是2019-07-24这种，所以在实际应用过程中需要用正则对字符串进行预处理let tm = "2019-07-24 19:57" let dt = new Date(tm.replace(/-/g,/))在小程序开发过程中用到一个日期转换方法，然而苹果手机就是不管用，去网上搜了才发现有这个问...
前言 最近开发了一个小程序动态仪表盘组件，并以第三方小程序组件的形式发布到npm，任意小程序项目都可以安装这个模块，从而获得仪表盘功能。组件功能目前还非常简单，先来预览一下效果：感兴趣的直接看源码： https://github.com/tower1229/weapp-plugin-dashboard 下面是踩坑过程。如何开发微信小程序自定义组件官方提供了一个CLI工具专门用于开发小程序自定义组件，首先全局安装这个工具：npm install -g @wechat-miniprogram/m...
网页的性能优化是前端开发老生常谈的热门话题，其中微信小程序因其页面双线程架构设计，所以性能优化的手段跟传统的 H5 应用不太一样。今天主要介绍一下微信小程序页面双线程架构的特性给页面渲染带来的一些影响，以及应对的一些渲染性能调优策略。为了叙述方便，下文会把微信小程序简称为小程序。 小程序的双线程架构 与传统的浏览器Web页面最大区别在于，小程序的是基于 双线程 模型的，在这种架构中，小程序的渲染层使用 WebVie...
前言 iBeacon是苹果公司推出的一项低耗能蓝牙技术，由蓝牙设备发射包含指定信息的信号，再由移动设备接收信号，从而实现近场通信。微信小程序2017年开始支持iBeacon，摇一摇附近就是基于iBeacon实现的，此外iBeacon还可以实现距离测量，本文将介绍如何基于微信小程序实现iBeacon测距。 iBeacon测距原理蓝牙信标发射的信号强度(rssi)与收发设备之间的距离，某种程度上呈正相关，因此通过合理的运算转化，可以通过rssi的值反推出与接...
这两天因为要做一个带背景的小程序头，哭了，小程序导航栏有背景也就算了，还得让导航栏上的背景顺下来，心态小崩。现在可以单独设置一个页面的小程序头了，但是前提是要微信7.0以上的版本，考虑到兼容性问题，还是不要贸然的上了，所以用老版本的替换所有页面的小程序头来做。 ? 参考了其他篇的文章,但是没有解决自定义背景的和返回按钮的颜色的问题，还有因为IOS的橡皮筋效果，对IOS端不太友好，屏幕会乱划。所以针对性的改动了这...
前言 手机连接到互联网有几种方式：Wifi、2G、3G、4G，包括很快到来的5G，每种方式的上传速度和下载速度差异很大，它们的计费方式的差异也导致用户在使用互联网服务的时候有不同的使用习惯。 Wifi相对于其他几种网络连接方式，其速度会更快。Wifi一般都是免费供用户使用，通过移动数据网络是需要根据使用流量进行计费的。我们考虑这样一个场景，小程序需要下载一些文档，然后通过小程序的能力去预览这个文档，这些文档可能文件体积...
小程序文字显示换行 问题 用户在上传图文时，输入换行符。导致我在拿到数据后JSON.parse的时候报错。 大概这样的结构： [{text:落魄前端在线炒粉！！！ ,url: },{text: ,url:xxx.jpg, }] 解决 在拿到数据时先进行正则匹配处理，将换行替换为\n data.replace(/\n/g,\\n)然后在进行JOSN.parse就无问题啦。 还要注意的是要使用 text 标签输出才会有换行显示喔。 ps：下面看下微信小程序文字超出自动换行 text-overflow:ellipsis; wor...
本文实例讲述了JavaScript面向对象程序设计中对象的定义和继承。分享给大家供大家参考，具体如下： 在面向对象的Javascript编程中，希望代码优雅有高效是非常重要的。javascript中不存在类的概念，只有对象。要想把Javascript代码写的像java 或者C++一样优雅，就得考虑如何去实现，同时也要考虑性能和高效。定义javascript对象的方式有很多，继承的方式也很多。通过不断地实践，推荐如下的方法： 1.Javascript对象的定义采用混合方...
本文实例为大家分享了小程序实现左滑删除效果的具体代码，供大家参考，具体内容如下1、movable-area基本概念 实现思路： 大家仔细去看看官网的文档后再来看我写的这篇文章可能会更好理解。 （1）movable-area这个就是定义了一个移动的区域，跟普通的<view></view>的含义是一样的，不同在于，接着往下看； 注意：movable-area 必须设置width和height属性，不设置默认为10px （2）movable-view这个就是一个可移动的视图容器，可以在页...
背景在小程序中使用map组件，可以调用腾讯地图的API，将一些固定的点标记到地图界面上，点的经纬度获取是通过android端百度地图API获取的，所以此时将这个位置点信息直接设置上去会出现偏差，而且偏差还比较大 小程序设置位置点关于如何在map组件上设置位置点，详细请查看腾讯官方文档 首先看一下map组件： <map id="map" longitude="113.324520" latitude="23.099994" scale="14" controls="{{controls}}" bindcontroltap="contro...
最近做微信小程序项目遇到左滑动效果，比如在我的收藏页面，我的历史浏览记录页面，我的购物车页面，大多数都会用到这种效果，我把代码复制出来，供大家参考，用的时候直接用模板，再此基础上修改就行。 wxml中的代码： <view class="touch-item {{item.isTouchMove ? touch-move-active : }}" data-index=" {{index}}" bindtouchstart="touchstart" bindtouchmove="touchmove" wx:for="{{items}}" wx:key=""><view class="content...
本文实例为大家分享了微信小程序实现收货地址左滑删除的具体代码，供大家参考，具体内容如下 效果：思路： 一、用相对定位和绝对定位，列表放在上层，删除按钮放在下层（z-index不要为负）。 二、触摸事件判断用户是否左滑，有 bindtouchstart，bindtouchmove，bindtouchend 三个触摸事件。 1、bindtouchstart 记录触摸开始的点。开始点的坐标在 e.touches[0] 中，这是相对于屏幕的，也就是以屏幕左上方为原点。 2、bindtouchmove ...
本文实例讲述了javascript面向对象程序设计实践常用知识点。分享给大家供大家参考，具体如下： 实践一：原型中的引用类型的属性是共享的 var Person = function(){}; Person.prototype = {info:{"name":"Tom"} } var p1 = new Person(); var p2 = new Person(); p1.info.name = 我是p1; p2.info.name = 我是p2; console.log(p1.info.name); // 我是p2 console.log(p2.info.name); // 我是p2分析：p1,p2都是实例化出来的对象，p1.in...
本文实例为大家分享了微信小程序绘制图片发送朋友圈的具体代码，供大家参考，具体内容如下 这种生成图片的效果是很常见的，实现起来也不难，跟原生js的差不多。需要注意的就是canvas标签上不要加太多的css，后果呢就是导致canvas不显示，还有呢就是canvas组件的优先级是最高的，所以会覆盖掉下面的所有内容，解决方法呢就是使用：使用上面这两个组件是可以盖在canvas上面的。 注意：canvas绘制不支持网络图片，需要将网络图片保存成...
公司因小程序项目先上线，公众号后开发，接到上级的安排实现小程序打通任务，看文档后发现：同一开发者账号只要是在微信开放平台绑定小程序与公众号以后，会有一个唯一的unionid,这个unionid腾讯公司下产品共享。这个unionid就是我们进行打通的关键。 先说一下思路：1.微信小程序与公众号进行绑定后，在小程序调用wx.login()方法后会自动获取unionid，公众号根据官方文档在获取用户基本信息后会拿到相同的unionid，openid，nicknam...