i_am_a_div的博客

common/main.js: TypeError: window.WeixinJSBridge.beforeinvoke is not a function 小程序工具项目运行空白切报错

拼接ip的地址直接微信打开或者浏览器打开也可以实时预览

uni-app官方介绍的更新某一个组件的uni_modules方法注意：本篇只是记录更新uni-app的组件库下某一个组件的版本。不是更新微信小程序版本。场景原因：项目最初是去年开发的，当时下载了uni-app的自带组件库。但是时间筛选器uni-datetime-picker，当时的版本是2.0.13，就存在清空按钮不显示的bug。最新版本2.2.2就解决了以前的bug，但是旧版本官方又不维护。那么就导致我们项目中存在bug。只有将此组件升级即可解决。我们不可能升级整个uni-app的组件库，那

需求：微信小程序列表加载有两种方式，分别是按住页面下拉加载数据数据（触发onPullDownRefresh）和直接上划滚动页面到底部加载数据（触发onReachBottom函数）。本文主要是使用上划滚动页面触底加载数据（如果做页面下拉加载数据 只需要复制相同逻辑即可）以下代码可直接复制使用：<template> <view> <view class="list" v-for="item in dataLit" :key="item.id">.

场景：微信小程序设置动态样式，有些时候是需要用到变量来书写的；但是实际使用发现，行内式书写虽然有效，但是会使得微信小程序的编辑失败；故需要使用动态的v-bind来写动态变量行内式样式（既使用:style="{ }"）<template> <view> <view class="big_box"> <!-- 故需要通过动态v-bind来设置 动态变量样式 ----正确书写✅ --> <view class=".

微信小程序自定义导航栏

场景： 微信小程序，对于以下较大的图片（例如几M），在真机运行时候加载比较慢，此时会有一个比较长时间的白屏，体验很差。解决方案：图片未加载成功前，进行loading…;图片加载完成后会触发@load事件；<template> <view class="big_box"> <image @load="loadImg($event)" @error="errImg" src="../pagesC/static/sun.jpg" mode="scaleTo..

1.注意点： 只有五种情况会触发导航栏tabBar页的onLoad函数，分别是：–1.1：首次进入到导航栏tabBar页面；–1.2：从微信分享进入的导航栏tabBar页面；–1.3：识别二维码跳转到小程序的导航栏tabBar页面；–1.4：使用了uni.reLaunch后销毁了所有其他页面，点击返回首页按钮，到的首页，也会触发首页的onLoad函数；或者直接使用uni.reLaunch到tabBar页，也会触发其onLoad;（因为reLaunch既关闭了所有页面 也可以跳转到任意页面,包括跳到.

场景需求：从小程序A页面跳转到小程序B页面，然后B页面还可以跳到A页面。跳转失效原因：–1.uni.navigateTo只能跳转到非tabBar页面，tabBar导航栏页面只能用uni.switchTab方法跳转；–2.uni.navigateTo跳转的页面栈太多了，超过十层页面栈就会导致跳转失败。解决办法：1.尽量使用uni.redirectTo替换uni.navigateTo；因为uni.redirectTo会关闭当前页面，跳转到应用内的某个页面。2.wx.navigateTo .

需求场景：从非tabBar页面B跳转到tabBar页面A，并想要携带参数。如果使用uni.switchTab传参，会导致tabBAE页面获取不到参数；原因： 官方文档有说，uni.switchTab路径后不能带参数；uni.navigateTo是可以传参，但是跳转到 tabBar 页面只能使用 switchTab 跳转解决方案： 跳转页面依旧使用uni.switchTab，参数使用uni.setStorageSync存到缓存内，跳转到tabBar后仅会触发onShow，此时在onShow内.

文末代码可以直接复制运行（只需要将中间的二维码图片、底部的微信和相册图片 改成你项目内的img图片即可成功运行）一、场景：在微信小程序 个人名片页面 含有微信头像和个人信息二维码（识别可跳转小程序指定页面并携带参数），要求点击 保存到相册 按钮，将此页面上半部分进行截图保存；还有分享功能，和识别二维码一样，文末代码逻辑也有；个人名片页面：保存到相册页面：二、需求分析：–2.1：二维码：生成动态二维码图片及携带参数跳转指定小程序页面（点此查看），这些功能和二维码图片都是后端实现的。前端

**一、场景需求：**在小程序个人名片页面A页面，生成用户的个人名片二维码（该二维码携带用户的唯一标识id）；微信扫一扫或长按图片识别这个二维码，可以跳转到小程序的B页面，并且在B页面拿到二维码上的唯一标识id；大致要求就是：小程序生成的这个二维码，可以识别跳转到小程序某页，且会携带某些自定义参数，在被跳转页面还可以拿到这些自定义参数。二、生成二维码，必须后端生成！（如果前端生成，总是会报access_token过期，导致获取二维码失败；而且前端获取需要把秘钥AppSecret写在前端，不安全；）.

阻止小程序某个页面上下滑动，最简单有效方法；直接对小程序当前页的最外层标签盒子，设置固定定位即可！设置固定定位后，页面的最大盒子宽度可能不是自动撑满的，那就自己在calc计算下宽度即可.box { // 加这两行代码是为了固定定位 解决此页面上下可滑动回弹问题 position: fixed; width: calc(100vw - 110rpx); height: calc(100vh - 100rpx); padding: 50rpx 55rpx;}...

uni-app的官方api uni.$on场景：微信小程序两个页面甚至多个页面之间，可能共用一个参数或者需要相互传递使用参数。例如页面A点击按钮，需要把A页面的item数据，赋值给页面B的formData，但是页面A只是传递数据给B，却不跳转到B。导致无法通过页面路径跳转传递参数，此时最好的办法就是使用页面通讯。A页面：uni.$emit传递数据datamethods:{ //获取数据 getData(){ let item={name:'张三',age:18} //

//把base64转换成图片 getBase64ImageUrl: (data) { /// 获取到base64Data var base64Data = data; /// 通过微信小程序自带方法将base64转为二进制去除特殊符号，再转回base64 base64Data = wx.arrayBufferToBase64(wx.base64ToArrayBuffer(base64Data)); /// 拼接请求...

参考：小程序后台设置域名

1.从任何页面返回到tabBar页面，都不会触发tabBar页面的onLoad函数；2.只有三种情况会触发导航栏tabBar页的onLoad函数，分别是：–2.1：首次进入到导航栏tabBar页面；–2.2：从微信分享进入的导航栏tabBar页面；–2.3：使用了uni.reLaunch后，点击返回首页按钮，到的首页，页会触发首页的onLoad函数...

需求场景：微信小程序不少API都有最低版本支持，为了避免不必要的麻烦，我们可以根据需要给小程序设置基础库最低版本，这样若用户使用的基础库版本低于设置的最低版本要求，则无法正常使用小程序，并提示更新微信版本。一、 首先需要明白几个概念：1.小程序的版本号：这个是你发布微信小程序时候，在小程序法工具上，自己填写的版本号（可以在小程序管理后台>版本管理下看到 小程序版本号）。2.基础库版本：小程序基础库官方日志， 这个是每隔一段时间，微信小程序开发文档会更新和废弃一些小程序的方法api。那么

问题：当用户第一次进入小程序，点击授权按钮后，点了拒绝，再次点击不会出现授权页面，只有再次进入小程序的时候，才会出发请求授权 。案例： 假如我们获取微信位置，第一次点击的时候弹起授权，用户点击的拒绝，当用户再次点击的时候，如何继续弹出授权？实现步骤：1、首先我们需要判断用户是否开启授权获取地理位置（wx.getSetting）2、如果已经授权（，直接获取位置（wx.getLocation）3、如果没有授权，弹出授权框（wx.authorize）— 3.1 点击确定之后，会走success,.

需求：点击按钮获取当前微信位置，以及点击拒绝授权后，下次点击还可以拉起授权窗口；拒绝授权后重新拉起授权操作：直接授权操作：一、问题1：报authorize scope.userLocation需要在app.json中声明permission字段；原因：因为微信小程序从2019年1月14日起新提交发布的版本若未填写地理位置用途说明，则将无法正常调用地理位置相关接口；解决办法： 在manifest.json文件中，mp-weixin属性下配置permission获取地理位置的权限代码如下：

直接在当前页面css下书写即可 不是在某个盒子class下书写 /* 解决小程序和app滚动条的问题 */ /* #ifdef MP-WEIXIN || APP-PLUS */ ::-webkit-scrollbar { display: none; } /* #endif */

介绍：项目使用的是uni-app做的微信小程序；uni-app里原来就用一个组件uni-indexed-list，是用来做通讯录的；可以直接看官方案例也就是hello-uniapp-master下的导航栏；但是官方这个是多选，且没有默认选中功能；故本文是在使用官方组件同时，修改原组件的代码来达到单选和默认选中功能；解决思路：...

1.首先需要在小程序后台-开发设置-服务器域名 配置好下载的域名。不配置：会导致下载失败和打开文件失败；2.pdf文件的url要确保可以浏览器直接打开。<template> <view class="pdf"> <view v-for="(item,index) in pdfList" :key="index"> <view>该pdf可以直接在浏览器打开</view> <view style="te

uni-app小程序图片使用有image标签和background-image背景图两种方式：下有获取本地图片的网络地址方式：见第四步一、方式一：使用image标签引入：1.官方文档说：src 仅支持相对路径、绝对路径，支持 base64 码；但是我使用了网络地址https也可以显示目前支持以下四种方式引入： <view>引入image的绝对路径src：</view> <image src="~@/static/iconimg/big.png"

uni.pageScrollTo({ scrollTop: 0, duration: 300, })

需求：要求小程序，中间的tabBar自定义凸起或者图标变大；问题：查看uni-app的tabBar文档可知，小程序是不支持midButton的；解决思路：隐藏uni-app原有的tabBar，然后换成自己手写的导航栏，进行定位和自定义样式；小程序页面截图：H5页面截图：一、pages.json:正常书写，注意H5的需要加上midButton部分{ "pages": [ { "path": "pages/index/index", "style": { "naviga

官方uni-app的弹框popup模板问题:官方的弹框示例页面在 /pages/extUI/pop

微信小程序官方获取手机号uni-app通过button获取微信小程序手机号参考链接

通过uni-app文档可知:实现微信登录，无论是app还是小程序，都需要唯一标识openid，然后通过openid取掉后端的登录接口，获取cookie然后做登录跳转；但是获取openid的方式不同，目前有两个方式获取到。1.通过uni.login（）方法，得到code，拿这个code调用后端写的接口获取openid（此方式微信小程序和app都支持，H5不支持）2.app还可以通过uni.getUserInfo 直接获取到openiduni-app微信登录app方法uni-app微信登录微信小

1.非H5端，不能使用浏览器自带对象，比如document、window、localstorage、cookie等，更不能使用jquery等依赖这些浏览器对象的框架。因为各家小程序快应用都不支持这些对象。2.APP 和小程序的导航栏和 tabbar 均是原生控件，元素区域坐标是不包含原生导航栏和 tabbar 的；而 H5 里导航栏和 tabbar 是 div 模拟实现的，所以元素坐标会包含导航栏和tabbar的高度。为了优雅的解决多端高度定位问题，uni-app 新增了2个css变量：–window-

需求： 在微信小程序页面中，长按识别图片二维码，识别出联系人后，点击添加好友；问题：微信官方社区说是小程序添加不了好友；目前只能通过微信小程序跳转至公众号，从公众号识别二维码后添加好友；条件： 1.具有小程序； 2.具有一篇包含二维码可以添加好友的公众号； 3.需要此公众号在小程序管理后台设置，关联此小程序。公众号关联小程序从小程序A页面，通过点击跳转，跳转到B页面（B页面就是通过web-view放置公众号链接即可）；我的需求是直接小程序打开就是公众号页面；那么只需要在首页设置成公众号即可；&

参考链接需求：从外部浏览器，点击H5链接跳转打开微信小程序；以及在微信内直接点击H5链接打开微信小程序；步骤1：小程序开发需要使用云开发创建项目，使用云开发生成的项目会自带云函数文件夹；步骤2：项目开启云开发步骤3：下载官方的H5静态html和public文件进行配置，下载地址（点击下载HTML 即可下载全部文件）；下载后文件夹有两个位置需要修改：下载的文件夹：步骤3.1：更改静态的html：替换6项云开发字段：（直接搜索replace 将对象位置的信息改成你的云开发配置）步骤3.2：

问题：本身代码写的有问题导致的。从首页A跳转到新增页面B，在B页面点击保存后，再跳到首页A。此时在首页A，这时候无论点击跳转哪个页面，跳转成功后都会立即再跳回首页。原因：B页面保存后，因为加了提示，然后本来想加延时定时器setTimeout再跳转回首页A，写错成循环定时器setInterval。导致仍和页面的跳转都会循环在跳转回首页bug。记录一下。...

需求：现有首页index和新增车辆页add-car。正常操作流程是：从首页index点击按钮，会携带参数id跳转到新增车辆页add-car。现在需求是用户A从首页index携带参数id跳转到新增车辆页add-car，在add-car页面点击分享按钮，将次页面发送给微信好友（被分享者B）；微信好友（被分享者B）点击分享卡片直接打开新增车辆页add-car，然后上传信息图片，点击下一步，传递参数id调用接口。完成操作。问题：1.因为是将新增车辆页add-car分享给用户打开新增车辆页add-car，微

问题：我们在小程序工具中开发时候，需要本地打包，但是当本地的打包文件大于2M时候，预览的二维码就会有问题，导致真机扫码打不开或者有遗漏。

问题： 首先小程序，更新版本发布后，用户的版本一般情况下仍是旧版本；需要手动删除小程序后，在重新搜索打开才能使用新版本；原因查看： 运营机制；更新机制；解决办法： 小程序官方文档解决办法 ； uni-app版本控制方法 ；将以下代码放在app.vue文件的onLaunch内或者onShow内： const updateManager = uni.getUpdateManager(); updateManager.onCheckForUpdate(function (res) {

import store from '../store'let baseUrl = ''let isExisited = falseconst $https = {}switch (process.env.NODE_ENV) { case 'development': // 公共的地址开发 /* #ifdef MP-WEIXIN */ baseUrl = 'https://www.zuihuibao.cn/' /* #endif */ /* #ifd

我的只是在html代码部分 使用<button open-type="share" >发送</button>点击按钮就可以分享到微信好友 且打开也是正常的小程序页面 可以操作

原博主：点击查看需求： 微信小程序，上传图片，成功后图片有水印，既图片的网络地址也有水印。上传图片使用uni-app的uni.chooseImage（）方法，水印是用canvas。未知问题： 小程序模拟器上，上传第一张图片没问题，再次上传第二张图片，会发现第二张图片显示出来的是两张图片的叠加图；但是在真机使用时候，却不会出现也不影响（故没有处理，猜测解决方案：可以再每次上传图片处理水印时候，使用不同的canvas元素，不要使用同一个去做水印）；上传一张图：上传第二张图：（此问题只会在小程序模拟器

项目需求：点击页面的 品牌型号 按钮，打开弹框，将 车架号码 参数传入接口获取到对应的 品牌型号列表，在进行选择后关闭弹框。实际开发中，我在父组件里面引入了弹框子组件；诡异的事情发生了：在小程序页面有两个问题1.已开始进入到父组件时候，就自动触发了子组件弹框的created（）事件；2.但是在使用uni-app的弹框组件uni-popup-dialog时候，当点击父组件打开弹框时候，子组件弹框是打开了，但此时既不触发created（），也不触发onLoad（）；在H5浏览器页面，点击打开按钮，是正常触