
微信小程序
文章平均质量分 56
泊一
起风了
展开
-
wxs 使用注意事项
wxs 参看文档1. 无法使用es6的语法变量声明不能用let、const,只能用varnew Date() 无法使用,需要使用getDate()代替导出函数也不能使用缩写var getTimeStamp = function (timeStr) { var time = getDate(timeStr).getTime(); return time;};module.exports = { getTimeStamp: getTimeStamp,};2.枚举原创 2021-06-25 17:36:42 · 539 阅读 · 0 评论 -
小程序使用webview内嵌h5
参考文档web-view代码demo1.third-party.html<view> <web-view src="{{url}}" bindmessage="postMessage"/></view>2.third-party.jsPage({ data: { url:'https://mp.weixin.qq.com/' }, postMessage(e) { console.log(e,'返回的数据') },})调原创 2021-05-17 15:08:19 · 428 阅读 · 0 评论 -
自定义组件上传npm—小程序版
文章目录参考文档一、下载项目模板二、项目结构说明三、 `config.js`—配置说明四、对于无法编译`wxs`文件的解决方案五、对于`wxs`的一些注意点六、上传组件到npm6.1 打包组件6.2 注册npm账号6.3 登录账号并发布七、发布过程中可能遇到的问题7.1 `E401错误`7.2 `E403错误`7.3 `其他问题`参考文档开发第三方自定义组件npm支持一、下载项目模板这个是由小程序官方提供项目模板,点击下载二、项目结构说明|--miniprogram_dev // 开发环境构建原创 2021-03-08 15:05:49 · 781 阅读 · 0 评论 -
微信小程序如何引入npm包
微信小程序如何引入npm包转载 2020-12-09 10:54:10 · 1166 阅读 · 0 评论 -
在微信小程序中让文本按照原格式显示
参考文档CSS white-space 属性微信小程序视图容器view中控制文本显示方式使用示例就是添加样式 white-space:pre-line<scroll-view class="ph-50 mt-26 scroll_H fs-28 black" scroll-y > <view style="white-space:pre-line"> 首诊患者:请至“就诊卡”界面“新建就诊卡”,按提示填写个人信息原创 2020-12-08 18:18:02 · 2919 阅读 · 3 评论 -
base64转图片
参考文档data:image/png;base64的使用<image mode="aspectFit" src="data:image/png;base64,{{base64的图片编码}}" />原创 2020-12-08 15:15:54 · 3491 阅读 · 0 评论 -
小程序组件注册为页面一样使用onLoad、onShow的生命周期
参考文档使用 Component 构造器构造页面微信小程序的组件只要在app.json的pages里注册过,就能当页面用,页面的生命周期函数直接写在methods里就行,其他的写法还是按照组件的写法来const component = { methods: { onLoad() { console.log('onLoad'); }, onShow() { console.log('onShow'); }, },};Componen原创 2020-12-05 11:04:47 · 2652 阅读 · 0 评论 -
修改小程序原生按钮样式
1. 设置按钮的边框为空button::after { border:none;}2. 自定义disabled时的样式button[disabled]{ background-color: #ddd!important; color:#fff!important;}原创 2020-12-05 10:48:08 · 685 阅读 · 0 评论 -
微信小程序打开位置有偏差的解决方案
相关文档wx.openLocation使用时的坑当使用不同地址经纬度时,在微信小程序中打开的位置是有偏差的解决方案打开腾讯地图的坐标拾取器,取这上面的坐标,给后端,让他发给你,我试过这个坐标通过微信小程序打开腾讯、高德、百度地图基本没什么误差wx.openLocation({ latitude: Number(addressObj.latitude), longitude: Number(addressObj.longitude), name: a原创 2020-12-05 10:38:40 · 5060 阅读 · 0 评论 -
picker-view——实现picker自定义样式
参考文档picker-viewvant组件——Layout 布局遇到的坑picker-view中indicator-style里的单位尺寸不能rpx,会滚动选择时出现选择的想不能居中的现象,后来我用px可以了van-row要自己设置height等于line-height,才能保证文字垂直方向的居中,同时搭配picker-view在picker-view-column里使用时,单位也要用px,用rpx也是有偏差...原创 2020-12-05 10:05:26 · 5895 阅读 · 3 评论 -
下拉刷新,分页加载组件封装(scroll-view)
通过对scroll-view组件的封装,实现简单的下拉刷新,分页加载的功能scroll-viewindex.html<scroll-view bindrefresherrefresh="bindrefresherrefresh" bindscrolltolower="bindscrolltolower" enhanced="{{true}}" fast-deceleration="{{true}}" refresher-background="{{color}}" r原创 2020-11-24 16:23:29 · 1334 阅读 · 0 评论 -
微信支付
支付步骤:先传订单信息到后台,拿取后台返回的数据调用微信支付接口wx.requestPayment,用拿到的数据进行对应的填写微信支付参考地址:https://developers.weixin.qq.com/miniprogram/dev/api/open-api/payment/wx.requestPayment.htmlimport { appId } from '../config/config';import getOrderRes from '../resource/wxpay'原创 2020-11-23 11:56:42 · 389 阅读 · 1 评论 -
微信小程序直接打开文件操作(pdf)
1. 需求场景对于需要直接打开pdf等文件的情况2.代码实现微信接口地址:wx.getFileSystemManager()文件系统中的用户目录路径wx.env.USER_DATA_PATHFileSystemManagerwx.openDocumentasync openSummary() { try { // 调用自己后台接口,获取数据 let res = await getSummary({ platId: this.data.id });原创 2020-11-20 11:47:23 · 7747 阅读 · 2 评论 -
微信小程序中OCR身份证识别流程
参考博客微信小程序官网参考地址转载 2020-11-18 19:24:36 · 2070 阅读 · 0 评论 -
微信小程序自定义组件中对properties的修改
数据监听器注意:如果在数据监听器函数中使用 setData设置本身监听的数据字段,可能会导致死循环,需要特别留意。Component({ options: { addGlobalClass: true, }, properties: { list: { type: Array, value: [], }, }, data: { history:'' },// 通过监听器来设置 首次加载时就会触发一次 用新的变量来原创 2020-11-11 18:22:10 · 6867 阅读 · 0 评论 -
textarea使用中遇到的坑
微信小程序原始组件 —— textarea1. textarea有默认的宽高如果想设置宽高/* 覆盖默认的宽度 */textarea { width: 100%;}2.model:value 时,它双向数据绑定的是blur事件当我打算通过model:value后,通过value的值来判断输入框内容是否为空进行决定下一步按钮是否高亮显示时,在开发者工具上是没有问题的,在手机上却发现,要输入框失去焦点后才会判断,这不符合我的要求,后来bindinput来判断value解决的 <vie原创 2020-11-11 17:44:52 · 1034 阅读 · 0 评论 -
scroll-view 竖向滚动高度设置
index.jsonLoad() { // 设置scroll-view的高度 let windowHeight = wx.getSystemInfoSync().windowHeight; // 屏幕的高度 let windowWidth = wx.getSystemInfoSync().windowWidth; // 屏幕的宽度 this.setData({ scroll_height: (windowHeight * 750) / windowWidth -原创 2020-10-26 15:11:07 · 1139 阅读 · 0 评论 -
ios底部显示不全问题
设置公共的class,给页面的底部元素添加该样式.ios-bottom { padding-bottom: env(safe-area-inset-bottom);}原创 2020-10-26 15:06:28 · 974 阅读 · 0 评论 -
WePY框架学习
文章目录一、WePY 简介1. 什么是 `WePY`2. 为什么使用 `WePY`二、`WePY` 的安装与运行1. 安装 `WePY`2. 初始化 `WePY` 项目一、WePY 简介1. 什么是 WePYWePY 是腾讯官方出品的一个小程序快速开发框架,对原生小程序的开发模式进行了再次封装2. 为什么使用 WePYWePY 相比于原生小程序开发,拥有众多的开发特性和优化方案...原创 2019-12-22 21:32:27 · 1125 阅读 · 0 评论 -
微信小程序知识点整理(六)——自定义组件
文章目录一、小程序组件 -- 创建与引用1. 组件的创建2. 组件的引用二、小程序组件 -- 组件的样式三、小程序组件 -- 数据与方法1. 使用 data 定义组件的私有数据2. 使用 methods 定义组件的事件处理函数3. 组件的 properties3.1 properties 简介3.2 声明 properties 的两种方式3.3 为组件传递 properties 的值3.4 ...原创 2019-12-22 11:05:30 · 1931 阅读 · 0 评论 -
微信小程序知识点整理(五)——页面导航
文章目录一、声明式导航1. 导航到非 `tabBar` 页面2. 导航到 `tabBar` 页面3. 后退导航二、编程式导航1. 导航到非 `tabBar` 页面2. 导航到 `tabBar` 页面3. 后退导航三、导航传参1. 声明式导航传参2. 编程式导航传参3. 接受传递的参数4. 导航栏自定义编译模式快速传参一、声明式导航1. 导航到非 tabBar 页面非 tabBar 页面指...原创 2019-12-20 17:13:00 · 606 阅读 · 0 评论 -
微信小程序里的路由函数解析(wx.switchTab、wx.reLaunch、wx.redirectTo、wx.navigateTo、wx.navigateBack)
文章目录一、wx.switchTab(跳转tabBar页面,不可传参)二、wx.reLaunch(先关闭所有页面,再跳转任何页面包括tabBar,可传参)三、wx.redirectTo(跳转关闭当前页,可传参)四、wx.navigateTo(跳转保存当前页,可传参)五、wx.navigateBack(跳转页面栈)六、wx.redirectTo和wx.navigateTo的区别官方文档:微信小程序...原创 2019-12-20 17:14:06 · 1594 阅读 · 0 评论 -
微信小程序知识点整理(四)——页面事件
文章目录一、下拉刷新下拉刷新的概念以及场景如何启动下拉刷新设置下拉刷新窗口的样式监听下拉刷新事件停止下拉刷新二、上拉加载上拉加载的概念以及场景设置上拉刷新的距离案例三、页面滑动事件`onPageScroll`四、分享事件 `onShareAppMessage`一、下拉刷新下拉刷新的概念以及场景概念:下拉刷新是移动端更新列表数据的交互行为,用户通过手指在屏幕上自上而下的滑动,可以触发页面的下...原创 2019-12-20 10:32:01 · 923 阅读 · 0 评论 -
微信小程序知识点整理(三)——条件渲染与列表渲染
文章目录一、条件渲染`wx:if``block wx:if`hiddenhidden 和 `wx:if` 的区别二、列表渲染wx:for`block wx:for`指定索引和当前项的变量名列表渲染中的 `wx:key`1. `wx:key` 的作用说明2. `wx:key` 的注意事项一、条件渲染wx:if在小程序中,使用 wx:if="{{condition}}"来判断是否需要渲染该代码...原创 2019-12-19 20:54:31 · 887 阅读 · 0 评论 -
微信小程序知识点整理(二)——wxs简介
文章目录一、`WXS` 脚本简介什么是 `wxs``wxs` 的注意事项`wxs` 遵循 `CommonJS` 模块化规范二、`wxs` 基础语法使用 `module.exports` 向外共享成员使用 `require` 引入其它 `wxs` 模块 以及注意事项支持的数据类型三、内嵌 `wxs` 脚本使用规则案例代码四、外联 `wxs` 脚本文件使用规则案例代码五、wxs过滤器写法一、WX...原创 2019-12-19 17:25:55 · 3105 阅读 · 0 评论 -
微信小程序知识点整理(一)
文章目录一、什么是 `rpx` 尺寸单位二、`rpx` 与 `px` 之间的换算三、 `@import` 样式导入四、全局样式和局部样式全局样式局部样式五、`app.json` 配置文件六、`pages` 数组的用法基础配置创建页面的另一种方式设置项目的首页七、小程序窗口的组成部分一、什么是 rpx 尺寸单位rpx: 是微信小程序独有的,解决屏幕自适应的尺寸单位可以根据屏幕宽度进行...原创 2019-12-19 15:15:29 · 1709 阅读 · 0 评论 -
wx:key详解
原文地址:http://www.wxappclub.com/topic/536A:数据改变,导致重新渲染的两种情况:1:有wx:key的情况(不重新创建,仅改变顺序)添加元素或改变元素顺序导致数据改变时,会校正带有Key的组件(可通过key识别各组件),框架会根据“目前数据”,重新排序各组件,而不是...转载 2019-01-25 14:55:20 · 2789 阅读 · 0 评论 -
微信小程序API之wx.request域名问题
域名没有配置的情况解决方案:原创 2019-01-19 23:55:21 · 961 阅读 · 0 评论