a_靖的博客

1. 申请测试账号跳转本地调试或者测试环境调试2.拼接自动跳转官方文档下面的参数换成你的，redirect_uri 需要是上图配置的网址下面的地址。我弄出来的本地连接测试：https://open.weixin.qq.com/connect/oauth2/authorize?appid=wxb5de9432888975bf&redirect_uri=http%3A%2F%2F192.168.8.87%3A8080%2F%23%2F&respons...

1. 使用colorui UI库下载coloruiui库-[github](https://github.com/weilanwl/ColorUI)；下载好之后放在components 目录2.在 components 目录创建tabbar.vue 文件，里面代码是：<template> <view class="cu-bar tabbar bg-white shadow foot"> <view class="action" @click="...

前言：最近需要搭建一套基于uniapp 的代码模板，适应各平台的快速打包部署，为提高代码复用率，提升生产力，所以需要构建一套优雅的前端项目架构，下面分享记录一下我的封装。代码封装我暂时分为三个层面：1 底层的封装缓存处理，第三方API封装，用户信息鉴权处理，网络请求，应用配置，数据统计，数据埋点，全局page对象劫持封装，通用工具类封装（时间处理，通配符取参，文件下载，上传，加密，解密，长链接，音视频播放器），WebRTC（网页实时通信技术），webview通讯释：这个层面基本都是.

canvas绘制海报分享，海报中设置圆角二维码，背景图，动态的文字，绘制完成以后保存为图片，可长按分享海报图片。

自定义picker滚动选择器样式，样式可以随意修改，运行环境支持H5，小程序，APP

跑马灯无间隙无效循环滚动效果图：本篇文章要实现的是跑马灯无间隙无效循环滚动；marquee 标签滚动完一次以后，第二次会空白一个屏幕宽度才开始，而我们的需求是接在后面马上开始。我在网上找了一圈，没有发现能满足需求的属性，于是自己写逻辑了。注释：以下代码块的内容部分，应该填充跑马灯需要滚动的内容，自己随便填充。示例：我的是for循环遍历的内容默认跑马灯代码（如果可以接受有留白，用这代码就行，不用往后看）<marquee direction="left".

代码环境：uniapp秋云uCharts图表组件https://demo.ucharts.cn/#/代码说明：在插件市场导入插件秋云 ucharts echarts 高性能跨全端图表组件 - DCloud 插件市场 uCharts v2.3上线，支持nvue！全新官方图表组件，支持H5及APP用ECharts渲染图表，uniapp可视化首选组件https://ext.dcloud.net.cn/plugin?id=271使用插件uCharts动态可视化配置图表，然后拿到配置的代码放在自己项...

使用mp-html 富文本插件，就可以支持富文本内的视频播放。安装：npm install mp-html使用方法<template> <view> <mp-html :content="html" /> </view></template><script> import mpHtml from '@/components/mp-html/mp-html' export default.

uniapp移动端H5预览文件实现分为两个场景处理：（这里以预览PDF文件为示例，在线预览就是查看网络文件）1. IOS客户端预览PDF文件IOS客户端预览PDF文件可以通过跳转文件地址实现预览，因为苹果手机的浏览器自带阅读器2. 安卓客户端预览PDF文件安卓客户端需要在源码添加一个插件来实现文件在线预览。添加插件步骤，下载插件，放导static目录下。如图所示：下面是实现示例代码：<view class="card p_r" @click="openF.

实现该功能踩过的坑1.swiper的swiper-item中image图片无法在canvas的上层显示，会被canvas 覆盖2.swiper的swiper-item 里面放cover-image 会样式错乱3.scroll-view里面放cover-image 会样式错乱解决方案：使用CSS样式实现，超出部分隐藏，显示滚动条 <cover-view class="popupCrad"> <cover-image class="popupCrads"..

1.下载点击跳转下载2.解压，拷贝build和web目录到你的项目目录下3.使用pdf.js时，当有跨域的问题时，会加载失败，错误信息为file origin does not match viewer's。修改起来简单粗暴。直接注释掉web/viewer.js中的以下代码，不去判断跨域即可。（搜索viewerOrigin能搜索到）if (origin !== viewerOrigin && protocol !== 'blob:') { th...

实现代码：<view class="" @touchstart="touchstart" @touchend="touchend"></view>data() { return { touchData: {}, //滑动事件数据 }}methods: { touchstart(e) { this.touchData.clientX = e.changedTouches[0].clientX; this.touchData.client

解决曲线图或者折线图在两端中间没有数据时无法绘画成线的问题源码修改，解决方案：在数据之间填充假数据，并且创建一个和点的数据同级的 list 来验证是不是假数据，如果是假数据就不绘制点，是真数据才绘制点，达到点和点之间没数据但是能连线的效果先看效果图：数据格式：我这里是用 grow_info 里面的id来判断是不是真数据，有id就是真数据，否则就是假数据解决：在u-charts源码里面找到drawMixDataPoints 方法，然后在这个方法里面找到调用drawPoint..

效果图：CSS动画效果无限循环放大缩小<image class="anima" mode="widthFix" @click="nav" src="@/static/1_btn.png"></image> .anima { animation-name: likes; // 动画名称 animation-direction: alternate; // 动画在奇数次（1、3、5...）正向播放，在偶数次（2、4、6...）反向播放。 animat

实现可以拖动的曲线图，自定义X轴数据的缩进，自定义X轴显示多少格。效果图数据格式，数据说明代码可见曲线图实现u-charts.js 可以在官网下载<template> <view class="qiun-columns"> <view class=""> <view class="qiun-bg-white qiun-title-bar qiun-common-mt"> <view class="q..

原因应该是IOS不允许自动播放音频，需要与用户有交互，就是用户点击一下之后，再调用就可以了在main.jsVue.prototype.playAudio = function(audioUrl) { var innerAudioContext = null; innerAudioContext = uni.createInnerAudioContext(); //创建播放器对象 innerAudioContext.autoplay = false; innerAudioContext

上代码：let list=[1,2,3]try { list.forEach(item => { if (item==1) { console.log('等于1就跳出循环') throw new Error("EndIterative"); } })} catch (e) {}

uniapp 下拉刷新和下拉加载更多实现代码，兼容小程序，H5，app，真机测试可用。实现代码1.在页面写这两方法，分别是下拉刷新和下拉触底的监听事件 // 下拉刷新 onPullDownRefresh() { console.log('下拉刷新') setTimeout(() => { console.log('下拉刷新停止') uni.stopPullDownRefresh() },5500) }, // 上拉加载 onReachB

链接HBuilderX 自 2.4.7+ 版本开始支持Sign in with Apple（苹果登录），苹果登录是iOS13新增加的功能，当你的应用使用了第三方登录比如微信登录，同时也需要集成苹果登录，否则提交AppStore审核会被拒绝。根据苹果审核指南要求，如果 app 使用第三方或社交登录服务 (例如，Facebook 登录、Google 登录、通过 Twitter 登录、通过 LinkedIn 登录、通过 Amazon 登录或微信登录) 来对其进行设置或验证这个 app 的用户主帐...

uniapp开发APP之真机调试HBuild X manifest.json 设置下面会有实现代码，先看一下效果，点击微信登录就会跳转到微信去授权登录，可以拿到用户的唯一标识（openid,access_token,unionid），和头像，昵称等基础信息代码：<template> <view class="content"> <button class="" @click="toWxLogin"> 微信登录 </butto

一：华为手机实时调试APP代码基座流程1.打开手机的开发者模式，允许USB调试，手机操作流程，进入设置-关于手机，长按版本号（开启开发模式），然后按图操作，下拉屏幕发行已连接 USB 调试，手机端就暂时不用再操作了2.电脑安装360手机助手，这个软件打开浏览器或者用360软件助手下载就好了，它是 HBuild X 和手机连接的桥梁3. HBuild X 操作运行之后就可以在控制台查看进展，会自动在手机安装 APK调试基座 （用于调试的APK，APK就是安卓APP的安装包）.

App.vue<script> import socket from '@/util/IM.js' export default { watch: { '$route': function() { var page = getCurrentPages(); console.log('watch-监听路由', page); } }, globalData: { ImAuth: socket.connect(), }, onLaunch

先看效果吧，封装以后使用很方便，两行代码就能得到微信网页开发中的 jssdk 的 wx.config 执行了 wx.ready 还是wx.error ，如果返回 true 就标识执行了ready ， 可以调用JSSDK的 API 了，如下图示例代码：this.$common.Init.call(this);this.wxjssdkInti().then(rr => { console.log('jssdk初始化成功', rr) wx.getLocation({ type: 'wg.