uni-app
文章平均质量分 52
Dark_programmer
这个作者很懒,什么都没留下…
展开
-
uni-app - - - - - 小程序获取宿主语言
uni-app - - - - - 小程序获取宿主语言原创 2024-09-25 17:00:51 · 351 阅读 · 0 评论 -
uni-app - - - - -vue3使用i18n配置国际化语言
uni-app - - - - -vue3使用i18n配置国际化语言原创 2024-09-25 15:29:17 · 645 阅读 · 0 评论 -
uni-app - - - - - 实现锚点定位和滚动监听功能(滚动监听功能暂未添加,待后续更新)
uni-app - - - - - 实现锚点定位和滚动监听功能(滚动监听功能暂未添加,待后续更新)原创 2024-09-25 10:36:51 · 620 阅读 · 0 评论 -
uni-app - - - - - 自定义tabbar
uni-app - - - - - 自定义tabbar原创 2024-08-27 17:55:21 · 1239 阅读 · 0 评论 -
uni-app - - - - - 自定义状态栏
uni-app - - - - - 自定义状态栏原创 2024-08-27 17:42:41 · 653 阅读 · 0 评论 -
uni-app - - - - - 使用uview-plus详细步骤
uni-app - - - - - 使用uview-plus详细步骤原创 2024-08-27 17:31:07 · 755 阅读 · 0 评论 -
uni-app -- - - - 小程序如何向后端发送Form Data格式的数据
小程序如何向后端发送Form Data格式的数据原创 2023-05-16 13:31:11 · 1981 阅读 · 6 评论 -
uni-app -- 小程序检查更新
在用户使用小程序之后,开发人员进行的小程序的迭代,但是有的用户端并没有进行更新,于是产生了缓存问题。那么,该如何有效解决该问题的发生呢?<script> onShow: function() { this.updateApp(); }, methods: { updateApp() { const updateManager = uni.getUpdateManager(); // 当向小程序后台请求完新版本信息,会进行回调 updateManager.on原创 2022-02-16 16:44:42 · 1092 阅读 · 0 评论 -
uni-app -- 授权获取个人信息-登录注册流程
小程序授权1. 梳理思路2. 步骤拆分2.1 获取用户当前获取权限的状态2.2 获取个人信息,让用户进行授权2.3 引导用户再次授权每一个你不满意的现在,都有一个你没有努力的曾经在写小程序时,有时不授权获取信息也能获取到,但有时就会出现报错问题。那么,怎么一个流程才是正确的登录流程呢?文章以快手小程序 授权获取个人信息为例1. 梳理思路要注册登录,首先就要获取到个人信息。要获取到个人信息,就要用户先授权如果首次授权拒绝了,如何再次引导授权2. 步骤拆分如果着急的同学,可以直接看2原创 2022-02-11 11:08:31 · 2326 阅读 · 0 评论 -
uni-app -- 选择图片、上传图片
1. 选择图片choosePhoto() { uni.chooseImage({ count: 1, //最多可以选择的图片张数,默认9 sourceType: ['album'], //album 从相册选图,camera 使用相机,默认二者都有。如需直接开相机或直接选相册,请只使用一个选项 sizeType: ['original'],//original 原图,compressed 压缩图,默认二者都有 success(res) { console.log('选择图片完成',原创 2022-02-10 18:28:30 · 5026 阅读 · 6 评论 -
uni-app 发送请求时遇到报错 Refused to set unsafe header “Cookie“
在使用uni-app开发快手小程序时,遇到如下错误:Refused to set unsafe header "Cookie"这到底是什么问题呢?但是在同套代码里开发字节小程序就没遇到该问题。翻译错误信息为 拒绝设置不安全的标题“Cookie”。为什么会产生该问题呢?w3c规定,当请求的header匹配以下不安全字符时,将被终止,具体参考如下: Accept-Charset Accept-Encoding Connection Content-Length Cookie原创 2022-02-09 13:58:49 · 6872 阅读 · 0 评论 -
uni-app 遇到报错 Argument `Object` at index 0 passed to the method `KS.prototype.request(...)` is not
报错:Argument `Object` at index 0 passed to the method `KS.prototype.request(...)` is not assignable to type `RequestOptions`. `'post'` is not assignable to property `RequestOptions.prototype.method` of type `'GET' | 'POST' | 'PUT' | 'DELETE' | 'HEAD' | 'OPT原创 2022-02-09 09:26:46 · 964 阅读 · 0 评论 -
uni-app 如何区分当前是什么小程序呢?
使用对应API:uni.getProvideruni.getProvider({ service: 'oauth', success: function(res) { console.log('供应商', res.provider); }})快手如图:字节如图:原创 2022-02-07 17:21:38 · 1031 阅读 · 0 评论 -
uni-app 快手小程序如何设置跟元素样式
首先判断是否为快手小程序/* #ifdef MP-KUAISHOU */如果是快手小程序 则该部分代码块生效/* #endif */使用元素选择器 + 属性选择器获取根标签/* #ifdef MP-KUAISHOU */page[is-wrapper]{ background-image: url(https:*****.png); background-size: 100% 100%; position: fixed;}/* #endif */...原创 2022-02-07 17:14:57 · 767 阅读 · 0 评论 -
uni-app -- 小程序添加激励视频(字节-抖音小程序)
激励视频1. 遇到的问题1.1关于第五个坑,是遇到这样一个报错1.2 全局只有一个RewarededVideoAd 实例2.创建RewarededVideoAd 实例2.1 创建全局唯一实例2.2 需要的页面进行展示1. 遇到的问题1.激励视频广告是由客户端原生渲染,覆盖在整个小程序页面区域之上,目前支持竖屏展示。2.全局只有一个RewarededVideoAd 实例,重复创建不会覆盖。3.激励视频广告展示的时候用户不能操作小程序。4.开发者工具上暂不支持调试该 API,请直接在真机上进行调试。原创 2022-01-21 15:43:08 · 5197 阅读 · 1 评论 -
uni-app -- 小程序分享遇到的问题
小程序分享1. 全局混入mixins1.1 创建mixins.vue1.2 全局混入1.3 页面分享数据2.使用的方式关于小程序分享的问题,该需求很常见。在uni-app中如何能够优雅的配置每个页面都有分享功能呢?1. 全局混入mixins1.1 创建mixins.vue<script> export default { name: "mixin", data() { return { // 设置默认分享参数 share: { title: 'A原创 2022-01-21 10:20:28 · 2167 阅读 · 0 评论 -
uni-app 组件里的button的样式改不掉?
关于按钮样式,想要去掉烦人的边框,但是无论如何给button改样式也去不掉button的边框。因为改错地方了。边框线是在其伪元素身上添加的// 去掉烦人的边框button::after{ border: 0; // 或者 border: none;}// 调整禁用时的样式button[disabled] { background-color: #fff; color: #eee;}// 修改点击时的样式.button-hover { color:#F85959;原创 2022-01-18 14:29:04 · 3027 阅读 · 0 评论 -
uni-app 小程序添加联系客服功能
小程序添加联系客服1. 开通小6客服2. 添加客服入口3. 避免入坑4. 联系客服如下很多小程序,为了更好的服务用户、收到反馈之类的,一般都有联系客服的功能。那么,该如何实现呢?以字节小程序为例1. 开通小6客服2. 添加客服入口<button type='default' open-type='contact'>联系客服</button>需要注意:必须使用button组件必须配置open-type='contact'属性3. 避免入坑千万别以为在原创 2022-01-18 11:54:29 · 8613 阅读 · 2 评论 -
uni-app 封装网络请求
直接上代码:// 接口地址import BASE_URL from './base_url.js'const http = (options) => { const seesionKey = 'SESSIONID' // 开始请求 展示加载中loading uni.showLoading({ title: "加载中...", }); return new Promise((resolve, reject) => { uni.request({ url: BASE_原创 2022-01-17 18:32:52 · 621 阅读 · 0 评论 -
uni-app 如何根据环境自动切换请求的地址
在vue中,可使用 process.env.NODE_ENV的值来判断当前环境是开发环境还是生产环境。在uni-app中也可使用该值进行区分环境。使用 HBuilderX进行开发:点击“运行”编译出来的代码是开发环境,点击“发行”编译出来的代码是生产环境export default BASE_URL = process.env.NODE_ENV === 'development' ? '测试地址' : '正式地址' 然后把该变量用在合适的地方即可或者在package.json 中配置ht原创 2022-01-17 18:14:16 · 2851 阅读 · 0 评论 -
uni-app 开发字节小程序时报错page[pages/XXX/XXX] not found
在使用uni-app开发抖音小程序时,遇到一个报错信息:page[pages/XXX/XXX] not found.May be caused by :1. Forgot to add page route in app.json.2. Invoking Page() in async task.错误直译:找不到第[pages/XXX/XXX]页。可能是由于:1。忘记在应用程序中添加页面路由。json。2.在异步任务中调用Page()然后根据错误信息去分别检查了pages.json与调用页面的地原创 2022-01-17 18:03:53 · 11796 阅读 · 3 评论 -
uni-app 报错getUserProfile:fail can only be invoked by user TAP gesture.
在小程序开发阶段,注定是要获取用户信息的。当然,API很强大,一件获取。但是在开发的过程中遇到这么一个错误:getUserProfile:fail can only be invoked by user TAP gesture.经过查询,发现该对应API仅允许点击调用,不允许作为回调事件如此即可!...原创 2022-01-14 16:06:56 · 3550 阅读 · 2 评论 -
uni-app -- 如何实现返回上一页面或多级页面
uni-app -- 如何实现路由后退的效果在vue中,有APIthis.$router.go(-1)可实现后退多少步的效果。uni-app并没有go(-1)的api,但是有一个类似的api 名为 navigateBack。具体使用如下:uni.navigateBack({ delta: 1});关闭当前页面,返回上一页面或多级页面。delta:( Number )。 返回的页面数,如果 delta 大于现有页面数,则返回到首页。相关链接:【uni.navigateBack】 【原创 2022-01-04 16:01:24 · 15264 阅读 · 1 评论 -
uni-app -- 如何动态设置页面的标题
小嘴一歪,气场全开!uni-app 动态设置标题1. 新建页面1. 新建页面正常情况下,在创建页面时会在pages.json里生成一段代码,即可在内调整页面的标题。如图:效果如图:这种方式可已满足大多数人的需求,但是总有那么一些人需求比较不同。希望能够在页面内进行动态的调整标题,那么该如何进行设置呢?<script> export default { data() { return { dynamicTitle: '这里是动态标题', }; },.原创 2022-01-04 10:28:11 · 7543 阅读 · 1 评论 -
uni-app --发行app 使用时提示应用异常
uni-app App打包1.问题描述:2.产生原因:3.解决办法:uni-app一段开发,多端打包使用。1.问题描述:当在打包成app应用时,却出现了如下问题:2.产生原因:HbuilderX并非最新版本。打包App时,执行的是 原生App - 云打包。手机端SDK版本,是云打包提交云端打包时确定的。HBuilderX版本,是你当下的HBuilderX版本。当你本地的HBuilderX版本可以更新但你没有进行更新时,此时点击打包App,那么就和云端版本不一致,所以会出现该问题。3.原创 2021-12-20 16:37:32 · 587 阅读 · 0 评论 -
uni-app -- 动态展示隐藏tabbar
遇到问题不要怕,一定要去克服它遇到这么一个需求,当事件触发时,展示popup组件。在H5上没问题,会自动覆盖tabbar。但是在微信小程序的时候遇到了问题,没有进行覆盖。如图:H5:微信小程序:那么如何根据某条件动态调整tabbar的隐藏显示呢?经查找,微信小程序有这个么个api隐藏tabbar: wx.hideTabBar()展示tabbar: wx.showTabBar()有了对应的api就可以进行代码的调整了。 watch: { show: { handle.原创 2021-12-13 16:47:41 · 2940 阅读 · 0 评论 -
uni-app -- 调用扫一扫功能
关于移动端项目,功能总类比起pc端有过之无不及,就如扫码功能。uni-app该如何实现该功能呢?API:uni.scanCode({})具体代码如下:<template> <view class="shortcut-container"> <view class="shortcut-item"> <image class='icon' src="../../../static/scanCode.png" mode="" @click="scanC原创 2021-12-09 17:52:33 · 2867 阅读 · 0 评论 -
uni-app -- uView组件
好的工具可以让我们的开发事半功倍。uni-app - ui组件使用 1.安装2.项目内配置3. 使用示例此处仅演示 HbuilderX安装使用UI组件1.安装1.打开地址 : uView 2.02.使用HbuilderX安装安装完成会出现如图所示2.项目内配置1.引入uViewmain.jsimport Vue from "vue";import uView from "@/uni_modules/uview-ui";Vue.use(uView);2.引入uView sc原创 2021-11-29 11:16:11 · 995 阅读 · 0 评论 -
uni-app 底部tabbar设置 && 底部tabbar样式
自己不努力,没人会帮你小程序很常见的底部tabbar按钮该如何设置呢?Tabbar1. 创建页面2. 配置tabbar1. 创建页面目录如下:pages- index / index.vue- mine / mine.vue2. 配置tabbar需要配置的文件:pages.json配置代码块: "pages" : [ // 这里是路由配置 ], "tabBar": { // 这里就是配置tabbar的地方 "color": "#8a8a8a", // 导航栏字.原创 2021-11-23 17:46:02 · 16042 阅读 · 13 评论 -
uni-app 获取定位问题
关于获取位置信息,uni-app文档有相关APIuni.getLocationH5运行时没有问题。在微信小程序运行时,如果提示需要设置permission,可直接按下图操作原创 2021-11-19 16:02:01 · 819 阅读 · 0 评论 -
uni-app如何自定义内容生成二维码?
学而不思则罔,思而不学则殆uni-app 生成二维码1. 创建uni-app项目2.HbuildX插件市场安装相关插件3.使用该插件3.1 在需要使用的页面进行引入3.2 页面上使用该插件注:此次仅演示HbuildX编辑器的操作流程1. 创建uni-app项目关于创建uni-app项目的步骤,不再进行赘述,可查看 【uni-app 创建项目】2.HbuildX插件市场安装相关插件插件地址: https://ext.dcloud.net.cn/plugin?id=39#detail点击该按.原创 2021-11-17 15:36:11 · 2159 阅读 · 0 评论 -
uni-app 使用uni.request时在H5页面报错?跨域?
如果是用HBuilderX创建的uni-app项目,可继续往下看在使用uni-app的API之uni.request进行数据请求时,微信开发者工具正常请求回来数据,但是H5端却产生跨域报错:使用方式如下:getList() { uni.request({ url: 'http://157.122.54.189:9088/image/v3/homepage/vertical', data: this.params }).then(res => { console.log('res原创 2021-08-17 17:58:27 · 1890 阅读 · 0 评论 -
uni-app - 创建项目
创建项目一、HBuilderX 创建项目创建项目运行项目运行在浏览器:运行在微信小程序:二、脚手架创建项目【HBuilderX官方下载地址】【微信开发者工具官方下载地址】根据自己的实际情况进行下载对应的版本就OK一、HBuilderX 创建项目创建项目1.第一步:打开HBuilderX新建 => 项目2.因此选择如图所示(可根据自身需要进行调整)第四步:选择项目类型第五步:项目名称第六步:选择文件存放路径第七步:选择模版第八步:创建项目运行项目运行在浏览器:运行 =原创 2021-08-13 14:40:29 · 365 阅读 · 0 评论