![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
小程序
培根芝士
相看两厌,不若相忘于江湖
展开
-
小程序使用wx.redirectTo跳转时隐藏返回首页按钮
使用wx.redirectTo进行跳转时,默认是带有返回首页按钮的。原创 2023-04-24 19:58:02 · 1013 阅读 · 0 评论 -
小程序获取视频缩略图
在小程序中使用wx.chooseVideo来获取视频,发现开发工具里有一个thumbTempFilePath参数,可以获取视频缩略图,但是,真机上却没有。官方文档https://developers.weixin.qq.com/miniprogram/dev/api/media/video/wx.chooseVideo.htmlwx.chooseVideo({ sourceType: ['album','camera'], maxDuration: 60, camera: 'back'原创 2021-10-13 10:49:35 · 7004 阅读 · 0 评论 -
小程序使用web-view实现与H5交互
在小程序端使用web-view内嵌H5网页,web-view通过设置src属性来指定网页即可在小程序中显示。一个页面只能有一个web-view,且会自动铺满整个小程序页面。web-view官方文档:web-view | 微信开放文档微信开发者平台文档https://developers.weixin.qq.com/miniprogram/dev/component/web-view.htmlH5端代码:<script type="text/javascript" src="https:/原创 2021-10-11 18:20:29 · 5313 阅读 · 0 评论 -
小程序/JS数组删除元素
remove(array, val){ for (var i = 0; i < array.length; i++) { if (array[i] == val){ array.splice(i, 1); } }};原创 2021-10-08 14:45:54 · 577 阅读 · 0 评论 -
小程序禁用view的bindtap
<view class="pointer-events:none;" bindtap="tapAddCart"></view>pointer-eventsCSS 属性指定在什么情况下 (如果有) 某个特定的图形元素可以成为鼠标事件的target。/* Keyword values */pointer-events: auto;pointer-events: none;pointer-events: visiblePainted; /* SVG only */po..原创 2021-09-27 16:04:03 · 1595 阅读 · 0 评论 -
小程序/CSS换行
word-break:word-break 属性规定自动换行的处理方法。word-break: normal|break-all|keep-all;值 描述 normal 使用浏览器默认的换行规则。 break-all 允许在单词内换行。 keep-all 只能在半角空格或连字符处换行。 word-wrap:word-wrap 属性允许长单词或 URL 地址换行到下一行。word-wrap: normal|break-word;值 描原创 2021-08-27 18:37:03 · 1462 阅读 · 0 评论 -
小程序URL解码decodeURI与decodeURIComponent的区别
定义 decodeURI() 函数可对 encodeURI() 函数编码过的 URI 进行解码。 decodeURIComponent() 函数可对 encodeURIComponent() 函数编码的 URI 进行解码。 从W3C的定义和用法来看,两者没有什么区别,但是两者的参数是有区别的://URIstring 一个字符串,含有要解码的 URI 或其他要解码的文本。decodeURI(URIstring)//URIstring 一个字符串,含有编码 URI...原创 2021-08-17 10:27:37 · 2969 阅读 · 1 评论 -
小程序/CSS隐藏元素
opacityopacity属性的意思是设置一个元素的透明度。它不是为改变元素的边界框(bounding box)而设计的。这一位着将opacity设置为0只能从视觉上隐藏元素。而元素本身依然占据它自己的位置并对网页的布局起作用,它也将响应用户交互。visibility第二个要说的属性是visibility。将它的值设为hidden将隐藏我们的元素。如同opacity属性,被隐藏的元素依然会对我们的网页布局起作用。与opacity唯一不同的是它不会响应任何用户交互。此外元素在读屏软件中会被隐藏注原创 2021-08-13 17:48:28 · 421 阅读 · 0 评论 -
小程序扫普通链接二维码打开小程序
配置流程登录小程序后台,进入“开发管理-开发设置-扫普通链接二维码打开小程序”,开启功能后即可配置二维码规则。二维码规则根据二维码跳转规则,开发者需要填写需要跳转小程序的二维码规则。要求如下: 二维码规则的域名须通过ICP备案的验证。 支持http、https、ftp开头的链接(如:http://wx.qq.com、https://wx.qq.com/mp/、https://wx.qq.com/mp?id=123)。 一个小程序帐号可配置不多于100个二维码前.原创 2021-08-10 14:32:43 · 1818 阅读 · 0 评论 -
小程序生成二维码
weapp-qrcode下载链接在github上下载工程,将/utils/weapp-qrcode.js文件直接放在自己工程下面。引用:import QRCode from '/utils/weapp-qrcode.js'使用:new QRCode('myQrcode',{ text: 'http://www.baidu.com', width: 200, height: 200, padding: 12, // 生成二维码四周自动留边宽度,不传入默认为0 cor原创 2021-08-10 14:24:02 · 242 阅读 · 0 评论 -
小程序使用分包
目前小程序分包大小有以下限制:整个小程序所有分包大小不超过 20M 单个分包/主包大小不能超过 2M当主包大小超过2M时,就需要进行分包。在构建小程序分包项目时,构建会输出一个或多个分包。每个使用分包小程序必定含有一个主包。所谓的主包,即放置默认启动页面/TabBar 页面,以及一些所有分包都需用到公共资源/JS 脚本;而分包则是根据开发者的配置进行划分。在小程序启动时,默认会下载主包并启动主包内页面,当用户进入分包内某个页面时,客户端会把对应分包下载下来,下载完成后再进行展示。对小程序原创 2021-08-10 10:16:07 · 482 阅读 · 1 评论 -
小程序/CSS的font-weight属性
font-weight 属性设置文本的粗细。值 描述 normal 默认值。定义标准的字符。相当于400 bold 定义粗体字符。相当于700 bolder 定义更粗的字符。 lighter 定义更细的字符。 100 200 300 400 500 600 700 800 900 定义由粗到细的字符。400 等同于 normal,而 700 等同于 bold。 in原创 2021-08-04 15:04:00 · 1887 阅读 · 0 评论 -
小程序new Date()方法失效问题解决方法
实际应该过程中日期格式大部分都是这种2021-08-24 11:22:33而正确的写法应该是:let dt = new Date("2021/08/24 11:22:33")在某些机型下如果直接调用new Date("2021-08-24 11:22:33")会返回Invalid Date。所以在实际应用过程中需要用正则对字符串进行预处理:let tm = "2021-08-24 11:22:33"let dt = new Date(tm.replace(/-/g,'/')原创 2021-08-04 10:07:29 · 755 阅读 · 2 评论 -
小程序/JS数组排序
普通数组排序 js中用方法sort()为数组排序。sort()方法有一个可选参数,是用来确定元素顺序的函数。如果这个参数被省略,那么数组中的元素将按照ASCII字符顺序进行排序。如:var arr = ["a", "b", "A", "B"];arr.sort();console.log(arr);["A", "B", "a", "b"]sort方法会调用每个数组项的toString()方法,得到字符串,然后再对得到的字符串进行排序。这时,sort()方法的参数就起到了..原创 2021-07-29 10:31:16 · 1931 阅读 · 0 评论 -
小程序长按图片识别二维码
方案1:使用wx.previewImage识别✅ 识别小程序码 - ✅ 跳转小程序✅ 识别群二维码 - ✅ 跳转到加群页面✅ 识别名片二维码 - ✅ 跳转到加好友页面❌ 识别小程序二维码WXML:<image src="https://img.demo.com/upload/images/qrcode.jpg" mode="widthFix" data-src="https://img.demo.com/upload/images/qrcode.jpg" bindtap=.原创 2021-07-23 19:11:20 · 5192 阅读 · 0 评论 -
小程序/CSS阴影属性box-shadow
box-shadow属性可以设置一个或多个下拉阴影的框。box-shadow: 10px 10px 5px #888888;box-shadow:h-shadow v-shadow blur spread colorinset;值 说明 h-shadow 必需的。水平阴影的位置。允许负值 v-shadow 必需的。垂直阴影的位置。允许负值 blur 可选。模糊距离 spread 可选。阴影的大小 color 可选。阴影的颜色。 ..原创 2021-07-21 19:31:56 · 3384 阅读 · 0 评论 -
小程序类型判断
方法1:Object.prototype.toString.call(x)console.log(Object.prototype.toString.call(10) == '[object Number]')console.log(Object.prototype.toString.call(str) == '[object String]')console.log(Object.prototype.toString.call([1,2,3,4]) == '[object Array]')co原创 2021-07-13 18:43:41 · 437 阅读 · 0 评论 -
小程序/CSS的text-decoration属性
text-decoration属性允许对文本设置某种效果,如加下划线。如果子元素没有自己的装饰,父元素上设置的装饰会“延伸”到子元素中。值 描述 none 默认。定义标准的文本。 underline 定义文本下划线。 overline 定义文本顶部的一条线。 line-through 定义文本删除线。 blink 定义闪烁的文本。 inherit 规定应该从父元素继承 text-decoration 属性的值。 示例:文字排版--原创 2021-07-08 14:06:40 · 775 阅读 · 0 评论 -
小程序/CSS实现单行与多行文本溢出显示省略号
单行文本溢出显示省略号overflow: hidden;text-overflow:ellipsis;white-space: nowrap;多行文本溢出显示省略号display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;overflow: hidden;原创 2020-12-07 19:39:56 · 307 阅读 · 0 评论 -
小程序wxss进阶
before ,after before为控件前面展示的文本,after为控件后面展示的文本.view_1 { font-size: 70rpx; color: red;}/* 在view_1控件之前 */.view_1::before { content: "苹果:¥ "; font-size: 40rpx; color: black;}/* 在view_1控件之后 */.view_1::after { content: " 元/斤"; font-si..原创 2021-07-07 15:31:39 · 517 阅读 · 0 评论 -
小程序分享链接
通过给button组件设置属性open-type="share",可以在用户点击按钮后触发Page.onShareAppMessage事件。<button class="share-button" open-type="share"></button> /** * 用户点击右上角分享 */ onShareAppMessage: function (e) { console.log(e.from) //转发事件来源 button:页面内...原创 2021-07-07 10:31:09 · 591 阅读 · 0 评论 -
小程序/JS二进制操作ArrayBuffer
ArrayBuffer是JavaScript用来处理二进制的,ArrayBuffer对象保存着原始二进制数据,它不能对数据进行操作,只能通过视图类(TypeArray或DataView)才能对数据进行读写。ArrayBuffer特点数组里面存放的是二进制原始数据 初始化后固定大小// 创建一个8-byte的ArrayBuffervar b = new ArrayBuffer(8); // 创建一个b的引用,类型是Int32,起始位置在0,结束位置为缓冲区尾部var v1 = new原创 2021-07-05 16:45:58 · 3394 阅读 · 0 评论 -
小程序实现base64编解码
string和uint8Array互相转换 /** string转Uint8Array */ stringToUint8Array(str){ var arr = []; for (var i = 0, j = str.length; i < j; ++i) { arr.push(str.charCodeAt(i)); } var tmpUint8Array = new Uint8Array(arr); return tmpUint8Ar.原创 2021-07-05 16:15:33 · 1513 阅读 · 0 评论 -
小程序远程仓库的认证与设置问题
从项目组clone了一份项目,发现代码管理的推送,抓取,拉取操作都会报这个错误解决方案:在设置->网络和认证中把git的账号信息填入原创 2021-07-02 20:14:41 · 747 阅读 · 0 评论 -
小程序展示html内容
常用解决方案 wxParse 小程序刚上线那会儿,是无法直接渲染HTML内容的,于是就诞生了一个叫做「 wxParse 」的库。它的原理就是把HTML代码解析成树结构的数据,再通过小程序的模板把该数据渲染出来。wxParse下载链接在需要引用这个插件的 wxml文件中引用wxParse.wxml<import src="../../../wxParse/wxParse.wxml"/>在需要引用这个插件的 wxss 文件中引用wxParse.wxss@i...原创 2021-07-02 13:49:53 · 1190 阅读 · 0 评论 -
小程序正则替换
使用正则替换字符串原始数据:2020-8-3 18:18:23str.replace(new RegExp('-','g'),'.');或str.replace(/-/g,'.');替换结果:2020.8.3 18:18:23使用正则替换HTML中的图片原始数据:<p><img src="https://www.demo.com/image/20210702/1625193028451591.jpeg" title="1625193028..原创 2021-07-02 11:29:24 · 699 阅读 · 0 评论 -
小程序日期和时间戳转换
日期转时间戳let datetime = '2021-06-06 11:22:33'let timestamp = new Date(datetime.replace(/-/g,"/")).getTime()/1000时间戳转日期util.jsconst formatNumber = n => { n = n.toString() return n[1] ? n : `0${n}`}/** * 时间戳转化为年 月 日 时 分 秒 * number: 传入时间戳原创 2021-06-24 19:37:08 · 2659 阅读 · 0 评论 -
小程序使用WxValidate进行表单校验
WxValidate插件下载地址https://github.com/wux-weapp/wx-extendWxValidate插件是参考 jQuery Validate 封装的,为小程序表单提供了一套常用的验证规则,包括手机号码、电子邮件验证等等,同时提供了添加自定义校验方法,让表单验证变得更简单。参数说明参数 类型 描述 rules object 验证字段的规则 messages object 验证字段的提示信息 内置校验规则序号原创 2021-06-23 17:15:11 · 836 阅读 · 0 评论 -
小程序使用腾讯地图获取当前位置和地图选取位置
获取当前位置申请开发者密钥(key):申请密钥开通webserviceAPI服务:控制台 ->应用管理 ->我的应用->添加key-> 勾选WebServiceAPI -> 保存(小程序SDK需要用到webserviceAPI的部分服务,所以使用该功能的KEY需要具备相应的权限)下载微信小程序JavaScriptSDK,微信小程序JavaScriptSDK v1.1JavaScriptSDK v1.2安全域名设置,在小程序管理后台-> 开发...原创 2021-06-23 14:54:46 · 1635 阅读 · 0 评论 -
小程序获取手机号和openid
获取微信用户绑定的手机号,需先调用wx.login接口。在登录页的onShow事件中调用wx.login接口获取登录凭证(code)。用户登录凭证(code)有效期五分钟,需要在开发者服务器后台调用auth.code2Session,使用 code 换取用户登录态信息,包括用户在当前小程序的唯一标识(openid)、微信开放平台帐号下的唯一标识(unionid,若当前小程序已绑定到微信开放平台帐号)及本次登录的会话密钥(session_key)等。用户数据的加解密通讯需要依赖会话密钥session.原创 2021-06-23 10:33:03 · 2074 阅读 · 0 评论 -
小程序设置view渐变色
线性渐变(linear-gradient)从上到下(默认).content { width: 240px; height: 240px; background: linear-gradient(red, blue);}从左到右.content { width: 240px; height: 240px; background: linear-gradient(to right, red, blue);}对角(从左上到右下).c.原创 2021-06-22 14:48:12 · 1664 阅读 · 0 评论 -
小程序使用wxml-to-canvas截屏
安装wxml-to-canvas1、在小程序项目根目录内,初始化npmnpm init -y2、执行命令安装wxml-to-canvas的npm包npm install --save wxml-to-canvas3、在微信开发者工具中的菜单栏:工具 --> 构建 npm完成构建后可以在目录树里看到了miniprogram_npm以及里面的wxml-to-canvas组件文件夹4、在微信开发者工具中的菜单栏:工具 --> 项目详情,勾选“使用npm模块”原创 2021-06-21 17:58:29 · 3196 阅读 · 0 评论 -
小程序/CSS外边距(margin)和内边距(padding)
margin:外边距;设置对象四边的外延边距。margin: 20rpx 10rpx 25rpx 10rpx :如果提供全部四个参数值,将按上、右、下、左的顺序作用于四边。margin:20rpx:如果只提供一个,将用于全部的四边。margin:20rpx 20rpx:如果提供两个,第一个用于上、下,第二个用于左、右。margin:20rpx 20rpx 10rpx:如果提供三个,第一个用于上,第二个用于左、右,第三个用于下。某些相邻的margin会发生合并,称之为margin折叠,具体的现象就原创 2021-06-21 15:34:16 · 783 阅读 · 0 评论 -
小程序页面之间传递值
父页面向子页面传值url传值父页面:原创 2021-06-21 14:18:02 · 121 阅读 · 0 评论 -
小程序自定义导航栏组件
导航栏wxml:<view class="nav-content"> <view class='nav-wrap' style='height:{{height}}px;'> <view class="navback-back"> <!--返回按钮--> <view class="back"> <view class="button"原创 2021-06-18 14:19:57 · 372 阅读 · 0 评论 -
小程序圆角按钮
圆角线框按钮.round-line-button{ height: 80rpx; border-radius: 40rpx; display: flex; flex-direction: row; justify-content: center; align-items: center; background-color: white; color: #666666; border: 1rpx solid #bbbbbb;}圆角填充按钮...原创 2021-06-18 13:58:11 · 813 阅读 · 0 评论 -
小程序position样式
static : 这个默认值 ,即按照写代码顺序的位置relative : 这个是在写代码位置基础上,再偏移一个地址,注意:这里最重要的是原来的位置会保留下来,即人走了,位置还是属于你。absolute : 这个也是在写代码位置基础上,再偏移一个地址,但这里原来的位置不会保留下来,即人走了,位置也还回去了。fixed : 这个跟写代码位置没有关系,天生有特权,想到哪到哪。...原创 2021-06-03 19:31:58 · 787 阅读 · 0 评论 -
小程序解决“本地资源图片无法通过 WXSS 获取,可以使用网络图片,或者 base64,或者使用<image/>标签。”错误
报错信息: VM696:2 pages/user/user.wxss 中的本地资源图片无法通过 WXSS 获取,可以使用网络图片,或者 base64,或者使用<image/>标签原创 2021-06-03 18:33:19 · 4379 阅读 · 1 评论 -
小程序设置边框border
.demo-view { border-bottom: 2rpx solid red;}原创 2021-05-28 11:04:30 · 9540 阅读 · 0 评论 -
小程序自定义组件
创建子组件父页面引入子组件在父页面的json中添加组件 "usingComponents": { "custombar": "../../components/custombar/custombar" },在父页面的wxml中添加组件 <custombar></custombar> 父页面向子组件传值 父页面的wxml中在组件标签上直接写需要传递的值<custombar title="hello"></.原创 2021-05-25 15:19:23 · 210 阅读 · 0 评论