
uniapp(小程序)
柑橘乌云_
希望我的博客,能帮你解决学习或工作中所遇到的问题
展开
-
uniapp开发h5,引入微信开放标签实现h5跳转小程序功能,全网最全最细踩坑记录
首先需要在项目中引入微信的sdk,具体引入方式详见我写的另一篇文章,里面包含了引入sdk以及配置wx.config的详细教学以及踩坑记录。如果引入完微信sdk的前提下接下来就是根据微信文档提供的demo来引入开放标签debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印appId: '', // 必填,公众号的唯一标识timestamp: , // 必填,生成签名的时间戳。原创 2024-03-26 17:23:58 · 3176 阅读 · 0 评论 -
在微信小程序里的ecahrts图表,tooltip中内容有黑色阴影的问题
tooltip并没有设置文字阴影相关配置,但是实际真机测试出来有黑色阴影(本地编译器没有阴影), 经过研究发现,需要在tooltip中加上以下配置就OK了。textShadowBlur必须写,并且不能为0,否则textShadowColor不生效。原创 2024-03-08 15:13:44 · 1497 阅读 · 3 评论 -
为什么微信小程序不用div而是用自创的view标签?
但是考虑到小程序是一个多 WebView 的架构,每一个小程序页面都是不同的WebView 渲染后显示的,在这个架构下我们不好去用某个WebView中的ServiceWorker去管理所有的小程序页面。得益于客户端系统有JavaScript 的解释引擎(在iOS下是用内置的 JavaScriptCore框架,在安卓则是用腾讯x5内核提供的JsCore环境),我们可以创建一个单独的线程去执行 JavaScript,在这个环境下执行的都是有关小程序业务逻辑的代码,也就是我们前面一直提到的逻辑层。原创 2023-12-28 09:38:59 · 637 阅读 · 0 评论 -
微信小程序Snapshot导出海报
设置版本库>=3.0.1。原创 2023-12-21 12:51:16 · 1377 阅读 · 2 评论 -
wx.chooseLocation 用户选择地理位置的api使用方式,(uniapp)
然后就是需要登录微信管理后台 ===》开发管理 ===》接口设置里面 开通对应api。调用这个api前需要在manifest.json里面配置声明该接口(必须)最后就是在设置===》服务内容声明 修改用户隐私保护指引。框架:uniapp ,开发微信小程序,遇到的场景:需要用户选择地理位置。原创 2023-12-13 15:59:21 · 1167 阅读 · 0 评论 -
uniapp 开发微信小程序 登录功能
登录一般会获取电话号码,但是电话号码获取的前提是需要,在微信开发者平台 进行小程序的微信验证。如果小程序关联过已认证的工作号,那么可以复用公众号资质快速认证。认证时需要支付300元认证费用。大概需要1-3工作日。打开小程序后台 -> 设置 -> 基本设置。原创 2023-06-01 10:13:08 · 702 阅读 · 0 评论 -
uniapp微信小程序 图片&文件上传并且支持图片和文件预览(pdf等文件预览)巨细教学!
这里要提一个bug就是说,这个组件设置v-model 后上传文件后,按道理再去读取这个v-model的值就应该是之前上传的文件数据,但是打印后并没有数据,而只有在点击删除文件后,再读取v-model才会有值,这个bug在社区很早就有人提出了,所以我采用通过监听select事件去手动存储文件数据,然后对应delete事件也删除数组中对应的文件数据。其次因为我项目中的需求是点击文件名字预览,那么文件的展示是手写的,组件原本的文件展示我用display:none隐藏掉了。原创 2023-11-24 11:32:21 · 6632 阅读 · 2 评论 -
微信小程序主包和分包资源相互引用规则
文档中只提到了分包对于兄弟分包和主包之间的引用关系,但是并未提及,主包是否可以引用分包资源。其实只需要明白两点,那么其实这里就已经很明显了,如果想要主包使用分包的资源,那么在调用资源时,要确保已经预加载过分包。举例:tabbar首页页面,调用packageA包的某函数。那么就需要配置预加载。那么接下来是否调用成功就取决于用户手机加载分包速度的快慢了。第一点:分包永远都是异步加载的。第二点:主包可以预加载分包。原创 2023-11-10 09:39:35 · 4800 阅读 · 0 评论 -
uniapp 微信小程序 授权隐私流程 网上没有的踩坑记录!
微信小程序授权蓝牙等隐私接口,需要在小程序后台管理系统里配置用户隐私保护指引,不然会一直fail原创 2023-11-01 15:04:06 · 696 阅读 · 0 评论 -
uniapp 开发微信小程序 v-bind给子组件传递函数,该函数中的this不是父组件的二是子组件的this
这个方法因为定义了全局变量that 那么该变量就只能用一次,不然会有赋值覆盖的情况。解决办法:子组件通过缓存子组件this然后,用bind改写this。要么就弃用v-bind传入函数,改为emit传入自定义事件。原创 2023-10-31 14:21:11 · 692 阅读 · 0 评论 -
uniapp开发微信小程序,webview内嵌h5,h5打开pdf地址,解决方案
h5 和pc页面 都需要配置业务域名,但是读到这里,大家就有疑问了,不就是多嵌套了一层页面然后还是iframe嵌入的pdf吗,对的!)但是众所周知,微信小程序内嵌webview的域名是需要配置业务域名的,以及该域名内的iframe网址也是需要配置业务域名,那么就没办法配置这个oss地址为业务域名。根据公司要求,让我写一个h5,后续会嵌入到合作公司的微信小程序的webview中,如果是自己公司微信小程序,可以采取先下载下来pdf,然后通过wx.openDocument,进行单纯的预览操作,这个可以根据这个。原创 2023-10-19 14:10:54 · 3888 阅读 · 0 评论 -
uniapp如何实现路由守卫、路由拦截,权限引导
在上述代码中,我们通过监听beforeRouterEnter事件来实现路由守卫。在回调函数中,你可以根据实际需求进行相应的验证和逻辑操作。如果需要继续导航到目标页面,调用next()方法;如果需要取消导航,可以选择不调用next()方法。也就是说在你要跳转页面时候,触发这个事件,然后回调里面(next())写navigateTo。经过一番网上冲浪发现,有两种方式可以实现,新建interceptor.js。然后在main.js中引入。原创 2023-09-14 11:11:30 · 17170 阅读 · 13 评论 -
uniapp 接入微信小程序隐私政策兼容
自2023年9月15日起,对于涉及处理用户个人信息的者,微信要求,仅当开发者主动向平台同步用户已阅读并同意了小程序的隐私保护指引等信息处理规则后,方可调用微信提供的隐私接口。公告里已经介绍了相关流程,具体可以参考。这里不再赘述。下面我们将着重谈一下代码实现。原创 2023-09-12 10:17:41 · 1751 阅读 · 0 评论 -
微信小程序slot插槽的介绍,以及如何通过uniapp使用动态插槽
在实际使用中,直接通过原创 2023-09-04 16:24:13 · 3789 阅读 · 0 评论 -
uniapp 微信小程序仿抖音评论区功能,支持展开收起
最近需要写一个评论区功能,所以打算仿照抖音做一个评论功能,支持展开和收起,首先我们需要对功能做一个拆解,评论区功能,两个模块,一个是发表评论模块,一个是评论展示区。接下来对这两个模块进行详细描述。使用到的技术 uniapp uview2.0 文章最后我会贴上全部源码。原创 2023-08-31 16:01:59 · 6472 阅读 · 1 评论 -
uniapp 微信小程序 锚点跳转
下面是点击事件,我发现有两种方式可以实现锚点跳转,一个是直接通过给api配置selector参数就可以跳转至id元素处,另一个是先获取dom的top值,然后通过给api配置scrollTop值来实现页面滚动。除了上面方式,其实还可以使用scroll-view,因为上面已经满足我的业务需求,故就不在此过多赘述,有兴趣的同僚可以试试scroll-view的实现方式。然后给每个分类每一项添加点击事件,分类这里的item数据里面有一字段是和上面商品dom设置的id值是一一对应的。原创 2023-08-31 13:59:58 · 1692 阅读 · 0 评论 -
微信小程序echart导出图片
用到的echarts组件是uni插件市场的。echarts版本5.1.0。原创 2023-08-30 11:55:08 · 1238 阅读 · 2 评论 -
unapp 开发微信小程序 使用wx.createSelectorQuery()时候一直获取不到元素信息。
但是在uni的官方文档中并没有关于需要切换this的介绍,是用uni.createSelectorQuery()在自定义组件内部也是无效的。在自定义组件中,使用wx.createSelectorQuery() 不能用wx. 而是this.createSelectorQuery()原创 2023-08-29 15:58:34 · 1733 阅读 · 0 评论 -
u-view 2.0 实现tab栏切换
因为swiper高度默认150px,swiper-item高度是100%,起初想让swiper-item中的内容吧swiper-item和其父元素高度撑开,理应将height设置成auto但是swiper的高度auto可以设置成功,但是swiper-item高度设置了auto始终是不成功(开发者工具中styles中显示出了但是就是不生效)u-view1.0是有一个 u-tabs-swiper 使用,但是2.0没有了,所以需要用u-tabs 加上 uni提供的原生swipper实现该效果。原创 2023-04-07 10:48:27 · 2934 阅读 · 0 评论 -
uniapp 开发微信小程序使用echart的dataZoom属性缩放功能不生效!bug记录!
在项目中添加了dataZoom配置项但是不生效,突然想到微信小程序代码大小的限制,之前的echarts.js是定制的,有可能没有加dataZoom组件。之前用的echarts版本是5.0.0,这次也是定制同样的版本,但是报错,按照之前的经验判断,可能是版本问题,故往上提高了一个版本。最后生效的版本5.1.0。报t.preventDefault is not a function,我这边暂时把t.preventDefault里面的函数执行语句删除了,之后便可以进行拖动,但缩放没有试过。原创 2023-08-24 18:49:18 · 3289 阅读 · 2 评论 -
u-view 的u-calendar 组件设置默认日期后,多次点击后,就不滚动到默认日期的位置
在源码中找到这个位置进行打印值,根据出bug前后的值进行分析,发现,获取dom信息时候,获取的height有时候是整数有时候是小数,但是差的不大,应该是dom精度问题,属于正常情况,但是就是这个导致的问题,如果两次获取的height值不一样,就是正常的,如果两次获取的height值一样,那么就会出现这个bug, 这里要提一下,这个获取的height值是在后代组件中获取的,然后传递给祖先组件,在祖先组件中赋值给scroll-view组件的scroll-top属性。下面具体修改了源码的位置。原创 2023-08-22 20:01:32 · 1606 阅读 · 1 评论 -
bug记录:微信小程序 给button使用all: initial重置样式
场景:通过uniapp开发微信小程序 ,使用uview的u-popup弹窗,里面内嵌了一个原生button标签,因为微信小程序的button是有默认样式的,所以通过all: initial重置样式。但是整个弹窗的点击事件都会被button上面的点击事件覆盖,也就是说点击弹窗任何一个地方,都会触发button的点击事件。最后检查dom ,发现鼠标只要划入弹窗内,只显示了button的dom介绍。具体的bug原理,如果有知道的大佬,欢迎评论区留言~~~~原创 2023-08-17 14:07:39 · 1381 阅读 · 0 评论 -
微信小程序使用rich-text解析富文本字符串的时候,遇到image标签图片很大超过屏幕
如果是简单的场景,比如一段简单的文字和图片内容,可以优先使用rich-text组件,在文章内容,商品详情等复杂的文本详情,可以优先使用uview的u-parse 组件。原创 2023-08-10 17:46:47 · 1656 阅读 · 0 评论 -
uniapp 的input组件在@input事件中限制用户可输入数值的范围,出现视图不更新的bug。
在input事件拿到用户输入的值,然后给input组件绑定的值赋值之前,判断用户输入的不能超过最大值,超过的话默认为100,,这个判断和赋值然后视图更新只能触发一次,之后在输入,发现值改了页面但是不更新。我擦了,v-model和:value都试过。都没用,网上描述的这个bug能追溯到19年。$set也试过 没有用。原创 2023-07-21 16:57:59 · 2316 阅读 · 2 评论 -
uview2.0使用u-calendar 的formatter属性,在formatter方法里无法访问this的bug,解决办法!!!!
还有第二种方法就是修改u-calendar 源码,为了不影响其他使用日历组件的模块,最后将该组件里面代码提出来,自己封装一个组件。自己写了个demo 父给子传值v-bind传一个函数,然后在这个函数里面打印this,this是子组件的实例,但是不知道为什么formatter里会打印undefined。解决办法 就是在外部定义一个变量,然后在调用日历组件的父级的onload里面给这个变量赋值this,然后formatter里面就可以打印出来父级的this,进而访问父级变量。uview 版本2.0.36。原创 2023-07-20 09:52:55 · 1447 阅读 · 5 评论 -
uniapp获取微信运动步数
先调用login换取code,然后调用wx.getWeRunData,在成功的回调中调用后端同学的接口,传code,iv,encryptedData,其实后端不需要code,需要sessionkey,但是sessionkey需要通过code和。取获取,就可以换取微信运动步数了,这里要注意的是微信步数的timestamp字段单位是秒!,如果用Date对象操作的时候需要乘1000!原创 2023-07-19 17:22:17 · 2317 阅读 · 0 评论 -
uniapp 使用uview2.0 u-upload组件上传图片文件
上传图片不能使用uni.request因为data参数不支持fromData数据格式。原创 2023-07-19 11:18:18 · 2253 阅读 · 0 评论 -
小程序有时候onload参数option不能拿到场景值怎么办,以及所有场景值查看列表!
通过 var obj = wx.getEnterOptionsSync()console.log(obj?.scene)可以看到场景值。原创 2023-07-14 16:59:01 · 735 阅读 · 0 评论 -
小程序Url Link跳转怎么获取query参数?
【代码】小程序Url Link跳转怎么获取query参数?原创 2023-07-14 16:49:25 · 1921 阅读 · 0 评论 -
微信小程序代码审核,提示需要添加文娱-其他视频类目
第三个是服务除视频内容外还存在其他形式的情况可以通过引入第三方视频插件来解决,但是有的插件是需要授权的,也就是付费的。第二个是通过后端写一个鉴权接口,审核时候去通过接口返回的布尔值去隐藏掉视频模块,通过后再显示出来。一个是按照指引去申请资质。原创 2023-07-12 15:57:32 · 2143 阅读 · 3 评论 -
message:Error: 上传失败:网络请求错误 系统错误,错误码:80082,get plugin(id: wx5474241b2a65b906, version: 1.0.8) failed,
message:Error: 上传失败:网络请求错误 系统错误,错误码:80082,get plugin(id: wx5474241b2a65b906, version: 1.0.8) failed,微信开发者工具上传代码提示报错信息 ,该报错信息可能为使用了未授权的微信小程序插件。原创 2023-07-12 15:53:34 · 3508 阅读 · 2 评论 -
uniapp 微信小程序 实现 将base64图片保存相册和转发分享微信好友功能记录 直接cv就能用!!!!
提示api:that.$refs.uToast.show用的是uview2.0的toast,可以根据具体引入的ui库去更换;该功能在微信开发者工具中调试的时候会一直报错,真机是没问题的,可能是编译器的bug。原创 2023-07-07 17:52:43 · 4667 阅读 · 8 评论 -
微信小程序canvas层级太高,与其他非原生组件层级冲突
最后在文档中找到这样一段话,用真机打开,层级就正常了。所以建议大家,多使用真机调试去测试!官网已经提出新版本以支持同层渲染,但是实际项目中层级还是冲突的。原创 2023-06-30 16:35:52 · 1200 阅读 · 3 评论 -
微信开发者工具input无法聚焦输入文字问题记录
写微信小程序时碰到微信开发工具里的input输入框无法输入文字 ,发现键盘的tab键可以让input获取焦点,暂时只发现了这一个方法。原创 2023-06-24 10:02:20 · 755 阅读 · 1 评论 -
小程序中各类二维码、小程序码,在各种场景下,长按识别支持情况验证结果
近期由于业务涉及到小程序长按识别加群、关注公众号等业务,各类场景下的支持情况,官方文档也没有特别具体的说明,所以整体做了一些测试。测试结果如下,如果有一些不准确或者未验证的情况,欢迎大家指正、补充哈~image+shop long press、wx.previewImage 支持公众号二维码长按识别了~小程序中各类二维码、小程序码,在各种场景下,长按识别支持情况验证结果(验证时间:2021-10-21)原创 2023-06-20 17:11:00 · 464 阅读 · 0 评论 -
uview2.0 u-number-box 无法输入小数,以及弹起键盘没有小数点 的问题 !! 非常简单的解决!!
当使用该组件的时候发现integer设置为false后,只有step点击+ 或者 - 按钮才会小数的增长,但是真机调试 弹出的键盘时没有小数点的,突然灵光乍现,查看源码发现,input 的type属性一直都是number,所以适当的修改组件库,根据integer的值来动态改变type的值就好啦。原创 2023-06-17 13:57:54 · 2267 阅读 · 4 评论 -
记录一个bug ,在uniapp开发微信小程序中,使用v-for 设置key时如果key值不唯一,会导致一些问题!!
在uniapp开发微信小程序中,使用v-for 设置key时如果key值不唯一,然后在循环中有个dom上加了点击事件参数时这个item,那么那个点击事件函数里面打印item是undefined的!原创 2023-06-16 14:35:03 · 484 阅读 · 0 评论 -
uniapp的radio大小设置,解决办法,以及radio的背景等样式修改。
通过color-ui的css发现他们修改radio原生组件的选择器中有wx开头的类名,编译器中检查元素发现并没有看到,怀疑是隐藏了。官网文档有写 建议大小设置采取用transform: scale(0.7);原创 2023-06-14 14:07:55 · 2634 阅读 · 0 评论 -
uniapp如何在任意一个js文件获取$store数据(因为存在某页面this指向不是vue实例,所以无法使用this.$store)
可以采用。原创 2023-06-13 10:56:53 · 1379 阅读 · 0 评论 -
u-view2.0 uniapp input 或者textarea的placeholder-style设置失效, 解决办法!! 碾压网上搜到的所以方法!!!
设置placeholder-style属性发现怎么设置都无效,此时更有趣的事情发生了;然后在onload里面设置延时器去显示这个input。查了一些资料,原因是因为动态创建元素的原因,解决办法:用v-if去控制显隐。-ui v1,情况都一样)原创 2023-06-12 14:19:40 · 5550 阅读 · 6 评论