![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
小程序
夜跑者
目前从事web前端,小程序开发。熟悉vue框架,uni-app跨端框架。
展开
-
uni-app uview1.x u-slider组件最小值最大值 使用问题
在uni-app项目中UI设计的进度条不能用uview2.x中u-slider组件实现其中的自定义滑块,所以采用了uview1.x来实现,见之前的一篇文章(看了一下uview1.x u-slider源码,发现就是这么设计的,那么如何修改呢?原创 2022-11-26 14:27:55 · 1058 阅读 · 0 评论 -
uView u-slider 自定义滑块
项目中集成的是vView2.0组件库,u-slider组件中有 blockStyle 属性,看着是用来设置自定义滑块的。看了一下uView1.0组件库 u-slider组件有自定义插槽属性,所以就想着把uView1.0 中的u-slider组件给单拎出来在项目中集成。现在slider 已经是自己项目中的一个组件了,为了方面可以对slider简单改造一下,例如给activeColor,inactiveColor 属性设置个默认颜色,这样使用的时候就不用传值了。不用设置选自定义插槽属性了,直接写插槽就行了。原创 2022-11-19 12:24:23 · 2535 阅读 · 0 评论 -
uni-app 微信小程序 用高德sdk获取地理位置,以及天气信息
你可能在开发微信开发者工具中,以及真机调试中都能获取地理位置和天气信息,但发布到体验版,或发布到显示,一直loading 获取不到天气信息。就是因为没有把高德小程序sdk接口用到的URL地址添加到小程序服务器域名中。在这个网页最下面,按步骤来就可以了。注意创建完应用后,点击添加按钮,选择小程序sdk 生成key。注意在接口传递参数中要加上fail 字段,否则控制台会报错。原创 2022-09-06 18:15:10 · 3909 阅读 · 1 评论 -
微信小程序--background-image直接设置本地图片路径,编辑器正常显示,真机运行不显示解决方法
文章转自:微信小程序--background-image直接设置本地图片路径,编辑器正常显示,真机运行不显示解决方法 - 爱码网微信小程序,设置background-image直接设置本地图片路径。编辑器正常显示,真机运行不显示转存失败重新上传取消 background-image只能用网络url或者base64图片编码。1、将本地图片转为网络url后设置到background-image上例如,云开发,后台上传本地图片2、本地图片转成base64格式后设置到background-image上3、弃用转载 2022-08-31 08:36:24 · 4205 阅读 · 0 评论 -
uni-app是如何构建小程序的?
文章转自:uni-app是如何构建小程序的? - 掘金推荐看原文。是一个基于Vue.js语法开发小程序的前端框架,开发者通过编写一套代码,可发布到iOS、Android、Web以及各种小程序平台。今天,我们通过相关案例分析uni-app是怎样把Vue.js构建成原生小程序的。uni-app是基于vue-cli脚手架开发,集成一个远程的Vue Presetuni-app目前集成了很多不同的项目模版,可以根据不同的需要,选择不同的模版运行、发布uni-app,以字节小程序为例二.原理uni-ap转载 2022-06-09 16:56:10 · 3521 阅读 · 0 评论 -
支付宝小程序跳转支付宝官方页面
my.ap.navigateToAlipayPage 是用于小程序中跳转到支付宝官方业务或运营活动页面的 API。具体用法参考官方文档:my.ap.navigateToAlipayPage | 小程序原创 2022-05-24 17:29:11 · 1698 阅读 · 0 评论 -
uni-app input组件 v-model 只能输入小数点后2位
有这么一个需求:一个input输入框列表,只能输入数字,且用户只能输入小数点后2位,在失去焦点时可以拿到其输入值,如下所示输入列表很好实现,v-for 就可以了, 输入数字也好办,设置input组件type="number"就可以了。失去焦点时拿到输入值也好做,用input 组件@blur 事件就可以。代码如下:<template> <view class="content"> <view> <text class="title原创 2022-05-14 15:42:03 · 5797 阅读 · 1 评论 -
错误import vue 导致小程序包体积剧增问题
最近和另外部门合作开发一个微信小程序,采用的unp-app 跨端框架。当对方代码引入uview-ui组件库后,包体积就开始剧增。刚开始怀疑是在App.vue中 引入uview-ui全局样式文件导致的,去掉后确实包体积降下来不少。 但发现我们项目中也引入uview-ui 包体积并没有因此明显增加。继续寻找原因,2,3天过去了,最终发现了一个问题。在main.js 中写了如下代码Vue.prototype.getToken = Request.getTokenvue原型中挂载了一个接口,在.vue文原创 2021-12-31 15:47:38 · 744 阅读 · 0 评论 -
获取普通二维码参数
有这么个需求,在大屏端贴上一个普通链接生成的二维码,微信扫一扫这个二维码后就能拉起小程序。但在测试阶段,想拉起体验版小程序,就需要在微信后台->开发设置->扫普通链接二维码打开小程序 中添加一个规则。那么怎么从这个二维码中获取到链接呢,因为没有配置规则之前,微信扫这个码直接进入的是H5页面。在这个H5页面右上角点击三个点,下面有个复制链接, 复制链接后放到浏览器地址栏中就看到了。...原创 2021-12-10 08:11:39 · 654 阅读 · 0 评论 -
字节跳动小程序审核不通过二三事
好像最近字节跳动小程序发线上版本审核比较严。发了2次才审核通过。第一次因为隐私政策问题。我们的小程序初次打开进入首页时,弹出了地理位置授权弹窗提示。这点不符合要求。审核不通过原因如下:参考其他小程序,初次进入小程序给出一个用户隐私弹窗,如果用户点击同意再拉起地理位置弹窗,如果不同意则使用默认地址。修改完成后再次提交审核又没通过,这次提示如下:是在登录模块,一键授权手机号提示按钮文案上。我们的文案是 “抖音一键登录”,按给出的登录规范,整改为“手机号一键登录”。再次提交审核,这次通过了原创 2021-09-23 09:01:28 · 1058 阅读 · 0 评论 -
微信扫描普通二维码调起体验版与已发布版的小程序
文章转自:微信扫描普通二维码调起体验版与已发布版的小程序_baozaobenren的博客-CSDN博客公司有这样一个需求,就是用微信扫描二维码直接调起我们的小程序,前期不知道,直接扫描二维码,调起的使我们正式版的小程序,但我们还要测试,多番探索,终于找到答案,在微信公众平台中–>开发–>开发设置,扫普通链接二维码打开小程序中选择体验版,测试连接填一下你想测试的二维码(二维码规则必须符合你上面填写的二维码规则)然后保存 保存之后可能需要等待个一两分钟才可以生效———————————.转载 2021-09-09 20:18:27 · 791 阅读 · 0 评论 -
关于字节跳动小程序授权问题解决方案
文章转自:https://blog.csdn.net/AshesO/article/details/119906263授权弹窗无法调起在字节跳动小程序中调用有关于用户授权的接口的时候, 如果在首次调起授权弹窗的时候用户选择了拒绝,此时再次调用该接口的时候,将不会再次调起授权弹窗。在字节跳动官方文档中有关于这种情况的描述, 如下小程序仅在 API/组件 首次 调用/使用时弹窗询问用户。若用户允许则正常调用,否则本次调用失败。且在用户手动授权之前,开发者再次调用需要授权 API 时,会直接进入接口的转载 2021-09-04 14:49:16 · 1466 阅读 · 0 评论 -
头条小程序 密码 显示隐藏 真机兼容问题
大家都知道在输入密码时,一般都有密码显示隐藏功能,例如:在uni-app框架下,可以控制两个input 来实现:在头条开发者工具中显示正常,但在真机上出现了以下现象:找不到真正原因。只有换种写法了,用一个input来实现,来控制password属性,如下所示:...原创 2021-09-04 13:41:33 · 137 阅读 · 0 评论 -
微信小程序获取unionId
项目中调用一个后端接口获取access_token, 需要传小程序的openId, unionId作为参数。这是我们新开发的小程序,已经申请了小程序的appId, 通过调用后端接口已经获取到了openId, 但unionId 一直没有获取到。 通过查阅资料发现,获取unionId 需要在微信开发平台绑定小程序。之前我们做过一个微信小程序,注册了微信开发平台账号,而且已经绑定了之前的那个小程序。现在就用这个微信开发平台账号绑定我们这个新开发的小程序就可以了。...原创 2021-09-04 10:29:42 · 3278 阅读 · 1 评论 -
uni-app 编译出的微信小程序和头条小程序生命周期的差异
微信小程序:createdonLoadonShowmounted头条小程序:onLoadonShowcreatedmounted原创 2021-08-16 11:18:39 · 108 阅读 · 0 评论 -
uni.login接口报 login:fail system error
用vuec-cli 创建的uni-app 小程序项目,在微信端调用uni-login接口,返回正常。但在头条小程序这个接口报错误:login:fail system error, 而且真机调试时,生成不了二维码。检查了一遍,也没看出来哪里有问题,首页都渲染出来了。原来是登录账号的问题,点击注销后,重新登录一下账号就OK了。...原创 2021-08-16 10:25:09 · 2549 阅读 · 0 评论 -
appid 原始id_微信开发之小程序登录相关的各类ID
文章转自:https://blog.csdn.net/weixin_39926193/article/details/110360299背景最近在实际业务中,为了配合产品同事优化小程序的登录流程,同时还想通过微信授权登录 + 手机号授权自动为用户创建一个符合基础用户服务体系的业务账户。从而降低用户使用产品的链路成本。在沟通过程中,发现很有必要梳理一下关于小程序登录相关的所谓如何实现静默授权、如何实现主动授权、如何获取手机号、什么是小程序的 UnionID的等等衍生问题概念、获取方式、使用场.转载 2021-07-28 09:41:00 · 3086 阅读 · 0 评论 -
查看微信小程序的原始账号id和appId
文章转自:https://blog.csdn.net/be_strong_web/article/details/117386475这边接到需求说要在H5页面中打开小程序,查到微信文档找到:https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/Wechat_Open_Tag.html使用 wx-open-launch-weapp标签来跳转这个标签需要传入所需跳转的小程序原始id,即小程序对应的以gh_开头的id下面就来说下转载 2021-07-28 09:31:46 · 5517 阅读 · 0 评论 -
WGS84,GCJ02之间的区别
文章转自:https://blog.csdn.net/a384310064/article/details/10618554384坐标系可以理解为是真实坐标系,是一个地点的实际坐标值。02坐标系是加密后的坐标系,是为了国家安全考虑。对应的不是实际的坐标值,但是在加密的坐标下,进行导航、定位等操作是完全不受影响的,只不过坐标不是真实的坐标而已。我国的各个地图软件,均使用02坐标系进行街景地图测绘和卫星地图测绘,因此可以看到我国的地图应用上均不会标注经纬坐标信息。不过也有个例外,百度地图采用BD09坐标转载 2021-07-27 08:51:51 · 887 阅读 · 0 评论 -
小程序中分享时如果携带url参数要对其进行编码
在小程序中采用webview嵌入H5页面 这个H5页面支持分享。当然不能直接分享嵌入的H5页面,而是采用小程序的分享。所有分享的时候要把这个H5页面的url 作为参数携带上。 如果不对H5页面的url进行编码则分享出去后页面打不开,是空白页面。编码方法如下:let _sharePath = '/pages/publicPages/webViewLazyLogin/webViewLazyLogin?url=' + encodeURIComponent(this.sharePath)这样分享出去...原创 2021-07-15 08:56:50 · 829 阅读 · 0 评论 -
小程序 父子组件mounted生命周期顺序问题
在用uni-app框架开发小程序时,微信端表现正常,子组件mounted生命周期先执行,父组件mounted生命周期后执行,这样在父组件mounted生命周期调用子组件的方法是没问题的,例如:this.$refs.child.test() 。 因为这时子自己dom已被渲染出来了。但在头条端则不行,顺序正好反过来了,父组件mounted生命周期先执行,子组件mounted生命周期后执行。自然想到的方法是加nextTick。这样: this.$nextTick( () => { this.$refs.原创 2021-07-01 09:28:20 · 1724 阅读 · 0 评论 -
头条小程序 button组件 设置边框问题
在uni-app框架下适配头条小程序,给button组件设置圆角出现了以下现象:按uni-app文档给button组件加上plain 在开发者工具中可以了,但真机上还是不行。看了一下字体跳动小程序文档中对button组件的描述:Tip:目前,组件的边框不是通过border属性来控制的,而是有个:after伪类,所以如果需要修该边框样式,请对该伪类元素设置样式。这个border 只能用伪类来控制。所以我们给全局button组件样式增加一个公共属性:/* #ifdef M...原创 2021-06-28 14:40:18 · 414 阅读 · 0 评论 -
微信小程序新能力:URL Scheme,可从短信跳转小程序
最近小程序上线了一个超级流量的新入口 URL Scheme。通过小程序页面的URL Scheme,可以在短信、邮件或微信外部的网页中打开小程序。最近小程序上线了一个超级流量的新入口:URL Scheme。通过小程序页面的URL Scheme,可以在短信、邮件或微信外部的网页中打开小程序。那么如何实现呢?官方文档已经写的很清楚啦,这里简单介绍一下。首先,获取URL Scheme,通过服务端接口可以获取打开小程序任意页面的URL Scheme,支持生成到期失效和永久有效的URL Scheme。然转载 2021-06-11 08:35:21 · 6290 阅读 · 1 评论 -
flex-shrink: 0 来固定元素不被挤压
看下代码:<html> <head> <style type="text/css"> .div-wrapper { width: 600px; background-color: grey; display: flex; justify-content: space-between; } .input-cls{ widt原创 2021-06-28 17:13:16 · 9175 阅读 · 0 评论 -
uni.navigateTo 最大支持跳转10个页面
在商城小程序项目中单品页下面一般会有推荐商品,或者猜你喜欢等部分,这样从一个单品页->推荐商品->单品页 跳转 如果跳转超过10个页面,你会发现跳转不下去了。uni.navigateT原创 2021-05-31 19:59:51 · 2188 阅读 · 1 评论 -
小程序分享到朋友圈功能
文章转自:https://zhuanlan.zhihu.com/p/159265422转载 2021-05-31 11:18:25 · 1167 阅读 · 0 评论 -
小程序 二维码编译使用场景
好久没有写博客了,从过年后没多长时间就开始了996,用uni-app框架做一个商城小程序。之前我们有微信小程序,抖音小程序,后来又找人做了个支付宝小程序。维护起来成本比较大,所以这次下jue'x...原创 2021-05-29 11:13:49 · 1185 阅读 · 0 评论 -
微信小程序webview与h5通过postMessage实现实时通讯的实现
文章转自:https://www.jb51.net/article/167957.htm这篇文章主要介绍了微信小程序webview与h5通过postMessage实现实时通讯的实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧在做 React Native 应用时,如果需要在 App 里面内嵌 H5 页面,那么 H5 与 App 之间可以通过 Webview 的 PostMessage 功能实现实时的通讯,但是在小程序里面,虽然转载 2021-04-26 17:25:27 · 10575 阅读 · 8 评论 -
uni-app getPhoneNumber encryptedData iv 发给后端获取手机失败问题
之前用微信小程序<button class='bindbtn' open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber">微信授权手机号一键登录</button>授权后,返回的参数encryptedData iv 直接调用后端get接口,后端再解密后可以成功拿到手机号。但用uni-app 写的<button v-else class="login-mobile" open-type="getPh原创 2021-03-26 12:11:25 · 1985 阅读 · 0 评论 -
聊聊微信小程序开发中的appid、openid、unionid
文章转自:https://blog.csdn.net/shenzhou_yh/article/details/104603653文章目录appid定义获取途径用途openid定义获取途径用途unionid定义获取途径用途小程序登录流程最近在开发中涉及到了与小程序的交互需求,所以自己想梳理一下这儿的关系,本文主要讲解appid、openid、unionid的定义、获取途径、以及用途。appid定义小程序唯一凭证,即 AppID,每个小程序都有自己的一个appid获取转载 2021-03-17 10:10:52 · 3274 阅读 · 0 评论 -
uni-app 中定义全局变量globalData注意事项
uni-app 关于全局变量有以下描述:小程序中有个globalData概念,可以在 App 上声明全局变量。 Vue 之前是没有这类概念的,但 uni-app 引入了globalData概念,并且在包括H5、App等平台都实现了。在 App.vue 可以定义 globalData ,也可以使用 API 读写这个值。globalData支持vue和nvue共享数据。<script> export default { globalData: {原创 2021-03-17 08:43:58 · 4881 阅读 · 0 评论 -
小程序跳转小程序之间传值和接收参数
文章转自:https://blog.csdn.net/tianlifeiyu/article/details/81704601A小程序跳转到B小程序,并且把参数带到B小程序。A小程序代码:wxml<navigator target="miniProgram" open-type="navigate" app-id="{{BappId}}" path="{{path}}" extra-data="{{data}}" version="develop" bindtap='navgatorF转载 2021-03-16 15:14:30 · 1547 阅读 · 0 评论 -
如何在uni-app使用iconfont
文章转自:https://www.jianshu.com/p/7fc08b1b4d85如何在uni-app使用iconfontRogi关注0.4922019.07.19 15:37:28字数 171阅读 22,818第一步先去iconfont挑选要用到的图标挑选图标第二步把图标下载下来图标下载第三步下载完了之后打开文件,除了iconfont.css其余文件一概删除除了iconfont.css其余文件一概删除第四步回到自己的ic...转载 2021-03-10 15:41:43 · 619 阅读 · 0 评论 -
微信小程序wx.createVideoContext play pause等接口不起作用
在自定义组件中使用微信小程序video组件,调用wx.createVideoContext 方法后,再进行play pause不起作用。发现此方法的第二个参数this是必填的。需要这样:const v = wx.createVideoContext('myVideo', this);v.seek(this.data.switchPos)v.pause()官方文档写的不明确,也是醉了。...原创 2021-03-03 14:26:46 · 2824 阅读 · 5 评论 -
uni-app网络请求封装
文章转自:https://www.jianshu.com/p/4d090698d9611. 未封装前index.vue页面使用getMachineNum:function(){ var timestamp = Date.parse(new Date());//时间戳 var token = uni.getStorageSync(_self.sessionKey); var device = "wxapp"; var ver = "1.1.30";转载 2021-03-01 13:57:39 · 737 阅读 · 0 评论 -
动态生成 uniapp 配置文件 pages.json,方便项目管理
在用uni-app开发小程序项目中,按官方文档需要把所有页面路径都放到pages.json文件下,导致pages.json文件较大,可读性差。更主要的是多人开发时,合入代码时会产生冲突。有没有办法可以动态生成pages.json文件呢?当然有,请看:https://blog.csdn.net/fungleo/article/details/105165774这种方法需要运行项目之前先node router/build.js 事先生成pages.json文件。还有没有其他办法? 请看下文:..原创 2021-02-26 17:27:50 · 5462 阅读 · 11 评论 -
动态生成 uniapp 配置文件 pages.json 的解决方案
文章转自:https://blog.csdn.net/fungleo/article/details/105165774最近接手了一个基于uniapp的开发项目,我个人对于它能够使用同一套代码就能够开发 h5\app\小程序 的强大功能表示非常钦佩。但是其配置文件pages.json也让我十分郁闷,原因无他,只因其是写死JSON文件,在管理的时候是十分不便的。在搜索了一些资料,期望可以用pages.js文件来替代pages.json配置文件(JS的动态能力,可以很方便的拆分路由配...转载 2021-02-25 17:53:41 · 3038 阅读 · 0 评论 -
uni-app 创建typescript 项目 并且引入 vant
文章转自:https://www.cnblogs.com/yf-html/p/12975355.html前言在小程序上应用uniapp 然后引入ts ,你说香不香,哈哈哈好了 先来一发教程:官网下载 软件https://uniapp.dcloud.io/我创建的TS项目是,用cli 命令行创建的全局安装vue-clinpm install -g @vue/cli创建uni-app使用正式版(对应HBuilderX最新正式版)vue create -p dclo..转载 2021-02-23 13:45:06 · 1699 阅读 · 1 评论 -
小程序多端框架全面测评
文章转自:https://developers.weixin.qq.com/community/develop/article/doc/000eaadb944de06374485c3ed51813最近前端届多端框架频出,相信很多有代码多端运行需求的开发者都会产生一些疑惑:这些框架都有什么优缺点?到底应该用哪个?作为 Taro 开发团队一员,笔者想在本文尽量站在一个客观公正的角度去评价各个框架的选型和优劣。但宥于利益相关,本文的观点很可能是带有偏向性的,大家可以带着批判的眼光去看待,权当抛砖引玉.转载 2021-02-20 09:45:04 · 603 阅读 · 0 评论 -
小程序webview跳转页面后没有返回按钮完美解决方案
文章转自:https://www.jianshu.com/p/a7bb1a826548随着小程序越来越火爆,使一个产品如果只有公众号H5页面和APP显得不怎么完美,总感觉不搭上小程序这趟流量车,就会少了点什么,心里别扭地很。在此驱动下,我所在公司也决定赶紧上车。但是,如果要按照小程序的套路重新写一份的话,又感觉付出的时间成本太大了,非常的不划算。于是乎,脑子灵光一闪,想起了小程序貌似有个小弟叫webview,webview是啥,按字面意思就是网页视图(来自百度翻译)。官方是这么定义的:web-转载 2020-12-24 09:28:03 · 2137 阅读 · 0 评论