容器
binder
秒掉
flyfish
实时音视频
医学
OData
visualstudio
栈
自动批量下载图片的插件
卷积
金融学
统一认证
粘包拆包
addWaiter
requests库
include
改进粒子群优化算法
具体方法
大学数学
uni-app
2024/4/11 15:04:32
基于uniapp的活动报名系统源码
开发环境及工具：
大等于jdk1.8，大于mysql5.5，idea（eclipse），HBuilder X
技术说明：
springboot mybatis uniapp
代码注释齐全，没有多余代码，适合学习(毕设)࿰…
uniapp-美团外卖微信小程序开发
美团外卖微信小程序开发P1 成果展示P2外卖小程序后端，学习给小程序写http接口P3 主界面配置P4 首页组件拆分P13 外卖列表布局筛选组件商家 布局测试数据创建样式请求商家外卖数据封装请求并发请求uni-app框架调用https接口 开发小程序 提高vue技术 前端技术 课程需要…
uniapp 获取键盘高度
// 监听键盘高度变化
uni.onKeyboardHeightChange((obj)>{// 获取系统信息let _sysInfo uni.getSystemInfoSync();let _heightDiff _sysInfo.screenHeight - _sysInfo.windowHeightlet _diff obj.height - _heightDiff// 键盘高度height (_diff > 0 ? _diff : 0) -…
uniapp 下载视频到本地
这是一个我写的下载视频的demo，可以直接使用
使用uni.downloadFile先将文件下载到缓存中然后使用uni.saveVideoToPhotosAlbum下载到用户本地，这里有一些基本的提示，足够基本的业务需求，如果有额外需求在上面扩展即可
// 下载视频…
uniapp开发小程序，包过大解决方案
1、首先和大家说一下 微信小程序 主包限制不能超过2M 分包一共不能超过8M
然后具体解决优化步骤如下， 将主包进行分包 在pages.json 下subPackages里面进行配置分包 分包配置完 配置过的文件都需要进行修改对应的路径
2 、 在运行的时候 一定要勾选 压缩代码 有…
uni-app 解决钉钉小程序日期组件uni-datetime-picker不兼容ios问题
最近在使用uni-app开发 钉钉小程序 ，遇到一个ios的兼容性问题 uni-datetime-picker 组件在模拟器上可以使用，在真机上不生效问题 文章目录 1. 不兼容的写法，uni-datetime-picker 不兼容IOS2. 兼容的写法，使用 dd.datePicker 实现。…
uniapp文件预览
废话不多说，直接上代码
let filePath this.list.annex_nrif (this.$utils.isEmpty(filePath)) {uni.showToast({icon: "none",title: "无文件路径"})return}let arr filePath.split("/")let fileName arr.length > 0 ? arr[a…
如何将各种小程序(微信小程序)项目转换为 uni-app 项目
使用【miniprogram-to-uniapp】可以将微信小程序项目转为 uni-app 项目(新版本 HBuilderX 工具已经支持各种小程序转换插件)
HBuilderX 插件地址：miniprogram-to-uniapp v2 - DCloud 插件市场
核心原理：使用 Babel 获取AST(词法分析)，然后或…
【uniapp 小程序实现已授权用户直接自动登录,未授权用户展示授权页面并实现一键登录】
uniapp 小程序实现已授权用户直接自动登录,未授权用户展示授权页面并实现一键登录 前言一、实现思路1. 后端接口a. LoginByCodeb. LoginMpAlic. LoginMpWx 二、最终实现流程图1.流程图在这里插入图片描述 总结 前言
项目背景 : 项目是使用 uniapp 来实现的多端小程序 , 当前实…
uniapp之actionsheet 自定义组件
uniapp本身自带的actionsheet太丑，不够美观。闲着也是闲着，自己实现了一个类似的选择器。
支持功能：
1、左对齐
2、右对齐
3、居中
4、可加图标 下面贴出使用教程： <template><view><action-sheet alignment&…
uniapp实现条码扫描 可开闪光灯，原生H5调用，不需要任何sdk。
主要思路 使用QuaggaJs这个库。调用摄像头使用的 navigator.mediaDevices.getUserMedia 这个H5的api。通过 video 和 canvas 把摄像头获取到的数据展现到页面上，同时调用监听Quagga解析。 获取设备摄像头权限,用于后续开启摄像头。创建video元素显示摄像头画面,和ca…
uniapp：蓝牙模块
模拟的是蓝牙设备签到/签出：
获取指定蓝牙设备蓝牙初始搜索次数限制，超过限制就停止搜索蓝牙连接失败次数限制，超过限制标识蓝牙连接失败（离开蓝牙范围或其他原因）自动重连指定蓝牙
const device ref<any>(nu…
uniapp在微信开放平台创建移动应用时，如何生成应用签名的问题
包名在打包的时候是必填项，就不多赘述了… 微信开放平台获取应用签名， 场景： 首先需要在手机或者模拟器上下载签名生成工具，下载地址：下载签名生成工具 然后手机打开， 在这里输入你的app打包时的包名&…
uniapp 卡牌发放教程
今天我们在uniapp 中制作一款盲盒打开后卡牌发放的动效
效果图 思路
我们将所有卡牌从页面正中心发出,通过定位控制每张卡牌的left、top的值来实现卡牌发放的效果。 假设条件:
1. 每行展示两张卡牌
2. 当前卡牌发放到第1张
3. 每张卡牌的宽、高都为200
3. 一共6张由于上述假…
uniapp开发心得
1. 在main.js中封装一些常用的方法
2. 每次项目开始前，先阅读开发文档并且在看完蓝狐或原型图后找出公用的组件先进行封装，方便下次用户改需求可以直接修改避免浪费大量的时间去更新
3. 如果项目许多地方存在背景图，请在app.vue里使用全局背…
vue字符串参数清除data中的数据
最近一段时间，写了不少vue代码，发现有一部分数据总要在完成某些事件后要进行重置，刚开始总觉得一两个变量直接重置一下就行， 但是只要要重置的数据变多后就会显得凌乱，于是我便开始在vue全局中声明了一个重置函数&…
前端Vue自定义可自由滚动精美tabs选项卡标签栏标题栏 可设置背景颜色，
前端Vue自定义可自由滚动精美tabs选项卡标签栏标题栏 可设置背景颜色， 下载完整代码请访问uni-app插件市场地址：https://ext.dcloud.net.cn/plugin?id13313
效果图如下： # cc-scrollTag
#### 使用方法
使用方法
<!-- tabChange: tab选…
uniapp map 制作一个简单的地图导航
本篇文章用来为大家提供一个制作简单地图的思路
先来看一眼效果图 简易map
在图一的地图中可以看到 a点 连接 到 b点, 基本信息 以及 基本的控件(放大、缩小、回到某个指定的点)，接下来我们分开逐步讲解。
所需配置
需要先在manifest.json中的 app模块中配置地图…
uniapp sku组件支持v3、带图sku
如果您正在寻找一款支持v3、v2的多商品sku组件的话，那我想这款组件刚好可以满足各位的业务需求。
先来简单看一眼效果图: 一款轻量化、强大、拓展性强、可使用带图sku、可根据配置主题色自动生成相应的组件主题色的商品多规格sku，仅需要按照指定格式…
uniapp 富文本匹配img标签
示例中匹配了img的开始标签并且为标签设置了一段属性. 大家可以根据需求自行修改。
// 打印内容: <p><img style"max-width: 100%" src123></p>
"<p><img src"123"></p>".replace(/\<img/gi, <img s…
【uniapp】真机运行 访问电脑本地接口127.0.0.1网络失败（亲测有用！！）
uni-app运行到手机上，提示request:fail abort statusCode:-1 Failed to connect to localhost/127.0.0.1:8080_ChangYan.的博客-CSDN博客
vue-pc上传优化-uni-app上传优化
vue-pc上传优化 当我们使用自己搭建的文档服务器上传图片时候，在本地没问题，上线上传会比较慢 这时候我们最简单的方法就是写一个加载组件，上传之前打开组件，掉完接口关闭组件 或者不想写直接使用element的loading写一个遮罩层加…
uni-app官方API汇总与云函数的使用
uni-app官方API与云函数的使用前言一、API 总结1.分享2.扫码3.全屏预览4.富文本展示二、云函数使用1. 初始化云服务空间2. 云数据库与云函数3. 页面调用4. 部分函数展示前言
结合UNIAPP官网，整理一些简单常用的API 一、API 总结
1.分享
onShareAppMessage(OBJECT…
uni-app微信小程序打开第三方地图
需求
小程序中有个按钮点击以后会调用手机中第三方地图进行导航。参数 位置信息 经度 与纬度。
实现方法 uni.openLocation({latitude: Number(地址纬度),longitude: Number(地址经度),name: 地址名称,address: 地址详情,success: function (res) {console.log(打开系统位置地…
【开题报告】基于uni-app的汽车租赁app的设计与实现
1.项目背景及意义
项目背景：
随着人们生活水平的提高，汽车租赁服务在城市中变得越来越普及。传统的租车方式存在一些问题，比如租车流程繁琐、费用不透明、选择有限等。因此，开发一款基于uni-app的汽车租赁app成为了满足用户需求…
uniapp 关于 video 组件的缩放比例问题
在 container 样式的 padding-bottom 设置比例值 9/16 比例值：56.25% 3/4 比例值：75% <view class"container"><video class"video-box" src"xxx.mp4" />
</view>
.container {position: relative;wid…
解决uniapp的video标签和transition属性使用时出现错位的问题
template：三个视频都每个占满屏幕，点击按钮滚动最外层bgBox元素， style: 想要加上动画过渡效果： 这是显示第一个视频： 点按钮向上滑动滚动到第二个视频时： 视频错位了 ，因为视频消失又出现的时候…
vscode+Hbuilder开发uni-app
uni-app官网：（官网有教程） https://uniapp.dcloud.io/ Hbuilder官网：（开发人员一般安装alpha版本） https://hx.dcloud.net.cn/ uView官网：(官网有安装方式） https://www.uviewui.com…
基于uniapp+vue微信小程序的在职考研学习辅导系统
1系统具有良好的集成性，提供标准接口，以实现与其他相关系统的功能和数据集成。开放性好，便于系统的升级维护、以及与各种信息系统进行集成。功能定位充分考虑平台服务对象的需求。 一个微信小程序由.js、.json、.wxml、.wxss四种文件构成&…
开发日记(04) - iconfont 挂了，项目内的图标怎么办？
📌 0x1 问题
iconfont 应该是挂了有 1-2 两个月了，不管是因为什么原因，肯定会有一大堆的项目有一阵子图标出不来。
作为开发者以来就一直有个感觉，那就是在线服务都不可靠。项目中第三方服务越多，更多不可控的因素就…
web之移动端实现触底和触顶功能、微信小程序、置顶、置底、触发、uniApp、onReachBottom、onPageScroll
文章目录 微信小程序uniApp应用场景 微信小程序
触底 /*** 上拉触底事件*/
onReachBottom() {console.log(上拉触底事件触发);
}onReachBottom 监听用户上拉触底事件。 可以在app.json的window选项中或页面配置中设置触发距离onReachBottomDistance。 在触发距离内滑动期间&am…
uni-app个人中心页开发
uni-app个人中心页开发
1.拍照，选择图片
user.vue：
<template><view><view class"takephoto" click"takephoto">拍照</view><image v-for"(item,index) of imglist" :src"item" …
uni-app购物车页面开发
uni-app购物车页面开发
1.加入购物车功能
detail.vue：
<template><view><view><image :src"proimg" mode""></image><view>产品名称: {{proname}} </view><view>价格: {{price}} RMB</v…
uni-app首页开发以及组件
uni-app首页开发以及组件
uni-app中的基本组件和微信小程序中的差不多。更适合在手机端的开发。
1.自定义组件prolist
在pages的同级目录下新建一个文件夹components，然后在里面新建一个prolist的文件夹，里面新建prolist.vue，在prolist.vu…
uni-app详情页开发
uni-app详情页开发
1.跳转详情页
1.声明式导航
<view class"prolist"><navigator :url"/pages/detail/detail?proiditem.proid" class"proitem" v-for"(item,index) of prolist" :key"index"><view clas…
开发日记(02) - js 异步任务队列
开发日记(02) - js 异步任务队列 2021-01-31 20:40:22 0️⃣ 问题 ❓
算是之前项目遗留下来的一个问题。一直困扰着我。
还是关于 uni-app 以及 Vue 项目的网路请求，有这么一个需求，项目内有一个全局使用到数据，我们称为**“数据字典”**。…
uniapp获取一周日期和星期
UniApp可以使用JavaScript中的Date对象来获取当前日期和星期几。以下是一个示例代码，可以获取当前日期和星期几，并输出在一周内的每天早上和晚上：
// 获取当前日期和星期
let date new Date();
let weekdays ["Sunday", "M…
uniapp 实现不同用户展示不同的tabbar(底部导航栏)
一、背景 最近在做一个uniapp开发的小程序遇到一个需求，希望不同用户登录后展示不同的tabbar页面，但是uniapp项目中的pages.json是只有一个list数组的，并且是不能写成动态效果，为了实现这个需求，便自定义了tabbar组件 …
uni-app的h5/小程序/app 网络请求，解决本地环境和生产环境网络请求问题
本篇的重点在于解决h5/小程序/app这三端在本地和生产环境的网络请求问题 全部代码贴在了全文最后
思路：
首先要理解这三个端的特性，h5会有跨域问题需要反向代理，小程序和app不需要反向代理，同时小程序还得用https域名。
一、h5…
uni-app【API概述】
uni-app API概述标准js和浏览器js的区别各端特色API调用说明API Promise 化Vue 2 和 Vue 3 的 API Promise 化Vue 2Vue 3Vue 2 写法转 Vue 3 写法Vue 3 写法转 Vue 2 写法API 列表网络发起请求上传、下载WebSocketSocketTask媒体图片文件录音管理背景音频播放管理音频组件管理视…
uni-app使用echarts数据不更新
问题描述
uni-app使用echarts图表，接口请求数据更新后，图表不刷新。
解决方案
更新option前先调用clear()
clear()：清空当前实例，会移除实例中所有的组件和图表。
initChart() {this.gaugeChart echarts.init(document.getE…
uniapp-使用uni.$emit和this.$Router.push跳转传参
刚开始用uniapp，使用uni.$emit和this.$Router.push跳转传参。 有点懵，百度查完一起记录一下（参考好多就不单独放参考链接了）。 一、this.$router三种跳转方式： （1）this.$router.push //向 hist…
uniapp 安卓H5端，textarea 页面聚焦被推上去，失焦后无法复原，且拉不下来
框架：uniapp vue2
问题：当点击textarea输入框后，软键盘打开，把页面推了上去，当失去焦点后，软键盘收起，但是页面还保持着被推上去的样子且无法手动拉下来
解决方法： 简述࿱…
使用uni-app框架中uni.chooseAddress()接口，获取不到用户收货地址
错误描述
在我们使用uni-app框架或微信原生开发微信小程序时，使用到uni.chooseAddress(OBJECT)接口获取用户收货地址时，无法跳转到收货地址页面获取。 打印接口返回信息，显示 "chooseAddress:fail the api need to be declared in the …
uniapp如何上传文件，使用API是什么
在uniapp中上传文件的方法有很多，其中一种常用的方法是使用wx.uploadFile() API。该API可以上传本地文件或网络文件，并支持设置请求头、请求参数等选项。
具体使用方法如下：
1.引入API：
import { uploadFile } from /util/requ…
39.从0到上线三天搭建个人网站（第三天）
点赞收藏加关注，你也能住大别墅！ 一、第三天主要工作
1.完成detail页面的开发
2.将所有数据以及部分静态资源存在uniCloud，为以后做管理后台做准备
3.创建云对象getData，在beforecreate（）中获取数据
4.…
离线部署uni-app，替换启动页
近来公司用uni-app开发前端程序，费了九牛二虎之力，把离线打包的环境弄好了。但是，一打开程序，有个启动页面或者说过渡页，或者欢迎页，是个HBuilder的标志，与软件主题不符，想换掉。于是…
uniapp 在线预览PDF
1、官网地址： https://mozilla.github.io/pdf.js/getting_started/ 2、解压文件到static中 3、定义查看组件FilePreview
<template><view><web-view :src"allUrl"></web-view></view>
</template><script>
e…
uniapp发布微信小程序问题记录（坑）
uniapp发布小程序过程中的问题，记录和坑1. 小程序发布为体验版无法连接本地调试服务2.云函数调用时，数据不更新以后再遇到问题了，会不定期更新本文章，谢谢！最近在使用uniapp开发小程序过程中，遇到了很多问题…
在Uni-app中实现计时器效果
本文将介绍如何在Uni-app中使用Vue.js的计时器功能实现一个简单的计时器效果。
首先，我们需要创建一个包含计时器的组件。以下是一个基本的计时器组件示例： <template><div class"timer"><p>{{ formatTime }}</p><…
小程序随滚动条动态修改状态栏颜色
onPageScroll((e) > {// e.scrollTop基数为120,-30表示到30开始变色,/70表示到100比例就达到1.0。((100-30)/70)let scale (e.scrollTop - 30) / 70;// let num parseInt(255 - scale * 255 "");// num num > 255 ? 255 : num;// 背景透明度：0…
![【APP VTable】和市面上的 Table 组件一样，都是接收表格[] 以及数据源[]](https://img-blog.csdnimg.cn/f056abb041e74d56b82cc623df7e7198.gif#pic_center)
【APP VTable】和市面上的 Table 组件一样，都是接收表格[] 以及数据源[]
博主：_LJaXi Or 東方幻想郷 专栏： uni-app | 小程序开发 开发工具：HBuilderX 这里写目录标题 表格组件USE 表格组件
<template><view class"scroll-table-wrapper"><view class"scroll-table-container"…
uniapp 设置重写uni-body-page样式，输入字母转大写，条形码扫描
uniapp 设置重写uni-body-page样式，输入字母转大写
一、重写uni-body-page样式
page{
}二、输入字母转大写
input标签设置样式：
style"text-transform: uppercase;"绑定的值通过.toUpperCase()转大写
三、条形码扫描
// 调起条码扫描uni…
uniapp 实现微信小程序手机号一键登录
app 和 h5 手机号一键登录，参考文档：uni-app官网
以下是uniapp 实现微信小程序手机号一键登录
1、布局
<template><view class"mainContent"><image class"closeImg" click"onCloseClick"src"quic…
获取小程序页面路径完整流程
应用场景：因为所涉及的功能要跳转到滴滴打车小程序的代驾页面，而我并不知道他的appid和对应的页面路径，所以跟着我的步骤走下，这里拿滴滴打车小程序举例。 现在的话我们是拿到了小程序对应的appid了，接下来就去获取小程…
uniapp实现下载图片到本地
uniapp实现下载图片到本地
在uniapp开发中，可以使用uni.downloadFile方法实现下载文件功能，客户端直接发起一个 HTTP GET 请求，返回文件的本地临时路径。
const urlPath http://192.168.0.1:8080/fileApi/logo.png
uni.downloadFile({url:…
uni-app根据经纬度逆解析详细地址
uni-app中的getLocation()方法可以获取到用户当前的地理位置（经纬度）、速度。 但是返回参数中的address在app中才会显示，小程序中不会显示，所以我们需要进行逆解析其地址，解析出它的地址信息。
1.首先要在腾讯位置服务…
uniapp编译微信小程序富文本rich-text的图片样式不生效原因
this.detail.contents this.detail.contents.replace(/\<img/gi, <img style"display:block;max-width:90%;height:auto;border:2px solid #eee;box-shadow:5px 5px 5px rgba(100,100,100,0.8);margin-bottom:10px;text-align:center;" );开始采用这个replace…
uniapp subNvue 写的视频播放
文件下载地址
https://download.csdn.net/download/weixin_47517731/88500016https://download.csdn.net/download/weixin_47517731/88500016
1:在pages.json中配置视频播放页面
{/* 视频详情页面 */"path": "pages/detail-video/detail","style&q…
【uni-app】赋予你的APP（Android原生）小程序开发能力
采用DCloud(数字天堂（北京）网络技术有限公司)的uniMPsdk(uni小程序SDK)，是为原生App打造的可运行基于 uni-app 开发的小程序前端项目的框架，从而帮助原生App快速获取小程序的能力。
uni-app文档地址(小程序开发人员开发用) uniMP…
uni-app之Cover-View组件详细使用教程
在 UniApp 中，Cover-View 组件是一种用于展示覆盖在页面上方的视图元素的组件。它可以用于创建各种遮罩、弹出层、悬浮按钮等效果，提供了更多自定义样式和交互的可能性。本教程将详细介绍 Cover-View 组件的用法和示例代码。
步骤1：创建一个…
uniapp:省市选择 自定义组件
源码
https://gitee.com/river-winter/unappCity
效果图 两个数据文件
热门城市 common/hotData.js
export default [{ name: "上海市", },{ name: "广州市", },
{ name: "北京市", },{ name: "天津市", },{ name: "重庆市&q…
uniapp制作水印相机给图片添加水印并且保存图片至本地
uniapp保存文件的三种方式
文件主要分为两大类：
1.代码包文件：代码包文件指的是在项目目录中添加的文件。
2.本地文件：通过调用接口本地产生，或通过网络下载下来，存储到本地的文件。
其中本地文件又分为三种&#…
开发日记(01) - uni-app 使用等宽字体对齐数字宽度
uni-app 使用等宽字体对齐数字宽度
0️⃣ 问题 ❓ 更新时间：2021-02-28 15:55:18 2021-02-28 15:55:18 Nvue 中使用 css 的 font-family 属性值不能使用引号。Nvue 需要下载 ttf 格式的字体进行 base64 编码。 开发的过程中遇到数字显示列表，发现同样的…
uni-app 设置text内文字占满宽度
最近在使用uni-app写手机程序，要实现text内的文字占满整个text，其实设置好text的宽度后在设置一个属性就可了 其他的好像不用设置了
uniapp返回上一页并刷新
在uniapp中，经常会有返回上一页的情况，官方提供有 uni.navigateBack 这个api来实现效果，但是此方法返回到上一页之后页面并不会更新（刷新）。 例如有这样一个场景：从地址列表页点击添加按钮进入添加地址页面…
前端开发工作中可能会遇到的问题及解决方法
一、uni-app小程序中xxx代码依赖分析忽略二、uni-app弹窗列表滚动, 弹框下面的内容也跟随滚动三、uni-app小程序正常自定义组件不生效 四、uni-app popup 弹出层底部空隙问题 五、uni-app小程序自定义导航栏后iOS页面可上下滑动问题解决方案 六. uni-app中的分享二维码以及…
uni-app实现点击显示隐藏列表，兼容微信小程序
效果： <view class"list-item" v-for"(item,index1) in listData" :key"index1"><view class"item-title" click"item.content.length>0?handleToggle(item,index1):"><view class"&qu…
前端面试 --- 杂烩（Echarts、Uni-APP、Webpack、Git)
Echarts
echarts有用过吗? 常用的组件有哪些? title标题组件：show text link toolbox工具栏：导出图片 数据视图 切换 缩放 show orient featuretooltip tigger 触发类型 markPoint 标注点 markLine图标的标线
Uni-APP
uni-app有没有做过分包? 优化…
uniapp框架和原生小程序开发的区别以及和vue、react框架的相似之处
1.vue的事件绑定可以直接传参数,而小程序需要使用自定义属性data
<!-- vue -->
<button click"btnClick(123)">vue的按钮
</button><!-- 小程序 -->
<button bindtap"benClick" data-number"123">小程序的按钮
&…
uni-table动态列设置列宽不生效的解决方法
问题
uni-th 在这边是不固定的列数的，即dataList会变
在uni-th 设置固定列宽width200,或者在uni-td 设置不生效，宽度不对
解决方法
在uni-td里面多包一层view,通过设置view的宽度来撑开uni-td
<uni-td v-for"(item,index) in dataList"…
uniapp leven系列原生插件（1）
目录
1.乐橙摄像机播放插件(云台对讲版)
插件介绍
插件地址
预览图片 编辑
2.乐橙摄像机播放插件(子账号云台对讲版)
插件介绍
插件地址
预览图片
编辑
3.无预览静默拍照
插件介绍
插件地址
预览图片
4.视频图片选择安卓原生插件
插件介绍
插件地址
预览图…
uni-app中使用vue3语法详解
全局创建
app.use(createPina()).mount
全局方法
通过app.config.globalProperties.xxx可以创建 这里我们写了一个字符串翻转的全局方法 main.js里面添加一个全局方法 不要忘了加$ 否则会报错
// #ifdef VUE3
//导入创建app
import { createSSRApp } from vue
//导入创建ap…
【uniapp学习之分享小程序页面】
一、设置分享功能之前的样子 二、在代码中开启分享转发按钮
<script>export default {data() {return {}},methods: {},onLoad() {wx.showShareMenu({withShareTicket: true,menus: [shareAppMessage, shareTimeline]});},onShareAppMessage(res) { //发送给朋友return …
uni-app分包优化、页面预加载、页面跳转等封装
uni-app分包优化、页面预加载、页面跳转封装等优化方式优化一、分包优化1.目录2.分包配置3.页面预加载二、页面跳转1.UNI跳转方法2.封装为vue全局方法优化 因小程序有体积和资源加载限制，各家小程序平台提供了分包方式，优化小程序的下载和启动速度。在小…
![[uniapp]踩坑日记 unexpected character ＞ 1或‘=’＞1 报错](https://img-blog.csdnimg.cn/3555966dca0d450ab549205d4f2786f6.png)
[uniapp]踩坑日记 unexpected character ＞ 1或‘=’＞1 报错
在红色报错文档里下滑，找到Show more 根据提示看是缺少标签，如果不是缺少标签，看看view标签内容是否含有<、>、>、<号,把以上符合都进行以<号为例做{{“<”}}处理
uniapp开发浙政钉H5微应用埋点
具体可以查看官网，本文仅描述埋点的实现（我的项目是hBuilder新建的并非vue脚手架生成的，应该都是一样的） index.html
<script>(function (w, d, s, q, i) {w[q] w[q] || [];var f d.getElementsByTagName(s)[0], j d.c…
uni-app之使用Vite.config.js配置文件的详细教程
uni-app 是一个基于 Vue.js 的跨平台开发框架，而 Vite 是一个快速的前端构建工具。结合使用 Uni-app 和 Vite 可以提高开发效率和构建速度。本文将详细介绍如何使用 Vite.config.js 配置文件来配置 Uni-app 项目。
1. 介绍
Vite.config.js 是 Vite 构建工具的配置…
【uniapp】 软键盘弹出后fixed定位被顶上去问题
问题描述
当手机设计的导航栏为fixed定位上去时，输入框获取焦点就会把顶部自定义的导航栏顶到上面去，如下图所示
解决办法
输入框设置 :adjust-position“false”
<input type"text" :adjust-position"false" focus"i…
uniapp-图片压缩(适配H5,APP)
uniapp本身是自带压缩图片的方式的，但是他只适用于APP，做不到多端的适配，如果只考虑app，就非常容易实现了。 使用uni.compressImage()这个API即可
compressImage(url) {return new Promise((reslove, reject) > {const tempFi…
uniapp微信小程序连接蓝牙打印机 打印文字、图片
首先感谢几位的文章分享 https://blog.csdn.net/guairena/article/details/127941515 https://blog.csdn.net/qq_37970097/article/details/119148707
效果图： 使用的是 芝柯cc3 蓝牙打印机, 我这里没有存储蓝牙设备相关信息。所以每次打印都会重新初始化并搜索设…
uniapp 测试 app 到安卓模拟器部署方法以及常见错误解决 无废话
uniapp 测试 app 到安卓模拟器
1.1 安装安卓模拟器 https://www.yeshen.com/ 1.2 查看安装模拟器端口
右击夜神模拟器属性打开文件位置 在打开的文件夹找到 debugReport 双击运行查看运行出来的端口号 一般都是：62001
1.3 HBuilder 配置
选中项目运行运行到手机…
uniapp-父向子组件传值失效解决方案
<template><view><!-- 我是子组件 newzujian--><view class"">{{value}}</view></view>
</template>
<script>export default {data(){return{value:} },methods:{gaibian(){this.value789}}}
</script>
…
uniapp 支持图片放大
<view class"list" v-for"(item, index) in urls" :key"index"><image :src"item" click"viewImg(item, index)" disabled></image></view> js // 预览大图 viewImg(data, index) {uni.previewImag…
uniapp h5网页打开白屏
修改了默认基本运行路径，然后直接打开index.html的情况下是会这样，放在nginx服务器上运行就ok了。
把默认的./ 路径修改了：/cloudh5 nginx html目录下放子网站 ：/cloudh5：
关于uniapp开发使用uni-ui组件表单校验一直不通过的原因及解决方案
今天使用uniapp开发东西的时候，发现我的表单校验一直通不过，后面才发现少东西了。我在uni-forms上少放了modelValue，但在官方文档上没有提示。所以要做验证必须加这个属性。
因为直接像下面这样写也是可以双向绑定的，谁能想到&am…
即时通讯开发中的性能优化技巧
即时通讯开发在如今的数字化社会中扮演着重要角色，然而，随着用户对即时通讯应用的需求不断增长，开发者们面临着使其应用保持高性能和可靠性的挑战。本文将探讨即时通讯开发中关键的性能优化技巧，帮助开发者们提升应用的用户体验和…
uniapp开发商城系统的核心竞争力在哪？
今天要跟大家聊的是uniapp，国内的互联网可谓是一日千里，保持快速的迭代更新是每个产品必须的特性，否则就会被市场淘汰。
来客推商城系统前端从最初的vuejs前端已经完全过渡到了uniapp开发前端的时代，所有的产品均为uniapp开发&am…
uni-app开发安卓app的封装get和post及页面使用
request.js页面如下
const baseUrl = "请求地址"
//get请求
//get请求封装
export function getRequest(url,params){return new Promise((resolve, reject) => {uni.request({url: baseUrl + url,data: params,method:"GET",dataType:json,header:{…
uniapp自定义导航栏返回按键
目录 htmljscss最后 html
<!-- #ifdef MP-WEIXIN || APP-PLUS -->
<view class"tc header":style"topBarHeight() 0 ? : height: topBarHeight() px;padding-top: topBarTop() px"><view class"reg180" :style"top…
uni-app上传图片给后台
页面
<view tap"uploadImg"><image v-if"imgSrc" :src"imgSrc"></image><view v-if"!imgSrc">点击上传</view>
</view>
方法
uploadImg(){uni.chooseImage({count: 1, //默认9sizeType: [com…
【uni-app从入门到实战】数据绑定、事件、生命周期
文章目录数据绑定事件生命周期应用生命周期页面生命周期数据绑定
<template><view><view>{{msg" uni-app"}}</view><view>{{11}}</view><view>{{flag?我是真的:我是假的}}</view><image :src"imageSrc&qu…
uni-app实现生成二维码功能
文章目录1、生成二维码的组件2、调用页面的代码3、页面的效果图1、生成二维码的组件
由于代码太多不便粘贴了，可以进入这里查看详情https://www.npmjs.com/package/tki-qrcode
2、调用页面的代码 <tki-qrcode v-if"ifShow" cid"qrcode1" …
uniapp-nvue专题学习
nvue介绍
uni-app App 端内置了一个基于 weex 改进的原生渲染引擎，提供了原生渲染能力。
在 App 端，如果使用 vue 页面，则使用 webview 渲染；如果使用 nvue 页面(native vue 的缩写)，则使用原生渲染。一个 App 中可以…
uni-app蓝牙设备连接以及设备的传输，CRC16，ios蓝牙和安卓蓝牙获取数据不一致处理方案
前言： 因为需要开发与蓝牙设备控制相关，但是这不是常用的蓝牙打印，并且是由原生安卓已经做好的，但是需要移植到多平台(小程序 等)都可以使用所以就要移植成 uni-app ，所以这个是按照uni-app的蓝牙设备完成的。 以下涉及…
uni-app 地图手绘图覆盖方案，类似智慧景区小程序
前言：本以为很简单就可以解决的一样东西，就是在地图特定位置放置一个覆盖的图片就好了，实际上却是很简单，但是可惜你做的是小程序，这样子思路就会被截断。先自己摸索百度，最后发现这个版块是微信自家的服务…
uni-app上传附件与附件预览
效果图 使用的插件链接:附件上传选择vue内嵌版lsj-upload - DCloud 插件市场
app端使用这个插件有点问题，所以把上传功能写到了一个跳转的页面才能触发上传功能
H5端不会有这个问题
示例代码
//附件页
<template><view class"list1-con-t"&g…
Uniapp（Android）引入leaflet地图
引入地图需用到renderjs，不了解的可以去其它博客看看示例
H5端与安卓端使用renderjs有点不一样，
效果图 代码demo
需下leaflet，然后在当前页面引入import L from leaflet;
<template><view class"global"><view…
uniapp页面滚动监听
1."onPageScroll"生命周期
onPageScroll(e) {//根据scrollTop值超过某个临界点，设置不同的css样式this.scrollTop e.scrollTop;
},2."scroll-view"组件
<scroll-view scroll-y class"page" scroll"scroll">metho…
uni-app自定义导航栏按钮
1.支持H5、App端(在page.json里配置app-plus) 监听按钮、输入框事件，把onNavigationBarButtonTap和onNavigationBarSearchInputChanged写在响应的页面中。 {"path": "pages/search/search","style": {"navigationBarTitleText&q…
uniapp怎么把px转换成对应手机型号的rpx
首先获取系统手机屏幕的宽度系统信息的概念 | uni-app官网，然后根据公式转换 rpx 750*元素 B 在设计稿上的宽度为 多少px/手机屏幕的宽度 详见：CSS 支持 | uni-app官网
如下为把宽度为1px的转成对应手机型号的rpx uni.getSystemInfo({success(res) {co…
【Bug】Uni-app自定义组件onReady()，v-if 渲染组件元素，无法获得
解决方案： v-if 改为v-show v-if 会移除元素的，当然获取不到，v-show只是display:none
validateFunction 自定义校验规则使用说明
uni-forms 的 rules 基础规则有时候不能满足项目的所有使用场景，这时候可以使用 validateFunctio…
有关Vue、微信小程序、UniApp中的CSS中的宽度width单位、自适应
在Vue中，可以使用以下单位来设置宽度（width）
像素（px）：最常用的单位，表示一个绝对长度单位。例如，width: 200px; 表示宽度为200像素。百分比（%）：…
uni-app：实现页面效果3
效果 代码
<template><view><!-- 风速风向检测器--><view class"content_position"><view class"content"><view class"SN"><view class"SN_title">设备1</view><view class&quo…
uniapp打包ios有时间 uniapp打包次数
我们经常用的解决方案有，分包，将图片上传到服务器上，减少插件引入。但是还有一个方案好多刚入门uniapp的人都给忽略了，就是在源码视图中配置，开启分包优化。
1.分包
目前微信小程序可以分8个包，每个包的最大存储是2M，也就是说你文件总体的大小不能超过16M，每个包的大…
人间道－您到底做错了什么：正心径之您要逐渐去除外邪行为
过去的您或许在您自个身上付出，投入了巨大，重大的人力，物力，财力等各方面的重重的成本，但是呢，收获却微小的稀罕，微少的可怜啊。甚至于一个错误，就把您完全陷入到万丈深渊里面去了&a…
uniapp-搜索配置
自定义搜索组件
1.定义组件的 UI 结构:
<template><!-- 通过属性绑定的形式，为 .my-search-container 盒子和 .my-search-box 盒子动态绑定 style 属性 --><view class"my-search-container" :style"{background-color: bgcolor}&q…
基于uni-app的汽车租赁app的设计与实现
1.项目背景及意义
项目背景：
随着人们生活水平的提高，汽车租赁服务在城市中变得越来越普及。传统的租车方式存在一些问题，比如租车流程繁琐、费用不透明、选择有限等。因此，开发一款基于uni-app的汽车租赁app成为了满足用户需求…
uniapp 使用腾讯视频 的 坑
1. 版本号的问题 注意 1.X.X不维护了 ， 需要升级要 2.X.X
2. 官网的 组件事件 调用需要去掉bind 才能调用 官网地址：腾讯视频 | 小程序插件 | 微信公众平台
uniapp使用element的问题
uniapp使用element中的message和Notification：
message失效问题： 会报错：’error‘ is not undefind
一直在踩坑中…
解决如下： 在main.js中，给vue挂载实例： 将Vue.use()
Vue.use(Message);
Vue.use(No…
uniapp使用vue3和ts开发小程序自定义tab栏，实现自定义凸出tabbar效果
要实现自定义的tabbar效果，可以使用自定义tab覆盖主tab来实现，当程序启动或者从后台显示在前台时隐藏自带的tab来实现。自定义一个tab组件，然后在里面实现自定义的逻辑。
组件中所使用的组件api可以看：Tabbar 底部导航栏 | uView…
案例016基于Java+SSM+Mysql的设备故障报修小程序
文末获取源码 开发语言：Java 框架：SSM JDK版本：JDK1.8 数据库：mysql 5.7 开发软件：eclipse/myeclipse/idea Maven包：Maven3.5.4 小程序框架：uniapp 小程序开发软件：HBuilder X 小程序…
uni-app的uni-number-box组件 怎么设置支持小数
第一次使用官方的uni-numbox，把step设置成小数点，才可以输入小数点。 嗯~~。还是饿了么ElInputNumber组件好用。copy改造了下添加precision控制，小数点就ok了。
template、style不变。其他更多功能去饿了么添加 export default {name: "…
uni-app实现APP端在线预览PDF
// 主要代码
<!-- #ifdef APP-PLUS --><web-view :src"url"></web-view>
<!-- #endif -->
// encodeURIComponent 不转有时会报错；url后端pdf地址
//1. html版本
this.url /hybrid/html/web/viewer.html?file${encodeURICompon…
微信公众号授权前端（uniapp为例）
const base_url http://baidu.com// 前端域名const wx_url https://open.weixin.qq.com/connect/oauth2/authorize?appidappid&redirect_uribase_url&response_typecode&scopesnsapi_base&state123#wechat_redirectexport default {components: {},data() {…
uniapp 自定义一个loading组件（放自己的图片转圈圈）
预览效果： 思路：
1、首页loading要全屏并且模糊地覆盖底部的页面
所以背景设置透明度0.8，固定定位fixed，层级999，宽高是页面宽度和高度
2、然后把图片和文本居中显示，我们知道，页面元素都是以…
uniapp使用Canvas实现电子签名
来源：
公司的一个需求，需要给新注册的会员和客商需要增加签署协议功能；
之前的思路： 1、使用vue-signature-pad来实现电子签名，但是安卓手机不兼容； 2、uniapp插件市场来实现，但是对HBuilderX…
uniapp 获取元素，通过style修改元素的样式
<input type"text" ref"inn" value"ss">// 获取元素改变样式
this.$refs.inn.$el.style.marginLeft "100px"
// 获取值
this.$refs.inn.value
注意：
1、Hbulider的运行控制台窗口打印不了this.$refs.innÿ…
uni-app开发微信小程序问题汇总
目录前言1、关于new Date()2、ios系统底部适配3、小程序分享配置4、扫小程序码带参进入小程序5、打开已发布小程序调试窗口6、自定义导航栏适配刘海屏7、滚动穿透问题前言
最近在用uni-app开发微信小程序，这里将开发中遇到的坑和问题记录一下，后续发现新…
uni-app ,uni is not defind uView安装不了
安装uni-app，使用了Hello uni-app模板， 想安装uView，根据官方文档一步步来装的，最后使用时报错 我怀疑是因为有uni-ui在这个项目里面，和uView冲突了，为了验证这个怀疑，我新建了一个项目&#x…
uni-app 移动端app无法显示本地图片
不能将本地图片放在assets文件夹，要放在static下
这么写：
<image :src"require(/static/img/change.png)"></image>测试过了，这么写，h5、小程序、app都能显示
【uniapp】Hbuilderx运行到微信小程序报错：? Enable IDE Service (y/N) [27D[27C
问题如图，微信开发者工具没有开启服务端口。
解决方法：
1、在控制台下方输入 y 以确认开启。
2、手动打开微信开发者工具 -> 设置 -> 安全设置，将服务端口开启。
uniapp和vue3+ts创建自定义下拉选择框组件
使用uniapp开发小程序的时候，使用了uview的ui组件，但是里面没有下拉选择组件，只有Picker 选择器，但是我们想要使用下拉选择的组件，所以需要自定义个一个下拉选择的自定义组件，我就只能自己动手创建这个自定…
基于java springboot vue uniapp商城源码(毕设)
开发环境及工具：
大于等于jdk1.8，大于mysql5.5，idea（eclipse），HBuilder，nodejs，vscode（webstorm）
技术说明：
springboot mybatis elementui un…
Uni-App常用事件
Uni-App是一个跨平台的前端开发框架，支持多个平台的应用开发，包括H5、小程序、App等。在Uni-App中，有许多常用的事件可以用来处理用户交互、页面生命周期等方面的逻辑。以下是一些Uni-App中常用的事件： 点击事件（click…
uni-app:实现request请求的递归（设置request请求的访问次数），并且调用自定义方法给出返回值
一、效果展示
失败效果 成功效果 二、写入后端请求部分
分析
①自定义一个模块common.js主要用于封装所有的请求函数 ②核心代码
function requestWithRetry(cmd, username, password, retryCount) {return new Promise((resolve, reject) > {uni.request({url: ip sys…
基于uniapp的旅游小程序APP源码
开发环境及工具：
大等于jdk1.8，大于mysql5.5，idea（eclipse），HBuilder X
技术说明：
springboot mybatis uniapp
代码注释齐全，没有多余代码，适合学习(毕设)࿰…
uni-app + SpringBoot +stomp 支持websocket 打包app
文章目录 一、概述：二、配置：1. 后端配置2. uni-app(app端)3. 使用 一、概述：
websocket 协议是在http 协议的基础上的升级，通过一次http 请求建立长连接，转而变为TCP 的全双工通信；而http 协议是一问一答…
【uni-app从入门到实战】下拉刷新、上拉加载
文章目录下拉刷新监听下拉刷新：onPullDownRefreshuni.startPullDownRefresh(OBJECT)上拉加载下拉刷新
监听下拉刷新：onPullDownRefresh
在 页面生命周期 的官方文档中有 onPullDownRefresh，它是用来监听用户下拉动作，一般用于下…
uni-app：顶部导航栏图标titleImage
效果 文件
pages.json
代码
"pages": [//pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages{"path": "pages/search/index/index","style": {"titleImage":"…
基于uniapp的 电子书小程序——需求整理
前言
想开发一个很简单的 电子书阅读小程序，要怎么做的。下面从功能、数据库设计这一块来说一下。说不一定能从某个角度提供一些思路
开发语言
springcloud uniapp 小程序（vue2）mysql
说明
电子书的主题是电子书，我们在日常…
基于JAVA+SpringBoot+UniApp+Vue的前后端分离的手机移动端图书借阅平台
✌全网粉丝20W,csdn特邀作者、博客专家、CSDN新星计划导师、java领域优质创作者,博客之星、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和毕业项目实战✌ 🍅文末获取项目下载方式🍅 一、项目背景介绍： 随着社会信息化的快速…
uni-app【数据缓存API】
数据缓存APIuni.setStorage(OBJECT)uni.setStorageSync(KEY,DATA)uni.getStorage(OBJECT)uni.getStorageSync(KEY)uni.getStorageInfo(OBJECT)uni.getStorageInfoSync()uni.removeStorage(OBJECT)uni.removeStorageSync(KEY)uni.clearStorage()uni.clearStorageSync()uni.setSt…
H5（uniapp）中使用echarts
1,安装echarts
npm install echarts
2，具体页面
<template><view class"container notice-list"><view><view class"aa" id"main" style"width: 500px; height: 400px;"></view></v…
uniapp取消原生顶部导航栏的方法
1、全局取消
所有页面都去掉：在pages.json里配置navigationStyle:custom
2、单页面取消
在该路由下添加navigationStyle:custom即可
{"path": "pages/me/me","style": {"navigationStyle": "custom"}
}
uniapp 微信小程序登录 新手专用 引入即可
预览 第一步导入插件
在引入的页面的登录按钮下拷贝一下代码
<template><view class"content"><button type"primary" click"login">微信登录</button></view><TC-WXlogin :wxloginwxlogin />
</templ…
uniapp跳转外部链接和跳转内部网页的方法
1、打开外部链接
使用内置组件web-view
<template><view><web-view src"https://www.baidu.com"></web-view></view>
</template>
2、跳转内部网页
<navigator :url"/pages/test/list"></navigator> …
uni-app h5 添加大量文本是支持换行的，比如：协议文本
<text>文本文本文本文本
</text>
把全部文本（包括换行）复制，然后放在标签内，会显示出换行效果
关于uviewui修改主题及在uniapp中的应用
在uview使用过程中遇到很多不方便的地方，记录下来
修改主题颜色
给UI框架换个主题色基础方法是覆盖原有色（但这个方法比较笨，处理起来也不干净利索），所以换个思路改变基础色值变量，步骤主要分为2部分&…
语法速通 uni-app随笔【uni-app】【微信小程序】【vue】
1、微信小程序
1.1、wx 小程序 工程目录 其中，
pages目录/index目录【必有】： index.js 编写业务逻辑 【初始数据，生命周期函数】 index.json 编写配置 index.wxml 编写模板 【可理解为本页html】 index.wxss 【可理解为本页css】
1.2、wx…
uniapp在App端如何动态修改原生导航栏？
uniapp在App端如何动态修改原生导航栏？ 文章目录 uniapp在App端如何动态修改原生导航栏？page.json配置修改 buttons 文字修改按钮上的角标设置 searchInput的 focus设置 searchInput的 text 在App端可以通过得到 webview 对象，通过当前 webvi…
uniapp封装loading 的动画动态加载
实现效果 html代码
<view class"loadBox" v-if"loading"><img :src"logo" class"logo">
</view>
css代码
.loadBox {width: 180rpx;min-height: 180rpx;border-radius: 50%;display: flex;align-items: center;j…
怎么在uni-app中使用Vuex 深度解刨
本文深入研究Vuex，一个Vue.js状态管理库。我们将介绍创建它是为了解决的问题、其背后的核心概念、如何设置它，当然，还将在每一步中使用代码示例。
Vuex是一个由Vue团队构建的状态管理库，用于管理Vue.js应用程序中的数据。它提供了一种集中管理跨应用程序使用的数据的方式，…
uniapp调用七牛云api实现文件上传-node.js向外提供uploadToken的接口-客户端不用下载七牛云的包和SDK-发起网络请求直接上传
uniapp调用七牛云api实现文件上传 实现思路： 1.使用node.js向客户端提供uploadToken，客户端获取uploadToken后使用七牛云的api接口发起网络请求，上传文件； node.js向外提供uploadToken的接口-客户端不用下载七牛云的包和SDK-&…
uniapp微信小程序解决绘制polygon结束时的问题
目录
一、前言
二、实现思路
三、结束标绘具体代码
1、在地图展示工具栏处判断工具按钮是否展示v-if"item.isshow"
2、data声明的工具按钮中新增结束标绘按钮
3、在按钮的点击事件中新增结束标绘的判断
4、判断绘制的线段个数是否大于等于三条，当满…
uniApp获取当前位置经纬度
以下是使用uni.getLocation获取当前位置的示例代码：
调用uni.getLocation方法获取当前位置信息
uni.getLocation({type: wgs84, // 坐标类型，默认为wgs84，可选的值为gcj02和bd09llsuccess: res > {// 获取成功，经度和纬度在r…
【uniapp 配置启动页面隐私弹窗】
为什么需要配置
原因
根据工业和信息化部关于开展APP侵害用户权益专项整治要求，App提交到应用市场必须满足以下条件：
1.应用启动运行时需弹出隐私政策协议，说明应用采集用户数据 2.应用不能强制要求用户授予权限，即不能“不给权…
uni-app显示图片,加载失败时显示占位图兼容h5/app/微信小程序
百度了各种方法，试了各种技巧，在h5/app/小程序都试验过了，最终产生以下的干货
1.使用image标签，error""写法 2.在小程序会报错：[渲染层网络层错误] Failed to load local image resource，要加一…
uni-app做多端小程序开发的基本项目搭建(一) ——使用uniCloud实现云开发的增删改查
1.预备知识
现在有一个需求： 需要编写一套代码，可以将app的内容发布在微信小程序上或者打包成一个apk的安装包。
要完成这个需求，目前可以借助uni-appHbuilderX来实现。 在使用这个两个工具之前，需要掌握的知识有：
…
uni-app做多端小程序开发的基本项目搭建(二) ——云函数和文件上传的使用
1.前言
通过上一篇文章，用uni-app的uniCloud云开发实现了简单的增删查改的操作，要做一个app项目，目前我可能还需要用到的功能有：选择图片上传到云存储，使用云函数封装等，本文主要介绍这两个功能的简单实现…
nuiapp项目实战：导航栏动态切换效果实践案例树
测试软件的百忙之中去进行软件开发的工作，开展开发软件的工作事情，也真是繁忙至极点的了。 不到一刻钟的课程内容，个人用了三次去写串联的知识点，然后这是第三次，还是第四次了才完全写出来一个功能的效果。 一刻钟的功…
案例024:基于微信小程序的汽车保养系统
文末获取源码 开发语言：Java 框架：SSM JDK版本：JDK1.8 数据库：mysql 5.7 开发软件：eclipse/myeclipse/idea Maven包：Maven3.5.4 小程序框架：uniapp 小程序开发软件：HBuilder X 小程序…
uniapp 拉起授权（拒绝后重新开启权限）
在 uniapp 中，你可以通过以下步骤来拉起权限，如果权限被拒绝，可以尝试重新开启权限： 引入 uniapp 的权限模块：首先，你需要在项目中引入 uniapp 的权限模块。在 manifest.json 文件中，找到 uni_m…
计算机毕业设计springboot vue uniapp火车购票app源码
开发环境及工具：
大等于jdk1.8，大于mysql5.5，idea（eclipse），HBuilder X
技术说明：
springboot mybatis vue uniapp
代码注释齐全，没有多余代码，适合学习(毕设)&#…
uniapp-返回上一页并刷新
uniapp-返回上一页并刷新
var pages getCurrentPages(); // 获取当前挂载的路由数组
var prePage pages[pages.length - 2] //获取 上一个页面
uni.navigateBack({success() {prePage.$vm.上一页的方法() // 当返回成功的时候调用上一级页面的回调}
})
案例025:基于微信小程序的移动学习平台的设计与实现
文末获取源码 开发语言：Java 框架：SSM JDK版本：JDK1.8 数据库：mysql 5.7 开发软件：eclipse/myeclipse/idea Maven包：Maven3.5.4 小程序框架：uniapp 小程序开发软件：HBuilder X 小程序…
uniapp 小程序 跳转到外部链接
场景：点击“积分列表”中的“积分兑换”，需要跳转到三方的“积分商城”链接进行兑换，兑换完成后，跳回小程序“积分列表”。
结论：无法离开小程序，跳转到其他地址。只能通过web-view内嵌的形式，…
uniapp 轮播图（含组件封装，自动注册全局组件）
效果预览 组件封装 src\components\SUI_Swiper.vue
可参考官网配置更多属性
swipernavigator
<script setup lang"ts">
import { ref } from vue
defineProps({config: Object,
})const activeIndex ref(0)
const change: UniHelper.SwiperOnChange (e) &…
uniapp 安卓平台签名证书(.keystore)生成
安装JRE环境
下载jre安装包：https://www.oracle.com/java/technologies/downloads/#java8安装jre安装包时，记录安装目录(例:C:\Program Files\Java\jdk-20)打开命令行（cmd），将JRE安装路径添加到系统环境变量
d:
se…
开发仿抖音APP遇到的问题和解决方案
uni-app如何引入阿里矢量库图标/uniapp 中引入 iconfont 文件报错文件查找失败
uni-app如何引入阿里矢量库图标 - 知乎
uniapp 中引入 iconfont 文件报错文件查找失败：‘./iconfont.woff?t1673007495384‘ at App.vue:6_宝马金鞍901的博客-CSDN博客 将课件中的cs…
【uniapp+vue3/vue2】ksp-cropper高性能图片裁剪工具，详解
效果图： 1、ksp-cropper是hbuilder插件市场中的一款插件，兼容vue2和vue3
ksp-cropper插件安装地址，直接点击跳转
2、插件用法相对简单 （1）只要url有值就会显示插件，为空就会隐藏插件 （2&#…
Uniapp实现APP云打包
一. 基础配置 二. APP图标配置
1. 点击浏览 选取图标(注：图片格式为png)
2. 点击自动生成所有图标并替换 三. 点击发行 并选择云打包 四. 去开发者中心获取证书
我这里是已经获取好的，没有获取的话，按照提示获取即可，非常简单…
uniapp链接WebSocket 常用的api
UniApp是一个基于Vue语法的跨平台应用开发框架，它支持使用WebSocket来实现实时双向通信。WebSocket是一种在单个TCP连接上进行全双工通信的协议，它可以在客户端和服务器之间建立持久性的连接，并允许双向通信。在UniApp中，你可以使…
使用uniapp开发系统懒加载图片效果
1、创建一个Vue组件
在uniapp项目中，我们可以创建一个独立的Vue组件来实现懒加载图片效果。打开uniapp项目，进入components文件夹，创建一个名为"LazeImage"的组件。
2、编写组件模板
在"LazeImage"组件中，…
uni-app ucharts中饼图与圆环图区别
项目情况：
uni-app的用于移动端H5项目，包使用uni_modules目录存放。
图表引用ucharts中的echarts配置的组件方式 区别1 饼图与圆环图在echarts使用的配置都是pie类型。但是配置raduis使用： radius: [40%, 70%] 区别2 组件type指明…
uni-app封装api请求
前端封装api请求 前端封装 API 请求可以提高代码的可维护性和重用性，同时使得 API 调用更加简洁和易用。
下面是一种常见的前端封装 API 请求的方式： 创建一个 API 封装模块或类：可以使用 JavaScript 或 TypeScript 创建一个独立的模块或类来…
前端uniapp生成海报绘制canvas画布并且保存到相册【实战/带源码/最新】
目录 插件市场效果如下图注意使用my-share.vue插件文件如下图片hch-posterutilsindex.js draw-demo.vuehch-poster.vue 最后 插件市场
插件市场
效果如下图 注意
主要：使用my-share.vue和绘制canvas的hch-poster.vue这两个使用
使用my-share.vue
<template&…
微信小程序vue+uniapp旅游景点门票预订系统 名胜风景推荐系统
与此同时越来越多的旅游公司建立了自己的基于微信小程序的名胜风景推荐平台，管理员通过网站可以添加用户、景点分类、景点信息、在线预订、最新推荐，用户可以对景点信息进行在线预订，以及开展电子商务等。互联网的世界里蕴藏无限生机…
uniapp微信小程序长按识别微信二维码
<view class"imgarr"><imagesrc"/static/menu/sy.jpg"class"img"mode"widthFix":show-menu-by-longpress"true"click"previewImage"></image><view>长按识别二维码</view></vie…
uniapp开发ios上线（在win环境下使用三方）
苹果 1、win环境下无法使用苹果os编译器所以使用第三方上传工具，以下示例为 初雪云 （单次收费，一元一次） 初雪云（注册p12证书）：https://www.chuxueyun.com/#/pages/AppleCertificate 苹果开发者…
springboot vue uniapp博客系统网站源码
开发环境及工具：
大于Jdk1.8，大于mysql5.5，nodejs，idea（eclipse），vscode（webstorm），HBuilder
技术说明：
Springboot mybatis vue elementui un…
uniapp时间选择器
Uniapp 是一套基于Vue.js 开发的跨平台开发框架，它能够以一套代码编译成多个平台的应用，包括 iOS、Android、H5 等。要实现时间选择器可以使用uni-app提供的组件picker，它可以用于选择器、时间选择器、日期选择器等场景。
以下是一个简单的时…
uniapp 滚动到指定元素的位置(锚点)
需求：在页面中，不管位于何处，点击按钮页面滚动到对应的标题位置。
最简单有效的方式（直接复制改数据就行）
使用 scroll-view 标签的属性：scroll-top(距离值 num) 或 scroll-into-view(子元素的id,不能以…
uni-app：服务器端数据绘制多个echarts图标（renderjs解决手机端无法显示问题）
效果 代码
<template><view><view :prop"option1" :change:prop"echarts.updateEcharts1" id"echarts1"class"echarts"></view><view :prop"option2" :change:prop"echarts.updateEchart…
【uniapp-高德地图IP定位服务】
高德地图开发控制台 高德地图IP定位
申请key 使用IP定位服务
//向外导出省份
export function getProvince(){return new Promise((resolve,reject)>{let historyProvinceuni.getStorageSync("historyProvince");if(historyProvince){ if((Date.now() - histo…
uniapp （vue3）生成二维码
在uni-app中生成二维码，我们可以使用第三方库qrcode.js。以下是一个简单的示例：
首先，我们需要安装qrcode.js库，可以通过npm进行安装：
npm install qrcode然后，在你的Vue组件中引入并使用这个库ÿ…
【UniApp开发小程序】私聊功能uniapp界面实现 (买家、卖家 沟通商品信息)【后端基于若依管理系统开发】
文章目录 效果显示WebSocket连接使用全局变量WebSocket连接细节 最近和自己聊天的用户信息界面效果界面代码最近的聊天内容太长日期时间显示未读消息数量显示 私聊界面界面展示代码实现英文长串不换行问题聊天区域自动滑动到底部键盘呼出，聊天区域收缩，聊…
uni-app相关知识点
适合新手阅读的 uni-app 知识
一、uniapp怎么进行路由跳转？ 二、配置tabbar（底部导航栏），在pages.json里面配置
tabbar，小程序的tabbar
"tabBar":{"list": [{"pagePath": "page…
基于uni-app小程序轮播图中间变大切换手机震动效果
酸狗先带你看下效果图： 直接看代码：
WXML：
<template><view><view class""><!-- 背景附加高斯模糊 --><image :src"gbImage" mode"widthFix" class"GaussianBlur"&g…
Uniapp连接iBeacon设备——实现无线定位与互动体验（理论篇）
目录 前言：
一、什么是iBeacon技术
二、Uniapp连接iBeacon设备的准备工作 硬件设备：
三、Uniapp连接iBeacon设备的实现步骤 创建Uniapp项目：
四、Uniapp连接iBeacon设备的应用场景 室内导航：
五、Uniapp连接iBeacon设备的未来…
uniapp中uni.navigateBack返回后刷新页面数据
文章目录 一、前言1.1、[uni.navigateBack](https://uniapp.dcloud.net.cn/api/router.html#navigateback) 二、方法2.1、父页面设置钩子函数onBackPress2.2、uni.$emit和uni.$on监听通知数据变更2.2.1、子页面2.2.2、父页面 2.3、onShow钩子函数处理数据2.3.1、子页面2.3.2、父…
记录：uniapp中的uni-datetime-picker 在ios设备被遮盖覆盖的问题
偶然发现苹果手机上这个picker弹出来的时候，自己写的组件竟然覆盖在了这个picker的上面，遮挡住了picker，不是全部遮挡，是遮挡一部分。以为是z-index层级的问题，找问题找bug找了一上午，最后发现：…
28个案例问题分析---21---面向对象复用、面向对象实现、立体化权限--uniapp 打包
背景 激励功能体现 面向对象可以实现极大程度的复用性问题。 通过组件的复用，复用做好的组件。 如何使用面向对象的思想组织管理流程图 流程图没有统一管理，管理起来混乱。 词云位置的定制化 词云位置是固定的，后来演化成了定制化。&#…
uni-app监听用户长按元素触发事件
PC端的项目写习惯了
突然写手机端的朋友 自然就会不太了解各类事件 在手机中 存在用户长按元素的情况 我们可以通过longpress进行监听
参考代码如下
<template><view><text longpress"longpress(title)">{{ title }}</text></view>…
【使用uniapp完成微信小程序的图片下载到本机】
使用uniapp完成微信小程序的图片下载到本机 话不多说直接上代码吧 话不多说直接上代码吧
使用的vue3的语法糖进行完成的
因为我是请求的后端接口
<template><view class"load"><view class"selectPart"><Select></Select>…
uni-app 设置tabBar的setTabBarBadge购物车/消息等角标
目录 一、效果二、代码实现二、全部代码1.index.vue2.cart.vue 三、真实案例参考最后 一、效果 二、代码实现
只要使用uni.setTabBarBadge和uni.removeTabBarBadge来进行对红点的设置和移除。
主要代码：
//设置红点
uni.setTabBarBadge({index: 1, // 底部菜单栏…
vue移动端H5调起手机发送短信（兼容ios和android）
移动端h6页面调起手机发送短信功能，ios和android的兼容写法不一样。 android window.location.href sms:10086?body${encodeURIComponent(Hello, 测试短信发送)} ios window.location.href sms:10086&body${encodeURIComponent(Hello, 测试短信发送)}//或者w…
uniapp小程序砸金蛋抽奖
砸之前是金蛋png图片，点击砸完之后切换砸金蛋动效gif图片；
当前代码封装为砸金蛋的组件；
vue代码：
<template><view class"page" v-if"merchantInfo.cdn_static"><image class"bg&qu…
Uniapp iOS打包配置教程
简介
在Uniapp开发过程中，我们常常需要将应用打包成iOS的安装包。本文将分步骤指导你如何配置iOS打包，并提供相应的代码和注释说明。
流程概览
下表展示了配置iOS打包的整个流程： 步骤描述步骤1创建iOS工程步骤2配置基本信息步骤3添加Uniapp支持步骤4配置App图标步骤5配置…
uniapp无感刷新token实现过程
路漫漫其修远兮，前端道路逐渐迷茫，时隔好久好久终于想起了我还有一个小博客，最近在一直在弄uniapp，属实有被恶心到，但也至少会用了，最近实现了一个比较通用的功能，就是无感刷新token，…
顶级加密混淆混淆工具测评：ipagurd
摘要
JavaScript代码安全需求日益增长，因此JavaScript混淆工具的使用变得广泛。本文将对专业、商业JavaScript混淆工具ipagurd进行全面评估，通过比较其功能、操作便捷性、免费试用、混淆效果等方面，帮助开发者选择适合自己项目需求的工具。 …
uniapp原生插件之安卓文件操作原生插件
插件介绍
安卓文件操作原生插件，读写文件，文件下载等，支持读取移动设备路径等外部存储设备路径，如U盘路径
插件地址
安卓文件操作原生插件 - DCloud 插件市场
超级福利
uniapp 插件购买超级福利
详细使用文档
uniapp 安卓文…
uni-app--》如何制作一个APP并使用？
🏍️作者简介：大家好，我是亦世凡华、渴望知识储备自己的一名在校大学生 🛵个人主页：亦世凡华、 🛺系列专栏：uni-app 🚲座右铭：人生亦可燃烧，亦可腐败…
本地团购分销--在您身边的省钱小技巧！APP小程序H5三端源码交付，支持二开！
近年来，本地团购分销市场崛起，给消费者带来了更多选择。本地团购分销平台利用互联网和移动支付技术，将商家和消费者相连，为消费者提供了一站式购物体验。消费者不再需要费尽心思去寻找物美价廉的商品，只需轻轻一点&…
前端Vue加载中页面动画弹跳动画loading
前端Vue加载中页面动画弹跳动画loading， 下载完整代码请访问uni-app插件市场址:https://ext.dcloud.net.cn/plugin?id13091
效果图如下： #### 使用方法
使用方法
<!-- ref:唯一ref top：距离中间顶部距离 -->
<cc-loading ref&…
uniapp flex:1不生效
包裹view顶层 不能添加 display: flex;<template><view class"container"><tHeader :title"采购管理" :showScrollTar"true" :scroll"scroll" :tabList"tabList" :isFixed"true"change"chang…
uniapp使用u-empty以及其相关属性
Uni-app 是一款基于 Vue.js 的跨平台开发框架，可以用于同时开发多个平台的应用程序。其中，u-empty 是 Uni-app 提供的一个组件，用于展示空状态的页面。
u-empty 组件有以下几个相关属性： image：设置空状态显示的图片。…
uniapp 基座、标准基座、自定义基座；传统打包、快速安心打包
初次接触uniapp的标准基座、自定义基座、传统打包、快速安心打包等概念，以下是个总结。
uniapp 基座、标准基座、自定义基座
基座就是原生层，js、html、css都要运行在原生层，有了基座，代码才可以在真机上运行。 标准基座就是没有…
uni-app扩展组件(uni-ui)
目录 数字角标(uni-badge)
代码示例：
面包屑(uni-breadcrumb)
代码示例：
日历
代码示例
卡片(uni-card)
代码示例
倒计时(uni-countdown)
更多内容请访问官网 数字角标(uni-badge)
数字角标一般和其它控件（列表、9宫格等࿰…
利用安全区域的概念解决移动端兼容不同手机刘海的问题
移动端 安全区
在做移动端的项目时，由于不同的手机设备设置的不同，有些手机在上方有刘海的设计，我们需要做适配，即把想要展示的内容放在安全区域内展示。
1.自定义导航栏
在pages.json中修改如下配置 {"path":"…
uniapp-实现一级二级职位选择，完整页面！！！
一、需求
该页面实现的功能有：
该页面是左侧为一级，右侧为二级；可以搜索职位进行选择；底部显示已选的岗位，点击每一项会删除；右侧的二级岗位，点击时会选中，再次点击会取消…
uniapp跳转的方式传参
1.uniApp跳转的方式 页面跳转 保留当前页面，跳转到应用内的某个页面 uni.navigateTo({url: ‘/pages/login/login’}); 关闭当前页面，跳转到应用内的某个页面 uni.redirectTo({url: ‘/pages/login/login’}) 关闭所有页面，打开到应用内的某个…
node+uniapp+socket简易聊天
目录
一、技术简介
1.1、客户端
1.2、服务器
二、代码分析
2.1、前端连接后端
2.2、前端发送，后端接收并广播回去
三、效果展示
四、升级版
一、技术简介
1.1、客户端
uni-app项目自行创建、weapp.socket.io这个需要后端下载cnpm i weapp.socket.io&…
前端VUE3+Vite +UniAPP-- 框架搭建
除了HBuilderX可视化界面，也可以使用 cli 脚手架，可以通过 vue-cli 创建 uni-app 项目。
全局安装 vue-cli 官网 npm install -g vue/cli
npx degit dcloudio/uni-preset-vue#vite-ts vue3-uniapp配置tailwindcss插件 官网 npm install tailwindcss
np…
uniapp接入uniPush消息推送
介绍 UniPush 是 DCloud 联合个推公司推出的集成型统一推送服务，内建了苹果、华为、小米、OPPO、VIVO、魅族、谷歌 FCM 等手机厂商的系统级推送和个推等第三方推送。 国内Android的Push是一个混乱的世界，因为 Google 的 Push 服务 FCM 被墙，所…
记录--优雅解决uniapp微信小程序右上角胶囊菜单覆盖问题
这里给大家分享我在网上总结出来的一些知识，希望对大家有所帮助 前言 大家好，今天聊一下在做uniapp多端适配项目，需要用到自定义导航时，如何解决状态栏塌陷及导航栏安全区域多端适配问题，下文只针对H5、APP、微信小程序…
uniapp打包微信小程序。报错：https://api.weixin.qq.com 不在以下 request 合法域名列表
场景：在进行打包上传测试时，发现登录失效，但在测试中【勾选不效应合法域名】就可以。 出现原因：我在获取到用户code后，直接使用调用官方接口换取openid 解决方案：
可以把code带给后端，让他们返…
本地团购分销：解密最新赚钱模式，带你开启财富之门！APP小程序H5三端源码交付，支持二开！
近年来，随着互联网的迅猛发展和电子商务的普及，本地团购分销逐渐成为了一种热门的赚钱模式。它不仅为消费者提供了更多的购物优惠，同时也给商家和分销商带来了可观的利润。在这篇文章中，我们将详细介绍本地团购分销的运作原理和盈…
前端Vue自定义列表表格信息展示可用于商品规格参数展示
前端Vue自定义列表表格信息展示可用于商品规格参数展示 ， 下载完整代码请访问uni-app插件市场地址：https://ext.dcloud.net.cn/plugin?id13131
效果图如下： #### 使用方法
使用方法
<!-- table-list:表格数组 数组里对象可自定义字段 …
uniapp微信小程序中阻止事件冒泡
开发场景：列表中展示地块的数据信息，用户可以点击列表进入地块的详情界面，也可以点击列表中的星星按钮进行收藏 遇到的问题：每次点击星星的时候，都会触发父级的点击事件，从而进入到详情界面
原本的代码&am…
uniapp app 实现自适应宽度 input
核心原理
当 input 输入，存在一个 view 元素容纳输入内容，此时获取 view 元素的宽，将其设置为 input 的宽 特殊情况：回显的时候当前元素可能不存在，此时需要借助一个永远显示的元素进行宽度计算（InputWidt…
uni-app应用设置 可以根据手机屏幕旋转进行 (横/竖) 屏切换
首先 我们打开项目的 manifest.json 在左侧导航栏中找到 源码视图 然后找到 app-plus 配置 在下面加上
"orientation": [//竖屏正方向"portrait-primary",//竖屏反方向"portrait-secondary",//横屏正方向"landscape-primary",//横屏…
uni-app实现web-view图片长按下载
<template><view><web-view :webview-styles"webviewStyles" :src"webUrl"></web-view></view>
</template>
uniapp的web-view中图片无法长按保存，IOS下是正常的，但是Android下长按无反应
解…
u-popup组件在UniApp中的讲解
u-popup 组件是 UniApp 中一个多功能且强大的组件，UniApp 是一个使用 Vue.js 开发跨平台应用程序的框架。u-popup 组件提供了一种在应用程序的其他内容上方显示临时或浮动内容的方式。
使用方法： 要在 UniApp 项目中使用 u-popup 组件，你需要…
uni-app plus高效打开格式为base64的pdf
// 直接转pdf到公共目录---速度较快base64ToPdf(base64){return new Promise((resolve, reject) > {if (typeof plus object) {var basePath _downloadsvar dirPath bn_wtylet fileName new Date().getTime() "_" (Math.random() * 1000 >>> 0) &…
基于springboot vue uniapp服务预约系统源码(毕设)
开发环境及工具：
大等于jdk1.8，大于mysql5.5，nodejs，idea（eclipse），HBuilder
技术说明：
springboot mybatis vue elementui uniapp
代码注释齐全，没有多余代码&#…
uni-app上传音频，图片步骤
在uni-app中，上传音频和图片通常需要借助小程序的API来完成。下面是一个简单的步骤：
上传图片
首先，你需要使用uni.chooseImage方法从相册或相机中选择图片文件。然后，利用选择的图片路径来调用小程序的uni.uploadFile方法进行上…
uniapp播放 m3u8格式视频 兼容pc和移动端
支持全自动播放、设置参数 自己摸索出来的，花了一天时间，给点订阅支持下，订阅后，不懂的地方可以私聊我。
代码实现 代码实现
1.安装dplayer组件
npm i dplayer2. static/index.html下引入 hls
引入hls.min.js 可以存放在static项目hls下面<script src="/static…
【uniapp小程序实战】—— 使用腾讯地图获取定位
文章目录🍍前言🍋正文1、首先看官网uni.getLocation(OBJECT)#注意2、腾讯位置服务平台申请密钥和下载SDK2.1 申请开发者秘钥2.2 开通webserviceAPI服务2.3 下载微信小程序JavaScriptSDK2.4 安全域名设置3、配置manifest.json文件4、示例代码展示4.1 引用…
UniApp百度人脸识别插件YL-FaceDetect
插件地址：https://ext.dcloud.net.cn/plugin?id15061
插件说明： 百度离线人脸识别，人脸收集，属性（性别年龄）识别等，目前只支持安卓端！
另：该插件支持的功能为属性识别…
uniapp设置手机通知权限以及uniapp-push2.0推送
unipush2.0代码
export default function () {// 调用获取用户通知权限setPermissions()// 获取客户端唯一的推送标识，可用于测试uni.getPushClientId({success: (res) > {console.log(res.cid)},fail(err) {console.log(err)}})// 监听推送uni.onPushMessage(r…
uqrcode+uni-app 微信小程序生成二维码
使用微信小程序需要弹出动态二维码的需求，从插件市场选了一个下载次数较多的组件引入到项目中uqrcode，使用步骤如下：
1、从插件市场下载
插件地址：https://ext.dcloud.net.cn/plugin?id1287，若你是跟我一样是用uni-…
案例028:基于微信小程序的小说阅读器设计与实现
文末获取源码 开发语言：Java 框架：SSM JDK版本：JDK1.8 数据库：mysql 5.7 开发软件：eclipse/myeclipse/idea Maven包：Maven3.5.4 小程序框架：uniapp 小程序开发软件：HBuilder X 小程序…
uni-app 在 APP 端的版本强制更新与热更新
整包更新与热更新的区别
① 整包更新是指下载完整 apk 文件进行覆盖安装
② 热更新是指把 app 有改动的地方打包进 wgt 文件，只更新 wgt 文件中的内容，不进行整包安装，在用户视角也叫做省流量更新
版本号规则约束
建议严格遵循 Semantic …
uniapp上实现左右关联滚动
先看效果： 代码：
<template><view class"container"><!-- 左侧fixed导航区域 --><view class"left"><viewv-for"item in leftList":key"item.id"class"left_item":class…
uni-app项目使用uCharts高性能跨全端图表组件
前言：
uCharts全新图表组件，全端全平台支持，开箱即用，可选择uCharts引擎全端渲染，也可指定PC端或APP端单独使用ECharts引擎渲染图表。支持极简单的调用方式，只需指定图表类型及传入符合标准的图表数据即可…
【uniapp】uniapp中本地存储sqlite数据库保姆级使用教程（附完整代码和注释）
数据库请求接口封装
uniapp中提供了plus.sqlite接口，在这里我们对常用的数据库请求操作进行了二次封装 这里的dbName、dbPath、recordsTable 可以根据你的需求自己命名
module.exports {/** * type {String} 数据库名称*/dbName: salary,/*** 数据库地址* type {…
【教程】别动我的代码！聊聊那些代码保护技术
怎么保护苹果手机移动应用程序ios ipa文件中的代码？
在当今移动应用市场竞争激烈的环境中，代码保护功能对于iOS应用程序的成功非常关键。代码保护可以帮助开发者防范盗用、逆向工程和未授权访问等风险。通过保护你的iOS IPA文件代码，你可以确…
uniapp小程序录音功能权限问题
微信小程序录音权限设置 methods: {recordShow(e) {var that this;uni.getSetting({success(res) {// console.log(res.authSetting[scope.record]);//判断是否第一次获取录音功能if (!res.authSetting[scope.record]) {//调用后会立刻弹窗询问用户是否同意授权录音给小程序un…
uni-app image组件当显示不出图片时显示默认图片
我的image绑定了数组，数组中的对象包含要显示的图片路径，
我的路径是服务器的路径，所以会存在显示不出来的情况，当显示不出来的时候就要显示本地的默认图片
我的方案是这样的：
image有一个error的方法 当图片显示不…
uni-app+uniCloud开发微信小程序之小功能实现思路(持续更新中...)
1.all页实现筛选显示数据
需求分析
从uniCloud中获取数据渲染到界面上让课程按照课程预约数倒序排序点击每一项分类之后显示对应的课程信息并更改抽屉旁的文字
实现思路
渲染数据用到了unicloud-db组件，倒序排列直接设置属性orderby"appointment desc&quo…
uniapp使用vue
uniapp集成了Vuex，，并不需要安装vuex
定义自己的vuex
vuex中独立命名空间： 可以在模块中使用 namespaced 属性，设置为 true，，这样做的好处是，，不同模块之间的state，mut…
uni-app：重置表单数据
效果 代码
<template><form><input type"text" v-model"inputValue" placeholder"请输入信息"/><input type"text" v-model"inputValue1" placeholder"请输入信息"/><input type&quo…
苹果上架Guideline 4.3 - Design
最近上架苹果商店，审核提示
Guideline 4.3 - DesignWe noticed your app shares a similar binary, metadata, and/or concept as apps previously submitted by a terminated Apple Developer Program account.Submitting similar or repackaged apps is a form o…
Vue3 + TypeScript + Uniapp 开发小程序【医疗小程序完整案例·一篇文章精通系列】
当今的移动应用市场已经成为了一个日趋竞争激烈的领域，而开发一个既能在多个平台上运行，又能够高效、可维护的应用则成为了一个急需解决的问题。
在这个领域中，Vue3 TypeScript Uniapp 的组合已经成为了一种受欢迎的选择，特别…
uni-app+uniCloud开发微信小程序BUG总结（持续更新中...）
星空学堂starSchool
1.项目搭建
2021.11.1
bug1(使用less)
HbuilderX使用less报错 在uni-app官网导入hx也失败
解决办法：
进入hx安装目录并在控制台执行npm install bug2（组件跳转）
组件内使用路由跳转使用相对路径不能跳转࿰…
微信支付app支付怎么快速开通
这里给大家推荐一款免费迭代 二开便捷的商城项目：源码直通车>>>
怎样快速开通呢？下面给大家简单科普下：
第一步：开通微信支付；
开通APP支付需要先有一个微信商户号并且需要在微信开发平台申请一个appid
商…
uniapp（Android端）引入百度地图
效果图 1.在util下建一个map.js
export function mymap(ak) {return new Promise(function(resolve, reject) {window.init function() {resolve(mymap)}var script document.createElement(script)script.type text/javascript script.src http://api.map.baidu.com/a…
Uniapp集成腾讯IM+音视频通话
腾讯IM(包含界面)源码下载相关配置
传送门：https://cloud.tencent.com/document/product/269/36887 传送门：https://github.com/TencentCloud/TIMSDK/tree/master/uni-app vue2 vue3都可 笔者用的vue2 解压文件 拖到编辑器 #项目右键 在命令行窗口打开 …
uniapp公共新闻模块components案例
uniapp公共新闻模块components案例
简介：本文使用uniapp的公共新闻模块讲解components案例。 效果展示：
第一步
创建公共模块
第二步
编写组件
<template><view class"newsbox"><view class"pic"><ima…
vue3类型uniapp调用signalr
目录
背景
安装
renderjs
1选择一个tab页面承载renderjs代码
2编写业务逻辑代码
3编写renderjs代码 背景
后端使用.net6开发，长链接选择了微软的signalr而非原生的websocket
前端uniapp下vue3类型开发的app，需要通过长链接获取后端推送的消息
安…
uniapp打包白屏问题
【bug】：浏览器运行正常，模拟器、真机运行只有tab栏显示，或者完全白屏。打包也是白屏。 【控制台报错信息】： 注意：app不支持dom操作 【解决办法】：在main.js里修改 render函数是vue通过js渲染dom结构的…
uniapp封装api请求方式一
1、先创建文件夹api，包含index.js、request.js（users.js文件是用于封装某个模块的请求，例如我的、首页、新闻页等等） 2、打开request，将以下代码放入其中
const http {// baseUrl 地址baseUrl: ,// 请求方法request…
uni-app项目运行和项目结构目录讲解
UNI-APP学习系列
uni-app项目运行和项目结构目录讲解 文章目录 UNI-APP学习系列前言总结 前言
UNI-APP学习系列之uni-app项目运行和项目结构目录讲解 运行项目 使用 pnpm 包管理工具 # 查看是否安装pnpmpnpm -v# 无则安装npm install -g pnpm下载依赖 pnpm i运行pnpm dev:h…
uni-app路由进阶—不同路由跳转配置的使用
uni-app路由进阶—不同路由跳转配置的使用
uni-app路由进阶—不同路由跳转配置的使用 文章目录 uni-app路由进阶—不同路由跳转配置的使用前言一、配置2个一级导航页面（tabBar）二、路由配置分类总结 前言
UNI-APP学习系列之uni-app路由进阶—不同路由跳…
uni-app 微信小程序端调用扫一扫识别小程序码（菊花码，太阳码）
返回值中，path就是小程序码对应的路径
扫描的码必须本小程序AppID和secret生成的，也可以在小程序后台-->工具-->填写小程序路径 生成进行测试 uni.scanCode({success(res) {console.log(res)}
})
uniapp项目实践总结(十五)使用websocket实现简易聊天室
导语：在一些社交软件中，经常可以看到各种聊天室的界面，接下来就总结一下聊天室的原理个实现方法，最后做一个简易的聊天室，包括登录/登出、加入/离开房间、发送接收聊天消息等功能。 目录 准备工作原理分析组件实现实战演练服务端搭建案例展示准备工作 在pages/index文件夹…
uniapp 下拉框可输入可选择
如何使用
1.需要引入uni-combox，代码如下，根据需求自己整改：
<template><view class"uni-combox" :class"border ? : uni-combox__no-border"><view class"uni-combox__input-box"><…
使用uni-app开发微信小程序-基础知识
概念
使用uni-app开发微信小程序，uni-app是使用vue开发的框架，能通过框架编译到微信开发者工具的代码
新建项目
下载app开发版的HBuilder（含插件多点） - 新建uni-app项目 - 选择默认模版
运行小程序
运行小程序 - 点击运行 -…
微信小程序以下文件已被配置忽略打包上传,模拟器无法获取
如果还不行，就参考下面这个，多搞一步
【[获取文件失败] 以下文件已被配置忽略打包上传，模拟器无法获取】解决方法【官方】_tang_love_1314的博客-CSDN博客
uniapp (Android端) 点击按钮打开第三方地图并导航
1.效果图 2.示例代码
//打开第三方地图
toMapAPP(e){const latitude Number(e.lat)const longitude Number(e.lng)uni.openLocation({latitude: latitude,longitude: longitude,name: e.address,scale: 12,success(){console.log(success)}})
} 文档链接：uni-app…
uniapp数组里面多个参数用picker
<view class"cu-form-group"><view class"title">国家或地区：</view><picker change"bindPickerChange" :value"index" :range"array" range-key"name"><view class"…
uniapp实现界面可任意拖动小图标
uniapp实现界面可任意拖动小图标一、问题：二、解决步骤2.1 根据uni-app官方提供的案例，创建组件2.2 在需要的界面引入组件使用额外注意一、问题：
例如购物车小图标可任意拖动
二、解决步骤
2.1 根据uni-app官方提供的案例，创建…
uni-app点击复制文本
<view><text>{{copyText}}</text><view tap"copyClick">点击复制</view>
</view>//适用小程序和app的点击复制
copyClick() {uni.setClipboardData({data:this.copyText,success: function (res) {uni.getClipboardData({succes…
uni-app修改checkbox样式
注意：必须写在App.vue页面 <style>uni-checkbox .uni-checkbox-input {border-radius: 50% !important;color: #ffffff !important; }uni-checkbox .uni-checkbox-input.uni-checkbox-input-checked {color: #fff;background: #1953ed;}
</style>
uni-app自定义底部tabbar实现某个tab的显示和隐藏
自定义的tabbar可用v-if实现某个tab的显示和隐藏
页面
<view class"tab-box row acenter"><navigator class"grow1 column acenter jcenter" hover-class"none" url"" open-type"switchTab"><image class&…
(二十五)、实现评论功能（5）【uniapp+uinicloud多用户社区博客实战项目(完整开发文档-从零到完整项目)】
1，实现二级回复的入库操作
1.1 两个子组件（comment-item和comment-frame）与父组件reply之间的属性传值
comment-item： props: {item: {type: Object,default () {return {}}}},comment-frame： props: {commentObj: {…
video层级过高，以及界面使用多个video时，在安卓APP上同时播放的问题（uniapp）
1、video层级过高的问题
问题一： 我的界面由于是自定义导航栏，所以使用video时，上滑界面video会直在最上层，盖着 头部导航栏
解决方法：使用cover-view,自定义头部使用cover-view替换view
问题二：自定义…
解决uniapp编译的微信小程序不支持v-bind=“$attrs“
1. 环境
1. uniapp
2. vite vue3 TypeScript vite（移动端低代码）
3. 编译成多端通用的小程序2. 需要分两类解决 v-model属性 在高版本的vue3vite中使用父组件传递下来的props中的某一个属性，作为当前组件的子组件的v-model入参࿰…
【翻译一下官方文档】认识uniCloud云数据库（基础篇）
我将用图文的形式，把市面上优质的课程加以自己的理解，详细的把：创建一个uniCloud的应用，其中的每一步记录出来，方便大家写项目中，做到哪一步不会了，可以轻松翻看文章进行查阅。（此文…
【翻译一下官方文档】学习uniCloud云数据库之前需要了解的传统api操作数据库（Command）
我将用图文的形式，把市面上优质的课程加以自己的理解，详细的把：创建一个uniCloud的应用，其中的每一步记录出来，方便大家写项目中，做到哪一步不会了，可以轻松翻看文章进行查阅。（此文…
uniapp（vue2）封装子组件
创建子组件
在项目根目录下新建 components 目录，右键选择“新建组件”，创建子组件（这里以 search.vue 举例）并且为同名目录，即 components --> search --> search.vue，这样父组件可以直接使用&…
uniapp实现小程序打开相册或拍照上传图片附赠兼容H5方法
文章目录 前言一、支持相册选择和拍照二、删除图片三、效果图存在问题 前言
小程序上传图片，或者拍照上传图片，并附带兼容H5上传图片方法，压缩图片。 一、支持相册选择和拍照
支持选择相册和拍照，可以使用uniapp提供的api&#…
【uni-app】实现上拉加载
【场景】
假设你正在开发一款社交软件，用户可以浏览其他用户发布的动态信息。当用户下滑页面查看信息时，如果所有信息都被加载出来了，那么用户无法继续获取新的动态信息。因此，我们需要在这种情况下使用“上拉加载更多”的功能。…
uni-app组件之scroll-view的详细教程
scroll-view 是 UniApp 中的一个重要组件，它提供了在视图区域内滚动内容的功能。无论是在小程序、H5 还是 APP 端，scroll-view 都能够帮助你实现滚动内容的需求。本教程将详细介绍如何在 UniApp 中使用 scroll-view 组件，并提供示例代码供参考…
Uniapp微信、支付宝App支付和微信小程序支付
// 发起支付pay(){let that this;let orderInfo {}; // 自己的订单参数 // app支付// #ifdef APP-PLUSlet rest that.$api.payments(orderInfo); // 自己的订单接口let provider type 1 ? wxpay : alipay; // 支付类型，wxpay微信，alipay支付宝if(…
iOS证书(.p12)和描述文件(.mobileprovision)申请
目录 iOS证书(.p12)和描述文件(.mobileprovision)申请文末扩展（UDID获取、添加测试设备） 说明：本文申请证书、描述文件转载自 uniapp官网 iOS证书(.p12)和描述文件(.mobileprovision)申请 官网会时不时更新，如有疑问&…
Uni-app学习从0到1开发一个app——(3)简单小工程内容介绍
文章目录 工程文件 看看一个标准的hello微信小程序工程文件的组成和作用。 工程文件
可以参考官方教程：传送门 之前的文章有详细的开发环境介绍，传送门Uni-app学习从0到1开发一个app——(2)windowns环境搭配，这里我们先建一个简单的示例微信…
uniapp实现应用wgt资源热更新
APP更新一般有两种形式 1、整包更新，通过hbuliderx提供的在线云打包就属于整包更新，属于全量更新，缺点就是打包时间长、要重新走市场审核。费时 2、wgt资源包热更新，通过hbuliderx打wgt包 ，速度快，能在应用…
【uni-app从入门到实战】资讯列表、商品详情
文章目录资讯列表资讯详情商品详情商品导航资讯列表
今天我们在之前建好的文件 news.vue 中完成资讯列表，先看代码：
<template><view class"news"><view class"news_item" v-for"(item,index) in newsList&qu…
前端Vue自定义tabbar底部tabbar凸起tabbar兼容苹果刘海屏小程序和APP
前端Vue自定义tabbar底部tabbar凸起tabbar兼容苹果刘海屏小程序和APP， 下载完整代码请访问uni-app插件市场地址：https://ext.dcloud.net.cn/plugin?id13167
效果图如下： # cc-myTabbar
#### 使用方法
使用方法
<!-- tabBarShow&#…
uni-app项目中如何添加百度统计代码？
在项目根目录创建一个空的html文件命名为baidu_statistics.html 直接copy以下代码，运行即可
<!DOCTYPE html>
<html lang"zh-CN"><head><meta charset"utf-8"><meta http-equiv"X-UA-Compatible" conten…
uniapp怎么实现权限登录 没有权限退出到登录页
在uniapp中实现权限登录可以使用如下思路： 使用本地存储存储用户登录信息，如 token 等。 在 App.vue 中监听页面的跳转，如果用户没有登录或登录信息过期，则跳转到登录页。 可以使用路由拦截器来实现权限控制，当用户访…
uni-app集成uni-simple-router、uni-read-pages插件自动读取page.json文件实现路由管理（无需手动配置路由表）
npm 下载uni-simple-router、uni-read-pages插件
"uni-read-pages": "^1.0.5",
"uni-simple-router": "^2.0.5"根目录新建router.js
import {RouterMount,createRouter
} from uni-simple-router;const router createRouter({platf…
uni-app 动态设置页面标题
//动态设置页面标题
uni.setNavigationBarTitle({title:res.data.storeName
}) 边学习，边记录
一起加油！！
uniapp将页面滚动到目标位置
uniapp将页面滚动到目标位置/返回顶部 这里分享其中两种方式，仅供参考~ 文章目录 uniapp将页面滚动到目标位置/返回顶部方式一：使用 pageScrollTo方式二：使用 scroll-view 方式一：使用 pageScrollTo
backToTop() {uni.pageScroll…
uniapp TypeError: Cannot set property 改成箭头函数
uni.chooseImage({count: 6, sizeType: [original, compressed], sourceType: [album], success: function (res) {this.a res}
});上面代码在回调里面使用了this ,导致TypeError: Cannot set property。
作用域是window。window没有a这个变量。改成箭头函数 ，因…
uni-app单个页面的生命周期函数
除了整体应用的生命周期，每一个页面都有自己的生命周期 我们先来看看代码
<script>export default {data() {return {title: Hello}},onLoad(optins) {console.log(页面加载完成,optins);},onShow() {console.log(页面显示);},onReady() {console.log("…
【APP平台化】APP平台化、低代码平台设计思路与实现
要实现 APP 平台化并支持页面定制化，类似于低代码平台，可以采用以下步骤和方法： 架构设计：从架构的角度出发，将 APP 设计为可插拔的模块化结构，其中包括核心功能模块、界面显示模块和定制化模块。确保各个模…
【样式静态】创建地址 省市区，详细地址，姓名，联系方式，电话
效果图
uview 2.0
<template><view class"addbox"><view class"order bgf common_p u-border-t"><view class"common_title"><text></text> 客户信息</view><view class"flex_align_cente…
在Uniapp中实现在线使用iconfont的图标
icanfont官网
iconfont官网：iconfont-阿里巴巴矢量图标库
在自己建的项目下：点击 Font Class 可以看到下面的在线 css文件 在 <style> 标签中，使用 import 指令来引入在线的 CSS 文件。例如：
<style>import url…
uniapp:在HBuilderX里使用夜神模拟器
夜神模拟器端的操作步骤：
1、安装夜神模拟器，加载时间比较长，耐心等待一下。
2、打开夜神模拟器，点击右侧的模拟器助手图标。
3、选择一个安卓版本，为了方便写博客，我就选择了软件推荐的正式版。&#x…
打包时未添加livepusher模块
我们的项目采用的是混入开发，html5, 使用到了安卓离线打包，其中使用到了livepusher模块，本来没什么难事的，很简单的一个问题，但是中文的官方文档却介绍错了包名，一直在郁闷为啥不行，痛苦啊。本来…
uniapp实现tab切换可以滚动的效果
实现效果
当 tab 切换的内容很多时，需要用到滚动，希望在点击 tab 的时候可以自动滑动到对应的tab下
知识点
scrollIntoView：该scrollIntoView()方法将调用它的元素滚动到浏览器窗口的可见区域。
语法 element.scrollIntoView（…
【js】uniapp项目引入 js文件，以及全局使用
uniapp项目引入 js文件，以及全局使用
util.js 文件内容
//路径转化
function getPath(path) {return path?path.split(?).shift():path;
}//计算两个时间之间的时间差 多少天时分秒
function intervalTime(startTime,endTime) {// var timestampnew Date().getT…
【uniapp】微信小程序迁移至uniapp以及echarts图表
目录代码迁移云开发迁移代码细节调整uniapp配置文件uniCloud云存储图片显示uniCloud云数据库uniapp获取openidradio点击后需要取消点击uniapp使用echarts图表插件海报生成需要对微信小程序开发和uniapp开发都有了解 目标： 微信小程序原生开发转为uni-app开发微信小程…
【uniapp】跨端开发问题记录
介绍 安装Hbuilder X 主要目录结构-类似于vue manifest.json：uni-app配置文件 pages.json：全局配置，类似于小程序的app.json uni_modules：uni-ui static：静态资源 pages：页面 components：组件 …
uniapp打包之配置MacOS虚拟机生成iOS打包证书
前言
uniapp是一款跨端开发框架,可用于快速开发iOS、Android、H5等多端应用。本文将详细介绍如何实现uniapp开发的iOS应用打包。
详细步骤
一、下载苹果原版镜像文件
点击此处下载
二、安装VMware
uniapp打包iOS应用需要生成相应证书和P2文件，这些都需要用到I…
uni-app 项目笔记 基础配置及scroll-view左右滚动效果
一直想用uni来做个项目，这次公司有新项目，我决定用uni来写，虽然自己学的还不是很熟。感觉只有在项目中才能更好的学习，所以记下在项目中遇到的一些要点。
第一步：新建项目我就不写了，当项目建好后会生成很…
【uniapp】uniapp反向代理解决跨域问题（devServer）
背景介绍
前段时间，在拿uniapp开发的时候，出现了跨域问题，按理说跨域应该由后端解决，但既然咱前端可以上，我想就上了（顺手装个13）
首先介绍什么是跨域
出于浏览器的同源策略，在发…
uni-app引入阿里巴巴iconfont
将选定的图标加入项目，然后下载下来，将这个几个文件放入static文件夹下： 然后在main.js里面引入： 在页面里引用：
<view class"icon iconfont icon-kehuishouwu-zhiwulei"></view>效果如下&…
uniapp实现上传图片添加日期和地点水印，修复多张图片同时上传，显示相同图片问题
整体实现流程：首先调用uni.chooseImage方法，配置count、sizeType、sourceType参数，分别代表选择的图片个数、original 原图，compressed 压缩图，默认二者都有、是从相册还是拍照。
然后在成功的回调中拿到上传的所有图…
uniapp getUserProfile:fail invalid session
uniapp uni.getUserProflie 部分安卓手机调不起来弹窗 错误原因：应该在uni.getUserProflie之前调用uni.login
但是直接在uni.login的成功回调里面调用uni.getUserProflie也不行，所以把uni.login放在了onLoad里面
修改前的代码
// 获取用户信息
getUse…
uni-app使用less/scss语法
在HBuilderX里面： 工具–》插件安装–》找到less/scss–》点击安装即可。
如下图： 然后在style标签上加上lang"less"即可：
<style lang"less">
springboot工程集成前端编译包，用于uni-app webView工程，解决其需独立部署带来的麻烦，场景如页面-＞画布-＞图片-＞pdf
前端工程 访问方式
http://127.0.0.1:8080/context/frontEnd/index放行
public class SecurityConfig extends WebSecurityConfigurerAdapter {
"/frontEnd/**",SysFrontEndController
import lombok.extern.slf4j.Slf4j;
import nl.basjes.shaded.org.springfram…
uniapp —— 微信小程序预览文件
使用uni内置方法下载预览
1.问题：但是内置方法一般使用的是url预览，如果接口返回的是文件流，前端如何处理
uni.downloadFile uni.openDocument 2.解决：后端接口路径拼接，如果使用的是PC端下载文件的接口，…
uniapp-设置全屏
需求：就是想要小程序不受限制，可以把图片或者文字全屏的展示，如下图 vue代码如下：
<template><view class"content"><image class"image-bg" src"/static/logo.png" /><imag…
【UniApp开发小程序】商品详情展示+评论、评论展示、评论点赞+商品收藏【后端基于若依管理系统开发】
文章目录 界面效果界面实现工具js页面日期格式化 后端收藏ControllerServicemapper 评论ControllerServiceMapper 商品Controller 阅读Service 界面效果
【说明】
界面中商品的图片来源于闲鱼，若侵权请联系删除
【商品详情】
【评论】
界面实现
工具js
该工…
uni-app自定义多环境配置，动态修改appid
背景
在企业级项目开发中，一般都会分为开发、测试、预发布、生产等多个环境，在工程化中使用不同的打包命令改变环境变量解决不同环境各种变量需要手动修改的问题，比如接口请求地址，不同环境的请求路径前缀都是不同的。在使用uni-…
uniapp开发小程序，当二级页面返回一级页面时，触发一级页面的事件或者更新一级页面的某项数据
二级页面代码：
uni.navigateBack({delta: 1,success() {const pages getCurrentPages();const targetPage pages[0];targetPage.$vm.addJournalStatetrue}
})
有人部分博客获取上一页信息是通过这样获取的：var targetPage pages[pages.length - 2]&…
uniapp项目添加人脸识别功能，可用作登录，付款，流程审批前的安全校验
本案例使用了hbuilder插件商城中的活体检验插件，可自行前往作者处下载查看，
效果图如下 此插件需要在manifest.json中勾选 实现流程
1：前往hbuilder插件市场下载插件
2：在页面中导入import face from "/uni_modules/mcc-…
uni-app如何生成海报图片
项目场景：
在uni-app中，通过点击邀请分享海报的方式，可以展示不同的海报，并通过扫描海报上的二维码来实现用户之间的关系绑定，从而实现分销功能；每次生成的海报样式都可能不同，可以根据后台配置…
uni-app 封装uni.request
1、首先建立一个文件夹，然后新建一个api.js，js中这样来定义，如下：
//const baseUrl http://XXXX.com
const request (url , date {}, type GET, header {
}) > {return new Promise((resolve, reject) > {uni.req…
Aidex 移动端快速开发框架# RuoYi-Uniapp项目，uniapp vue app项目跨域问题
参考地址：
manifest.json官方配置文档：manifest.json 应用配置 | uni-app官网
Chrome 调试跨域问题解决方案之插件篇：
uni-app H5跨域问题解决方案（CORS、Cross-Origin） - DCloud问答 其实uni-app官方有解决跨域的办…
uniapp获取 pdf文件流 并展示
1、流数据 uni.request({ url: this.$config.apiUrl“/api/report/content/fill?codebv.mf.refund.pay.voucher&busiNo00201323051500148949”, header: { ‘content-type’: ‘application/json;charsetutf-8’, ‘X-App-Code’: ‘weixin’, ‘X-Source’: ‘program’,…
uni-app获取节点的相关信息
获取单个节点：
selectorQuery.select(selector) 在当前页面下选择第一个匹配选择器 selector 的节点，返回一个 NodesRef 对象实例，可以用于获取节点信息。 selector 说明： selector 类似于 CSS 的选择器，但仅支持下列…
uni-app点击复制指定内容（点击复制）
官方api
uni.setClipboardData(OBJECT) uni.setClipboardData({data: 要被复制的内容,success: function () {console.log(success);}
});
【ant-design-vue】ant-design-vue在uniapp使用时，auto-import失败报错
前言
在我的 uniapp vue3 vite 项目中，使用了 ant-design-vue 4.x 组件库，同时我还使用了 vite 插件 auto-import 用于自动导入vue3的组合式api。当我全局引用antd-vue时，开发模式下可以正常运行，却不能 npm run build 正常打包…
uni-app 实现自定义按 A~Z 排序的通讯录(字母索引导航)
创建 convertPinyin.js 文件
convertPinyin.js
将下面的内容复制粘贴到其中
const pinyin (function() {let Pinyin function(ops) {this.initialize(ops);},options {checkPolyphone: false,charcase: "default"};Pinyin.fn Pinyin.prototype {init: functi…
uniapp——实现在线选座功能——技能提升
首先声明一点：下面的内容是从一个uniapp的程序中摘录的，并非本人所写，先做记录，以免后续遇到相似需求抓耳挠腮。 这里写目录标题 效果图代码——html部分cu-custom组件anil-seat组件 代码——jscss部分 效果图 代码——html部分 …
uniapp中git忽略node_modules，unpackage文件
首先在当前项目的命令行新建.gitignore文件：
touch .gitignore再在编辑器中打开该文件，并在该文件中加入需要忽略的文件名：
node_modules/
.project
unpackage/
.DS_Store
提示：如果以前提交过unpackage文件的话，需…
uni-app 之 解决u-button始终居中问题
uView中u-button始终居中问题如何解决的简单方法？
1：给该元素margin-right: 0;可以达到向右靠齐；
2：给该元素的父元素设置float: right image.png
<u-button
style"width: 50px; margin-left: 0;"
plain"t…
uniapp录音功能和音频播放功能制作
录音功能
在 UniApp 中，你可以使用 uni.getRecorderManager() 方法来创建一个录音管理器实例，从而实现录音功能。
以下是一个示例，演示了如何在 UniApp 中使用 uni.getRecorderManager() 实现录音功能：
// 在需要录音的页面或组…
记录uniapp切换主题色能在抖音小程序上无效问题
东西很简单,就是一个data-theme"light"这种，就可以换不同的主题色
但是运行到抖音小程序无效，但是改成 class“theme-light” 就可以，但是仅限于页面层级的，组件的也不行
不知道现在怎么回事，也不知道该咋…
vue3+ts+uniapp小程序封装获取授权hook函数
vue3tsuniapp小程序封装获取授权hook函数 小程序授权的时候，如果点击拒绝授权，然后就再也不会出现授权了，除非用户手动去右上角…设置打开 通过uni官方api自己封装一个全局的提示: uni.getSetting :http://uniapp.dcloud.io/api/other/settin…
uni-app微信小程序canvas中使用canvasToTempFilePath在手机上导出图片尺寸与实际不符
问题描述：比如图片的尺寸是1125*2001像素，这样用微信开发者工具下载下来的图片尺寸是1125*2001像素，用不同的手机去操作，下载出来的图片尺寸都不一样，和原图片尺寸差距很大。
解决方案：canvas写入的时候是…
uniapp产品规格弹窗组件
1.效果 2.创建一个Mypopup组件 3.全局组件使用（打开main.js添加以下代码）
import Mypopup from /components/Mypopup/Mypopup.vue
Vue.component(Mypopup,Mypopup)4.子组件
<template><!-- 规格-模态层弹窗 --><view v-if"newSpe…
什么是uni-app
uni-app 是一个使用 Vue.js 开发跨平台应用的前端框架，开发者编写一套代码，可编译到iOS、Android、H5、小程序等多个平台。
为什么要选择uni-app？
uni-app在跨端数量、扩展能力、性能体验、周边生态、学习成本、开发成本等6大关键指标上拥有…
uni-app 在微信小程序端预览文件时文件名是一串乱的字符串
原方法 uni.downloadFile({url: pdfURL, // 文件原本 URL 地址success(res) {if (res.statusCode 200) {uni.openDocument({filePath: res.tempFilePath, // 微信临时文件路径showMenu: true // 右上角是否有可以转发分享的功能(只支持微信小程序)});}}
});
新方法 uni.downl…
uniapp使用tki-qrcode生成二维码
uniapp使用tki-qrcode生成二维码 导入插件方式一： 导入插件方式一：
1、使用npm下载： 详细属性.方法.事件说明请参照npmjs社区
npm i tki-qrcode2、页面使用并引入挂载插件：
<view class"qrcode-icon"><tki-…
【uniapp】查看协议文件
agreement.vue
<template><view class"agreement"><!-- 协议页面 ,只能在手机上看，模拟器无法查看--><web-view :src"protocolUrl"></web-view></view>
</template><script>export default {…
uniapp-vue3 抖音小程序开发（上线项目开源）
最近公司临时接一个项目来接手别人的流量，项目比较小，时间比较赶。
需求：一个答题小程序，通过答题来实现性格测算和分析。
之前开发过支付宝小程序和微信小程序，这次是首次开发抖音小程序，老板要求只能下…
uniapp 无法预览，编辑后vendor.js文件过大
我们在使用uniapp开发小程序时，希望可以随时真机预览一下，但是如果项目过大时，发现发行模式可以上传，但是运行模式不可以预览。（当然咱们可以通过分包处理，但是这不是今天讨论的重点）
开启生产…
uniapp 实现地图头像上的水波纹效果
最近实现了uniapp 地图头像水波纹的效果，话不多说，先来看看视频效果吧：链接 在这里具体的代码就不放出来了，还是利用了uniapp的 uni.createAnimation 方法，因为cover-view 不支持一些css 的动画效果，所以这…
【uniapp】使用Vs Code开发uniapp：
文章目录 一、使用命令行创建uniapp项目：二、安装插件与配置：三、编译和运行:四、修改pinia： 一、使用命令行创建uniapp项目： 二、安装插件与配置： 三、编译和运行: 该项目下的dist》dev》mp-weixin文件导入微信开发者…
uni-app实现图片上传功能
效果 代码
<uni-forms-item name"ViolationImg" label"三违照片 :"><uni-file-picker ref"image" limit"1" title"" fileMediatype"image" :listStyles"listStyles" :value"filePathsL…
uniapp踩坑之项目：判断字符串长度自动调整选项卡宽度
利用动态:class来判断字长调整选项卡uni-data-select 宽度 //html
<view><view style"width:100%" :class"checkLength(text)>4 ? textexplode:textshrink"><uni-data-select v-model"value" :localdata"rangeTag"…
uniapp配置添加阿里巴巴图标icon流程步骤
文章目录 下载复制文件到项目文件夹里项目配置目录结构显示图标 下载
阿里巴巴icon官网 https://www.iconfont.cn/ 复制文件到项目文件夹里 项目配置目录结构 显示图标
uni-app封装省市区下拉组件（后台获取数据）
一.后台数据格式 PROCINCE:[{itemName:,itemValue:}]
CITY:[{itemName:,itemValue}]
AREA:[{itemName:,itemValue}]
前端将地址数据缓存在了pinia中
前端主要使用picker进行勾选 二.代码 <template><picker change"bindPickerChange" columnchange"…
uniapp自定义图标库引入
参考地址：CustomIcon 扩展自定义图标库 | uView 2.0 - 全面兼容 nvue 的 uni-app 生态框架 - uni-app UI 框架 使用u-icon标签时，发现该组件支持custom-prefix属性，参考它的说明。我们可以得到字体包。
对于移动端有设计搞，且设计…
uniapp 扫码跳转获取 aid 发请求获取信息
1.代码如下:
scanQRcode() {uni.scanCode({scanType: ["barCode", "qrCode", "datamatrix", "pdf417"],autoDecodeCharset: true, //是否启用自动识别字符编码功能，默认为否autoZoom: true, //是否启用自动放大࿰…
uniapp阻止冒泡的方法，点击事件嵌套点击事件，怎么阻止同时触发
uniapp阻止冒泡的方法 当我们遇到点击事件嵌套点击事件的时候，点击里边的事件，外边的也会跟着触发该怎么办？ 起初我尝试用了css里的修改z-index属性的方法，把里边的<view>标签放在上边，结果两个事件还是同时触发…
简单聊聊uniapp和uview组件库一起开发
简单的聊聊uniapp和uview组件库的开发
uniapp是一个基于Vue.js的跨平台开发框架，可以同时开发H5、微信小程序、App等多个平台的应用。这样可以减少开发人员的工作量，提高开发效率。
官网：https://uniapp.dcloud.net.cn/
uView是uni-app生态…
uniapp中引入axios的错误？
场景 在unaipp中使用axios npm i axios 下载完成后 然后在页面中使用 axios.get(“http://3000/searchS”) 然后报错 Adapter http’ is not available in the build 原因 在 UniApp 中使用 Axios 发送 HTTP 请求时，如果出现错误 “Adapter http’ is not available…
uniapp 存储base64资源为http链接图片
1. 新建一个base64.js 文件
const fsm wx.getFileSystemManager();
// base64data base64资源
// name 文件名
function base64src(base64data, name, cb) {const time new Date().getTime();const filePath ${wx.env.USER_DATA_PATH}/${name}.${time}.png;const buffer …
uniapp 布局（自定义导航栏加固定高度的主要内容）
不想让整体页面出现滚动条
页面大致分为三部分，导航栏、主题内容、tabbar，不想让整个页面出现滚动条，只想让主要内容滚动。 我这里是直接用了uni.getSystemInfoSync()，整体分为两部分，自定义头部和滚动内容ÿ…
uni-app--》基于小程序开发的电商平台项目实战（五）
🏍️作者简介：大家好，我是亦世凡华、渴望知识储备自己的一名在校大学生 🛵个人主页：亦世凡华、 🛺系列专栏：uni-app 🚲座右铭：人生亦可燃烧，亦可腐败…
uniapp使用H5实现预览pdf文件
下载后把压缩包解压到自己的项目的static文件夹下的pdf文件下，如图 新建一个文件名为filePreview.vue
<template><view><web-view :src"allUrl"></web-view></view>
</template><script>export default {dat…
weapp-tailwindcss for uni-app 样式条件编译语法插件
weapp-tailwindcss for uni-app 样式条件编译语法插件 版本需求 2.10.0 weapp-tailwindcss for uni-app 样式条件编译语法插件 这是什么玩意?如何使用 tailwind.config.js 注册postcss 插件注册 uni-app vite vue3uni-app vue2 配置完成 配置项
这是什么玩意?
在 uni-app …
uni-app实现拍照功能
直接些这样的组件代码
<template><view><button click"takePhoto">拍照</button><image :src"photoUrl" v-if"photoUrl" mode"aspectFit"></image></view>
</template><script&g…
uniapp 小程序优惠劵样式
先看效果图 上代码
<view class"coupon"><view class"tickets" v-for"(item,index) in 10" :key"item"><view class"l-tickets"><view class"name">10元优惠劵</view><view cl…
uniapp使用@microsoft/signalr（报错“ReferenceError: require is not defined“）
后台老哥要用微软的signalr，总结了一些经验和问题
引入方法
1、npm
npm i microsoft/signalr
2、下载他的js或者cdn
<script src"https://cdnjs.cloudflare.com/ajax/libs/microsoft-signalr/6.0.1/signalr.js"></script>在uniapp中&…
uniapp订单循环列表倒计时
目录 效果图片插件uni-countdown代码最后 效果图片 插件uni-countdown
地址
代码
<template><view class""><!-- 下面循环两个列表 --><view class"item" v-for"(item, index) in listData" :key"index">&…
uni-app yrkDataPicker 日期和时间选择控件
uni-app 选择日期时间控件有 2 月份有 31 天的问题，一直没有修复，uni-calendar 苹果有选择年份和月份后无法显示问题。自己写了一个，只支持 H5 和微信小程序，其他没有试过。
<template><view class"yrk-data-picke…
小程序与uniapp如何进行传参
小程序和uniapp都可以通过以下方式进行传参： query参数传递：在url中添加query参数，如在小程序中通过wx.navigateTo或wx.redirectTo跳转页面时可传递query参数，在uniapp中通过uni.navigateTo或uni.redirectTo跳转页面时也可以传递q…
uni-app_消息推送_华为厂商_unipush离线消息推送
文章目录 一、创建项目二、生成签名证书三、开通 unipush 推送服务四、客户端集成四、制作自定义调试基座五、开发者中心后台Web页面推送（仅支持在线推送）六、离线消息推送1、创建华为开发者账号2、开通推送服务3、创建项目4、添加应用5、添加SHA256证书…
关于使用 uniapp Vue3 开发分享页面 语法糖 setup 开发获取ref踩坑
上代码
前端代码 <!-- 分享弹出 -->
<uni-popup ref"share" type"share" safeArea backgroundColor"#fff"><uni-popup-share></uni-popup-share>
</uni-popup>处理函数 import {onNavigationBarButtonTap} from…
uni-app：实现时钟自走（动态时钟效果）
效果 核心代码
使用钩子函数 mounted()，设置定时器，是指每秒都要去执行时间的获取，以至于实现时间自走的效果 mounted() { this.updateTime(); // 初始化时间 setInterval(this.updateTime, 1000); // 每秒更新时间 }, 自定义方法…
uni-app：如何配置uni.request请求的超时响应时间（全局+局部）
方法一：全局配置响应时间
一、进入项目的manifest.json的代码视图模块 二、写入代码 "networkTimeout": {"request": 5000
},
表示现在request请求响应时间最多位5秒
方法二：局部设置响应时间
一、直接在uni.request中写入属性…
uni-app（1）pages. json和tabBar
第一步 在HBuilderX中新建项目 填写项目名称、确定目录、选择模板、选择Vue版本：3、点击创建
第二步 配置pages.json文件
pages.json是一个非常重要的配置文件，它用于配置小程序的页面路径、窗口表现、导航条样式等信息。 右键点击pages，按…
uniapp如何使用api相关提示框
uni.showToast：用于显示一条带有图标的提示框。title：提示的内容。icon：图标，可选值包括 success、loading、none。duration：提示框持续时间（单位：毫秒），默认为1500。 un…
![[uni-app] uni.showToast 一闪而过问题/设定时间无效/1秒即逝](https://img-blog.csdnimg.cn/80830389b6064472b712721569c8647a.png)
[uni-app] uni.showToast 一闪而过问题/设定时间无效/1秒即逝
toast一闪就消失 1.猜测频繁点击导致 – 排除 2.猜测再定时器内导致-- 排除 3.和封装的接口调用一起导致 - 是改原因
深挖发现: axios封装中, 对loading/hindloading进行了配置,
看来是 showToast 与 loading等冲突导致的
wx.hideLoading(Object object) 解决办法
再封装的…
【Java源码】智慧工地云平台：工地管理专家
智慧工地是目前建筑行业的热门话题之一，它代表了未来建筑施工的发展趋势。那么，智慧工地的未来，你看好吗？ 从技术角度来看，智慧工地无疑是未来发展的趋势。随着人工智能、大数据、云计算等技术的飞速发展，智…
uniapp、微信小程序返回上页面刷新数据
目录 前言：
方法1：
方法2：
方法3： 前言：
返回上页面刷新数据这个功能主要用于在当前页面点击跳转到另一个页面之后，在另一个页面对数据进行了操作，比如：阅读量，然后返…
uniapp检测新版本
一、代码 在app.vue中写入
Update() {const updateManager uni.getUpdateManager();console.log(版本,updateManager,uni.getSystemInfoSync());updateManager.onCheckForUpdate(function(res) {// 请求完新版本信息的回调console.log(版本更新, res);});updateManager.onUpd…
UniApp创建项目HelloWorld
浏览器预览效果镇楼 普通项目创建 点击创建完成后，就如下所示 确实和微信小程序开发差不多。只是稍微换了一个名字的概念了，这个就是开发嘛，不要过于纠结概念性东西。开发开发，开了就知道怎么发了？ 或许是 反正write就…
uniapp 安装 u-view 组件库
u-view 组件库安装教程：https://uviewui.com/components/install.html
注：以下使用 HBuilderx 安装 u-view 2.0 版本，不适用于其它版本。 1.安装 u-view 组件库 2、注册并登录 HBuilderx 账号，点击下载 u-view 组件库。 3、点击…
uni-app--》基于小程序开发的电商平台项目实战（四）
🏍️作者简介：大家好，我是亦世凡华、渴望知识储备自己的一名在校大学生 🛵个人主页：亦世凡华、 🛺系列专栏：uni-app 🚲座右铭：人生亦可燃烧，亦可腐败…
uniapp map地图实现marker聚合点，并点击marker触发事件
1.uniapp官方文档说明
2.关键代码片段 // 仅调用初始化，才会触发 on.("markerClusterCreate", (e) > {})this._mapContext.initMarkerCluster({enableDefaultStyle: false, // 是否使用默认样式zoomOnClick: true, // 点击聚合的点，是否…
Unit3 使用 uniCloud 制作书籍管理移动端应用项目
Unit3 使用 uniCloud 制作书籍管理移动端应用项目 1 构建项目并关联云服务空间2 为项目准备数据库表3 schema2Code4 遇到了错误5 对 "addtime" 字段对应的前端组件进行修改6 首次运行 1 构建项目并关联云服务空间
uniCloud 为开发人员提供了“阿里云”和“腾讯云”两…
uni-app + mui-player vue + mui-player 播放flv文件
uni-app: 先在项目的根路径下打开终端，安装mui-player：
npm install mui-player --save再安装个flv.js依赖：
npm install flv.js --save然后再到main.js中引入：
import "mui-player/dist/mui-player.min.css";
impor…
uni——底部弹框显示，底部导航隐藏
案例 在uni-app中，如果你在tabbar页面显示一个底部弹框，底部导航默认是会依旧显示的。如果你想在弹框显示时隐藏底部导航，你可以使用uni.hideTabBar和uni.showTabBar方法来控制底部导航的显示和隐藏。
export default {methods: {openPopup(…
uniapp app或微信小程序项目使用gite仓库中的图片
注意：以下不适用于浏览器
第一步：新建仓库并上传图片
第二步：设置开源
第三步：复制图片地址如：
https://gitee.com/jiaomingyu/project-img/blob/master/xkmb/haibao/moban/BB_474x707_0_da.png
第四步࿱…
uniapp web-view调整修改高度设置
web-view默认是占全屏，需求想要在头部添加一个返回导航。实现如下：
界面如下：
<view class"myCardNav"><!-- 状态栏占位符 --><uni-nav-bar height"125rpx" border"false" left-icon"le…
环信web、uniapp、微信小程序SDK报错详解---登录篇
项目场景：
记录对接环信sdk时遇到的一系列问题，总结一下避免大家再次踩坑。这里主要针对于web、uniapp、微信小程序在对接环信sdk时遇到的问题。主要针对报错400、404、401、40 (一) 登录用户报400 原因分析：
从console控制台输出及networ…
uniapp vue3 静态图片引入
方法一 从新定义路径 一定看好你图片的路径
代码
<template><div class"main">Main<img :src"getImg()" alt""></div>
</template><!-- 方式一
// <script setup>
// let imgName logo.png
// cons…
uniapp vue国际化 i18n
一、安装 vue-i18n
npm i vue-i18n
二、新建i18n目录 1、en.json 内容
{"loginPage":{"namePh":"Please enter your login account","passwordPh":"Please enter password"}
}
2、zh-CN.json 内容
{"loginPage&qu…
uniapp @click点击事件在新版chrome浏览器点击没反应
问题描述
做项目时，有一个弹出选择的组件，怎么点都不出来，最开始还以为是业务逻辑限制了不能点击。后来才发现别人的电脑可以点出来，老版本的浏览器也可以点出来，最后定位到是新版的chrome就不行了 这是我的浏览器版本…
Uni-App 快捷登录
uniapp 实现一键登录前置条件: 开通uniCloud, 开通一键登录功能参考的文档 : 官网 - 一键登录uniapp指南 : https://uniapp.dcloud.net.cn/univerify.html#%E6%A6%82%E8%BF%B0 官网 - 一键登录开通指南 : https://ask.dcloud.net.cn/article/37965 官网 - unicloud使用指南 htt…
uniapp下载文件安装
代码
uni.getSystemInfo({success: function (res) {console.log(res.osName, "系统信息");console.log(res, "系统信息1");if (res.osName "android") {uni.showLoading({ title: "下载中" });uni.downloadFile({url: 下载文件的路…
uniapp 微信小程ios端键盘弹起后导致页面无法滚动
项目业务逻辑和出现的问题整理 新增页面 用户可以主动添加输入文本框 添加多了就会导致当前页面出现滚动条,这就导致ios端滚动页面的时候去点击输入框键盘抬起再关闭的时候去滚动页面发现页面滚动不了(偶尔出现),经过多次测试发现是键盘抬起的时候 主动向上滑动 100%出现这种问…
Vue3+vite 添加router后的2个坑
废话不多说，发现问题并解决问题
第 1 个坑：关于 …/ router 报红
正常引入页面路由，页面也显示出来了，路径也是正确的，但是却报红了。 原因是：当前路径正则有问题 解决方案： 在 src 文件下 v…
uniapp搭建项目
使用Vue3/Vite版
创建以 javascript 开发的工程（如命令行创建失败，请直接访问 gitee 下载模板） npx degit dcloudio/uni-preset-vue#vite my-vue3-project复制代码 npx degit dcloudio/uni-preset-vue#vite-alpha my-vue3-project复制代码创…
uniapp+vue3+ts+uview-plus搭建项目步骤
创建项目 使用Vue3/Vite版，创建以 typescript 开发的工程 下载仓库 DCloud/uni-preset-vue - Gitee.com node版本：v16.18.0 npm版本： v8.19.2 依赖下载 解压之后，在vscode打开 通过终端运行 npm 命令下载依赖：npm ins…
uniapp 离线打包 google 登录
官方文档：
Oauth 模块 | uni小程序SDK 其中有 clientid 和反向url
clientid 是 xxxx.apps.googleusercontent.com
反向url 是 com.googleusercontent.apps.xxx
uni-app：对数组对象进行以具体某一项的分类处理
一、原始数据
这里定义为五个数组，种类product有aaa,bbb两种
原始数据在data中进行定义
res: {"success": true,"devices": [{no: 0,product: aaa,alias: "设备1",assign: [["a1", "a2", "a3"],[&q…
【uniapp】uview1.x 的 u-upload 上传点击删除隐藏 modal 提示框
uview1.x 版本的 upload 默认在图片成功上传后，再点击右上角删除按钮时会弹出提示框，如图： 但是有时又不需要，想要直接提示删除成功即可，由于官网没有给出点击删除按钮时所调用的钩子函数，又无法操作 DOM&…
uniapp +vue3 练习 首页页面展示 我的页面展示 登录展示 拨打固定的电话 页面跳转
uniapp拨打固定的电话 function Hotline() {// 拨打电话uni.makePhoneCall({phoneNumber: 19969547693})}页面跳转 //普通跳转function homepage() {uni.navigateTo({url: /pages/homepage/homepage});}//二、uni.redirectTo关闭当前页面，跳转到应用内的某个页面。…
uniapp获取微信用户信息登录
想要获取用户信息需要先使用wx.login功能 wx.login({success: res > {if (res.code) {// 获取 code 成功后，通过微信开放接口获取用户 openidwx.request({url: 后台接口,data: {code: res.code,},success: res > {console.log(res.data.openid);this.openid …
uniapp(uncloud) 使用生态开发接口详情4(wangeditor 富文本, 云对象, postman 网络请求)
wangeditor 官网: https://www.wangeditor.com/v4/pages/01-%E5%BC%80%E5%A7%8B%E4%BD%BF%E7%94%A8/01-%E5%9F%BA%E6%9C%AC%E4%BD%BF%E7%94%A8.html 这里用vue2版本,用wangeditor 4 终端命令: npm i wangeditor --save
开始使用 在项目pages > sy_news > add.vue 页面中…
uniapp-vue3-微信小程序-标签选择器wo-tag
采用uniapp-vue3实现, 是一款支持高度自定义的标签选择器组件，支持H5、微信小程序（其他小程序未测试过，可自行尝试） 可到插件市场下载尝试： https://ext.dcloud.net.cn/plugin?id14960
使用示例
<template>&…
微信小程序 uniapp+vue线上洗衣店业务管理系统演89iu2
本课题意在设计一种系统的、基于用户体验的线上洗衣服务模式，具有如下的研究意义: (1)为用户提供更简单、便捷的洗衣服务模式; (2)为智能柜的盈利模式提供了新的方向; (3)通过线上系统、智能柜与洗衣工厂结合的方式，为洗衣企业构建了一套节 省人力成本的…
uniapp开发H5及app监听返回事件（以及监听不到的处理方法）
1.使用页面事件onBackPress事件监听返回键
onBackPress(e) {//e.from backbutton 说明如果点击的是物理返回键或导航栏的返回键就进行以下操作if (e.from backbutton) {if (遮罩层是否隐藏) {//如果没隐藏//这里写让遮罩层隐藏的代码} else {//如果隐藏了//这里就写返回上一…
uni-app--》基于小程序开发的电商平台项目实战（六）
🏍️作者简介：大家好，我是亦世凡华、渴望知识储备自己的一名在校大学生 🛵个人主页：亦世凡华、 🛺系列专栏：uni-app 🚲座右铭：人生亦可燃烧，亦可腐败…
uniapp开发微信小程序，webview内嵌h5，h5打开pdf地址，解决方案
根据公司要求，让我写一个h5，后续会嵌入到合作公司的微信小程序的webview中，如果是自己公司微信小程序，可以采取先下载下来pdf，然后通过wx.openDocument，进行单纯的预览操作，这个可以根据这个老哥…
uniapp(uncloud) 使用生态开发接口详情5(云公共模块)
1.uniCloud官网 云对象中云公共模块: 网站: https://uniapp.dcloud.net.cn/uniCloud/cf-common.html
// 官网介绍
cloudfunctions├─common // 云函数公用模块目录| └─hello-common // 云函数公用模块| ├─package.json| └─index.js // 公用模块代码࿰…
【草料】uni-app ts vue 小程序 如何如何通过草料生成对应的模块化二维码
一、查看uni-app项目
1、找到路径 可以看到项目从 src-race-pages-group 这个使我们目标的查询页面 下面我们将这个路径copy到草料内 2、找到进入页面入参 一般我们都会选择 onload() 函数下的入参 这里我们参数的是 id 二、草料
建议看完这里的教程文档 十分清晰！…
uniapp自定义组件
在UniApp中，你可以使用自定义组件来拓展应用程序的功能和界面。自定义组件是由多个Vue组件构成的，可以在应用程序中重复使用。
要创建一个自定义组件，你需要在UniApp项目中的components目录下创建一个新的文件夹，并在该文件夹中创…
uniapp中地图定位功能实现的几种方案
1.uniapp自带uni.getLocation
uni.getLocation(options) getlocation | uni-app官网
实现思路：uni.getLocation获取经纬度后调用接口获取城市名
优点：方便快捷，直接调用
缺点：关闭定位后延时很久，无法控制定位延迟…
【开题报告】基于uniapp的在线蛋糕商城小程序的设计与实现
1.研究背景
随着互联网的普及和移动设备的普及，电子商务在全球范围内蓬勃发展。小程序作为一种新兴的应用形式，已经成为许多企业和个人开展电子商务的首选工具之一。在这个背景下，基于UniApp开发的在线蛋糕商城小程序也逐渐受到了广大商家和…
【uniapp】uview 自定义 tabBar 底部导航栏
在 uview1.x 中，不用在 pages.json 里配置 tabBar 属性，比如要在首页配置自定义底部导航栏，就在对应组件中： <u-tabbar v-model"current" :list"list" :before-switch"beforeSwitch" inactive-c…
uniapp h5实现Excel、Word、PDF文件在线预览，而不是跳转下载，也不需要下载
实现方案
word，微软 Office Web Viewer
const url https://view.officeapps.live.com/op/view.aspx?src${encodeURIComponent(https://501351981.github.io/vue-office/examples/dist/static/test-files/test.docx)}
window.open(url) //新建窗口打开链接预览
/…
uniapp缓存对象数组
需求：使用uniapp，模拟key（表名）增删改查对象数组，每个key可以单独操作，并模拟面对对象对应表，每个key对应的baseInstance 类似一个操作类，当然如果你场景比较简单，可以改…
uniapp App 端 版本更新检测
function checkVersion() { var req { //升级检测数据 appid: plus.runtime.appid, version: plus.runtime.version }; const timestamp Date.parse(new Date()); config.server.query_news uni.reque…
uniapp 适配部分IPhone手机底部安全距离
部分 IOS 机型，比如 Iphone X 的屏幕底部有一条“小黑线”区域，uniapp 项目中我们可以使用CSS的 env(safe-area-inset-bottom) 语句来自适配 IOS 的底部安全区域高度，这个语句会返回该机型的底部安全区域高度（单位 px）…
【uniapp】触底加载事件 onReachBottom 不生效
我遇到的情况有： 检查 css 是不是写了overflow-y: scroll; 或 overflow: auto; 是不是用了局部滚动 <scroll-view></scroll-view>；
注意： onReachBottom 和 scroll-view 是冲突的
uniapp为什么能支持多端开发?uniapp底层是怎么做的？
文章目录 前言uniapp为什么能支持多端开发？uniapp底层是怎么做条件编译uniapp的语法uniapp如何编译为不同端的代码uniapp的底层是如何做平台特性适配的呢？后言 前言 hello world欢迎来到前端的新世界 😜当前文章系列专栏：uniapp &…
uniapp开发的微信小程序进行代码质量控制，分包+压缩js+组件按需注入等
小程序代码分包的操作请看另外一篇文章：uniapp分包优化，包括分包路由跳转规则-CSDN博客
JS文件压缩：在工具「详情」-「本地设置」中开启「上传代码时自动压缩脚本文件」的设置 代码包：组件 > 启用组件按需注入解决办法
在小程…
uni-app 离线打包安卓Apk（小白上手）
场景： 在使用uni-app 开发apk时，使用云打包有次数限制。尤其对于测试阶段是无比难受的，通常是浪费打包次数进行打包或者通过usb 给测试机更新开发环境，但这都是无比漫长的过程 尤其有多个测试机真的是噩梦般的存在 下载离线打包示…
H5 uniapp 接入wx sdk
uniapp因为要兼容小程序等，会重写wx对象，导致引入的jweixin-1.6.0.js中对象不生效。
综合网络资料，有两种解决方案：
一，通过npm工具引入
npm install jweixin-module --save 实际上是借用了wx的另一个对象jWeixin
…
uniapp 打包小程序体积优化思路、优先排查优化项参考
uni_modules 也采用分包
虽然 uniapp 官方说了 uni_modules 会根据使用用到而决定是否要打包过滤，但分包前后还是有区别的，所以我估计此前是理解错了虽然会过滤没用到的，但用到了的也会打包到主包里去，就导致了主包偏大无法上传的…
uni-app+vue3 封装全局函数（详细完整的方法）
在uni-app和vue3中，我们可以封装全局函数来复用代码。以下是详细的步骤：
首先，我们需要在main.js文件中引入我们封装的全局函数。这样我们就可以在整个项目中使用这些函数。 import globalFunctions from ./globalFunctionsVue.prototype.$g…
uni-app 微信小程序 pdf预览
<div click"getPDF">查看体检报告</div>getPDF() {uni.downloadFile({url: ${this.$baseURL}/file/download?id${this.pdfFileId},//编写在线的pdf地址success: function(res) {const filePath res.tempFilePath;uni.openDocument({filePath: filePath…
uniapp 监测不到 ios 设备
引言
UniApp 是一款跨平台的应用开发框架，它能够让开发者使用一套代码开发出同时在 iOS 和 Android 上运行的应用程序。然而，有时候我们可能会遇到一个问题：UniApp 无法正确地检测到 iOS 设备。本文将介绍这个问题的原因，并提供一种解决方案。
问题描述
当我们使用 UniA…
uniapp-视频video播放兼容问题-圆角实现
1.实现支付宝小程序-视频圆角，使用border-radius无法实现 真机测试无效
只能使用css在四个角覆盖上去了 <div class"tips"><videoid"myVideo"objectFit"cover"style"width: 100%"autoplay:show-fullscreen-btn&q…
uniapp引入插件市场echarts图表（l-echart）实现小程序端图表，并修改源码简化使用
使用的uniapp插件:l-echart
https://ext.dcloud.net.cn/plugin?id4899
注意事项
1.因为小程序有主包分包大小限制，并且uni_modules中的包也会算在主包体积中，而我项目中的图表是在分包中使用的，所以我移动uni_modules中的l-echart图表组件…
Vue H5项目，怎么引入uni.webview sdk，调用uni postMessage实现手机蓝牙连接打印功能（uniapp）
前言 目前公司Vue H5项目，用webview打包成APP，现产品提出这样打包出来的app运行较慢，需要用uniapp方式（即使用HBuilder编辑器来打包H5）来打包，那需要的基座就不是安卓的基座而是uniapp的基座，而…
uniCloud（二） 使用数据库、前端展示数据
一、在云服务空间的云数据库中新建一张表
（1）它有两种方式，我暂时手动创建一张表 （2）修改表结构：权限read为true （3）添加数据记录
注意：需要一条一条的加入
flutter 代码混淆
Flutter 应用混淆：Flutter 应用的混淆非常简单，只需要在构建 release 版应用时结合使用 --obfuscate 和 --split-debug-info 这两个参数即可。–obfuscate --split-debug-info 用来指定输出调试文件的位置，该命令会生成一个符号映射表。目前支…
uniapp H5项目使用ucharts的Echart组件方式创建圆环
问题：没有报错但是图表不出来
【 调试了半天圆环图表没有不出来。是因为没有明示设置宽度与高度】 /* 请根据实际需求修改父元素尺寸，组件自动识别宽高 */ .charts-box { width: 100%; height: 300px; } 最终效果 先导入ucharts到项目
uniapp的项目…
nodejs express uniapp 图书借阅管理系统源码
开发环境及工具：
nodejs，mysql5.7，HBuilder X，vscode（webstorm）
技术说明：
nodejs express vue elementui uniapp
功能介绍：
用户端：
登录注册
首页显示轮播图&am…
uniapp uview1.0 页面多个upload上传、回显之后处理数据
<view class"img-title w-s-color-3 f-28 row">商品图片</view><u-upload ref"images" :header"header" :file-list"fileListImages" :action"action" name"iFile" icon-name"camera"u…
uniapp中使用封装步骤条组件
针对步骤条封装完终于清清楚楚啦
先看效果： 附上代码：使用可直接复用：数据是写在了当前组件中，如有必须，可以使用其中的props传值stepInfos传递相应的数据，根据steps步数就可以控制走到哪一步啦
<temp…
使用uniapp和uniclould开发支付宝小程序：提示Error: 权限校验未通过，未能获取当前用户信息的解决办法
uniclould提示：获取新闻失败： Error: 权限校验未通过，未能获取当前用户信息，当前用户为匿名身份，请参考文档：https://uniapp.dcloud.net.cn/uniCloud/schema.html#handler-permission-error at VM75 index.…
uniapp+高德地图开发APP自定义marker弹出框教程
需求背景
uniappnvue高德地图开发APP，不是小程序，效果图如下，该效果图是教程二实现的。
-----------------------自定义marker请直接看教程二
-----------------------自定义marker请直接看教程二
-----------------------自定义marker请…
uniapp公共css
/* 弹性布局 */
.flex{display: flex;
}
.a-c{align-items: center;
}
.a-s{align-items: flex-start;
}
.a-e{align-items: flex-end;
}
.j-c{justify-content: center;
}
.j-sb{justify-content: space-between;
}
.j-s{justify-content: flex-start;
}
.j-e{justify-content…
uni-app uni.scss内置全局样式变量
锋哥原创的uni-app视频教程：
2023版uniapp从入门到上天视频教程(Java后端无废话版)，火爆更新中..._哔哩哔哩_bilibili2023版uniapp从入门到上天视频教程(Java后端无废话版)，火爆更新中...共计23条视频，包括：第1讲 uni…
在 uniapp 里面使用 unocss
1. 安装插件
npm i unocss unocss/transformer-directives unocss-preset-weapp -D 这个里面加了个指令的使用, 可以根据自身需求来决定是否使用
2. uno.config.ts 配置。
按照这个配置基本可以解决你的问题。
import presetWeapp from unocss-preset-weapp
import { extra…
怎么在uni-app中使用Vuex 简单demo，通俗易懂(第二篇)
Vuex是Vue.js的官方状态管理库，可以帮助我们更好地管理和维护复杂状态和数据共享。在Vuex中，整个应用的状态被集中到一个单一的状态树中，这个状态树包含了所有的共享状态和数据。通过状态管理模块、getter、mutation、action等机制࿰…
vue3+pinia存储对象赋值踩坑
vue3pinia存储对象赋值踩坑
自我记录 前文描述:大概就是我在本地存储里面的对象obj1 里面的属性名 和我页面赋值 obj的属性名一致,我就直接赋值了,而没有一一对应去赋值,此时出现一个bug,就是因为我obj的对象是v-model双向数据绑定的input值,当我第一次改完触发保存存储时,下次…
uniapp+echarts开发APP版本教程
需求
需要在uniappecharts展示图表功能，是APP版本，不是小程序。找了好多教程都乱七八糟的，无法实现。以下是效果图 教程
1、安装插件
HBuilder安装echarts插件，插件地址如下。安装完成后在uni_modules/lime-echart文件夹下
ht…
uniapp中组件库的Checkbox 复选框 的丰富使用方法
目录
#平台差异说明
#基本使用
#自定义形状
#禁用checkbox
#自定义形状
#自定义颜色
#横向排列形式
#横向两端排列形式
API
#Checkbox Props
#CheckboxGroup Props
#CheckboxGroup Event 复选框组件一般用于需要多个选择的场景，该组件功能完整ÿ…
uni-app的优缺点?
Uni-App是一个跨平台的开发框架，它使用Vue.js作为主要的开发框架，可以同时开发iOS、Android和Web应用程序。下面是Uni-App的优缺点：
优点 总的来说，Uni-App是一个很不错的跨平台开发框架，它可以大大提高开发效率和节省…
uniapp实现文字超出宽度自动滚动（在宽度范围之内不滚动、是否自动滚动、点击滚动暂停）
效果如下： 文字滚动 组件代码：
<template><view class="tip" id="tip" @tap.stop="clickMove"><view class=
uniapp向上拉加载，下拉刷新
目录 大佬1大佬2 大佬1
大佬地址：https://blog.csdn.net/wendy_qx/article/details/135077822
大佬2
大佬2：https://blog.csdn.net/chen__hui/article/details/122497140
vscode中uniapp项目无法编译生成dist 也不报错的解决办法
就在昨天，我修改项目的代码UI部分后，执行「npm run dev:mp-weixin 」这个指令，开发工具中的页面没有任何变化，然后终端的输出如下图： 毫无提示，当下就觉得不对劲，果然在微信开发工具里面看到编译…
uni-app中vue3+setup实现下拉刷新、上拉加载更多效果
在小程序或各类app中，下拉刷新和上拉加载更多是极为常见和使用非常频繁的两个功能，通过对这两个功能的合理使用可以极大的方便用户进行操作。
合理的设计逻辑才能更容易挽留住用户，因为这些细节性的小功能点就变得极为重要起来。
那么在uni…
uniapp uni.navigateBack返回后刷新页面数据
方法1: 父页面设置钩子函数(onBackPress):
页面简介 | uni-app官网
适用于刷新多处数据
onBackPress(options) {this.refreshData();
},
methods:{refreshData: function() {//加载数据},
}, 方法2:
返回加success回调
uni.navigateBack({delta: 1, //返回层数࿰…
案例027:基于微信小程序的校园二手平台的设计与实现
文末获取源码 开发语言：Java 框架：SSM JDK版本：JDK1.8 数据库：mysql 5.7 开发软件：eclipse/myeclipse/idea Maven包：Maven3.5.4 小程序框架：uniapp 小程序开发软件：HBuilder X 小程序…
圈子社交系统：打破时间与空间的限制。APP小程序H5三端源码交付，支持二开！
在现代社会，社交已成为人们生活中不可或缺的一部分。然而，传统的社交方式往往受制于时间和空间的限制，使得人们难以充分发挥社交的潜力。为了解决这一问题，圈子社交系统应运而生。 圈子社交系统通过技术手段打破时间与空间的限制&…
vue3的Uniapp用renderjs 进行视频切图操作
首先，在项目中安装 RenderJS
npm install renderjs在 Vue3 的 UniApp 中引入 RenderJS：
import RenderJS from renderjs;创建一个 RenderJS 实例，并将其绑定到一个视频元素上
<template><view><video ref"video"…
uniapp存储讲解
在 Uni-app 中，你可以使用本地缓存来存储应用程序的数据。Uni-app 提供了两种本地缓存方式：uni.setStorageSync 和 uni.setStorage。其中，uni.setStorageSync 同步方式存储数据，适合小数据量的存储；而 uni.setStorage …
校园圈子交友系统，APP小程序H5，三端源码交付，支持二开！实名认证，大V认证，地图找伴，二手平台！
校园圈子交友系统，是属于自主定义开发的系统，内容有很多，先截取一些给大家看看，让大家更多的了解本系统，然后再做评价！ 校园后端下载地址：校园圈子系统小程序，校园拼车，校…
uniapp获取定位
Uniapp 是一种跨平台应用开发框架，它能够快速地构建出针对不同平台的应用程序。在Uniapp中，实现定位功能也变得十分简单，只需要简单的配置就能轻松实现。
一、高德地图根据指定位置获取经纬度 参考地址：地理/逆地理编码-基础 API…
uniapp 微信小程序跳转至其他小程序
一、背景：
需要在目前的小程序中跳转到另一个小程序，跳转的目标小程序需要已经发布上线了
二、具体实现
使用uni.navigateToMiniProgram打开另一个小程序
官网指引👉：uni.navigateToMiniProgram(OBJECT) | uni-app官网
<t…
uni-app condition启动模式配置
锋哥原创的uni-app视频教程：
2023版uniapp从入门到上天视频教程(Java后端无废话版)，火爆更新中..._哔哩哔哩_bilibili2023版uniapp从入门到上天视频教程(Java后端无废话版)，火爆更新中...共计23条视频，包括：第1讲 uni…
uni-app js语法
锋哥原创的uni-app视频教程：
2023版uniapp从入门到上天视频教程(Java后端无废话版)，火爆更新中..._哔哩哔哩_bilibili2023版uniapp从入门到上天视频教程(Java后端无废话版)，火爆更新中...共计23条视频，包括：第1讲 uni…
vue,小程序,uni-app的生命周期?
Vue、小程序和Uni-App都有各自的生命周期，下面是它们的生命周期介绍：
Vue 的生命周期
Vue 的生命周期分为创建、挂载、更新和销毁四个阶段，具体的生命周期函数如下： beforeCreate：实例刚在内存中被创建出来ÿ…
uniapp 在ios中u-input password显示密码 不生效
u-input组件的password属性在uniapp上多端开发,在小程序,H5上都没有问题,在App端有效，就是在ios中无效
找到u-input文件 修改源码 将原本的:password"password || type password || undefined加上||false即可
【uniapp】新课uniapp零基础入门到项目打包（微信小程序/H5/vue/安卓apk）全掌握
一、uniapp和HBuilderX介绍
uni-app官方网站：https://uniapp.dcloud.net.cn/
为什么要学习uniapp？
1、一套代码可以打包到不同的应用平台；一套代码编到十几个平台，这不是梦想。眼见为实，扫描以下二维码，…
解决uni-app小程序获取路由及路由参数
代码： this.id = this.$route.query.id;错误信息： 解决方案： // 获取query对象// #ifdef H5this.id = this.$route
uniapp中的uview组件库丰富的Form 表单用法
目录 基本使用
#Form-item组件说明
#验证规则
#验证规则属性
#uView自带验证规则
#综合实战
#校验错误提示方式
#校验 基本使用
此组件一般是用于表单验证使用，每一个表单域由一个u-form-item组成，表单域中可以放置u-input、u-checkbox、u-radio…
微信开发者工具如何使用
首先是下载微信开发者工具
链接: https://pan.baidu.com/s/1ri-fRCUQsz9vLxbTqtdPUQ 提取码: 8rhn 复制这段内容后打开百度网盘手机App，操作更方便哦
安装完打开就是以下界面 接下来进入正题
第一步新建或导入 新建 获取AppID
第一步：通过微信公众平…
uniapp：全局消息是推送，实现app在线更新，WebSocket，apk上传
全局消息是推送，实现app在线更新，WebSocket 1.在main.js中定义全局的WebSocket2.java后端建立和发送WebSocket3.通知所有用户更新 背景： 开发人员开发后app后打包成.apk文件，上传后通知厂区在线用户更新app。 那么没在线的怎么办&…
uniApp解决ios app真机底部安全区域（空白）问题
首先我们要打开项目中的manifest.json文件，找到开源码视图配置，添加和修改： "app-plus" : {"safearea" : {//安全区域配置，仅iOS平台生效 "bottom" : {// 底部安全区域配置 "offset" :…
uniapp api uni.request讲解
uni.request是Uniapp中用于发起网络请求的API。它类似于原生JavaScript中的XMLHttpRequest和浏览器提供的fetch函数。
使用uni.request可以发送HTTP请求，并获取响应数据。下面是uni.request的基本用法： uni.request({url: http://api.example.com/data,…
uniapp使用安装sass
1.首先你要安装node-sass npm install node-sass --save-dev2.安装sass-loader npm install sass-loader --save-dev3.修改style标签，声明使用sass <style lang"scss" scoped>
uniapp返回上一页并刷新数据
在uniapp中，返回页面时onLoad是不会触发的
如果只需要在特定情况下返回上一页才需要刷新数据
可以使用$emit和$no去解决
例如：注册完成后返回到首页并隐藏注册按钮，register.vue和index.vue
register.vue
<template><view clic…
uniapp地图兼容小程序和APP（高德地图），点击marker并弹框详情
1.uniapp地图页面兼容小程序和APP 2.小程序使用map组件APP使用高德地图 3.点击定位按钮地图自动移动到定位点 4.APP地图逻辑是视图层交互使用renderjs 5.点击地图marker弹框详情 6.全部代码
<template><page-meta :page-style"overflow:(show?hidden:visible)&…
uni-app如何生成骨架屏
骨架屏是页面的一个空白版本，通常会在页面完全渲染之前，通过一些灰色的区块大致勾勒出轮廓，待数据加载完成后，再替换成真实的内容。
参考效果
骨架屏作用是缓解用户等待时的焦虑情绪，属于用户体验优化方案。 生成骨…
uni-app发版及分包要求
uni-app发版及分包要求
发版
注意，小程序的接口不允许http，只支持https。仅仅是https还不够，正式版和体验版上的接口功能实现还需要将接口地址添加到开发管理——开发设置——服务器域名——request合法域名中去。否则，手机预览…
基于uniapp封装的card容器 带左右侧两侧标题内容区域
代码
<template><view class"card"><div class"x_flex_header"><div><title v-if"title ! " class"title" :title"title" :num"num"></title></div><div><s…
![[uniapp] uniapp上传手机pdf文件](https://img-blog.csdnimg.cn/direct/9d7ad3da5d094ef4986c6924d68b74f7.png)
[uniapp] uniapp上传手机pdf文件
从微信小程序上传文件
上传文件
使用uni-file-picker组件上传代码
<uni-file-pickerref"files":auto-upload"false"limit"9"file-mediatype"all"select"select"
><view>文件上传</view>
</uni-file…
uni-app的学习【第二节】
四 路由配置及页面跳转
（1）路由配置 uni-app页面路由全部交给框架统一管理，需要在pages.json里配置每个路由页面的路径以及页面样式（类似小程序在app.json中配置页面路由） （2）路由跳转 uni-app有两种页面路由跳转方式：使用navigator组件跳转（标签式导航）、调用API跳…
uniapp引入第三方字体库如（宋体、喜鹊燕书体、字小魂歌以晓手迹行楷体等) 最优解决方案
最近在开发一个写对联的小程序，其中要求对联文字以不同字体呈现，比如（宋体、喜鹊燕书体、字小魂歌以晓手迹行楷体等），如图： 一般UI设计给的都是这种.tff格式的字体文件，如图： 那么…
uniapp如何分包加载
在uni-app中，可以通过配置manifest.json文件来实现分包加载。以下是具体操作步骤：
在项目根目录下找到并打开manifest.json文件。在"uni-app"节点中，找到并修改"subPackages"节点，添加需要分包的页面路径。 …
uniapp中uview组件库的NoticeBar 滚动通知 使用方法
目录
#平台差异说明
#基本使用
#配置主题
#配置图标
#配置滚动速度
#控制滚动的开始和暂停
#事件回调
#API
#Props
#Events 该组件用于滚动通告场景，有多种模式可供选择
#平台差异说明
AppH5微信小程序支付宝小程序百度小程序头条小程序QQ小程序√√√√…
uni-app小程序 uni.showToast字数超过两行自动省略显示不全问题
在实际开发过程中如果用户提交某些文件时，如果缺少某些条件我们要提醒用户缺少那些条件才能提交，但是如果我们用uni.showToast提醒的次数超过7个字的时候就会导致文字显示不全，达不到提醒的效果，这种时候我们就需要使用uni.showMo…
使用CSS计算高度铺满屏幕
前言
今天写项目时出现高度设置百分百却不占满屏幕，第一反应看自己设置的是块级元素还是行级元素。看了几篇博客，发现并不能解决问题。脱离文档流的做法都没考虑，前期模板搭建脱离文档流，后面开发会出现很多问题。 以上图片是我…
uniapp列表实现方式 v-for
创建列表视图 v-for
v-for“对象item in 数组” v-for“(对象item，下标) in 数组” v-for“(对象item，使用这个键取到的值，下标) in 数组” :key 绑定标识 一般建议使用对象中的id等值 类型 any
<template><view><view clas…
uniapp 引入 uview 以及各文件夹用途 (1)
现在uniapp教程太多了 就不从头开始讲了 这里推荐一篇质量高些的大佬 大家可以从零参考他
uniapp从入门到精通
然后我只是简单记录一下我当时学习uniapp的一些问题和经验(单纯没什么可写了,混时长)
这里是 uview的官网 uView 2.0
第一步:(先进入uview插件市场)uView2.0重磅…
如何处理Uniapp中的异步请求？
在Uniapp中处理异步请求有以下几种方法：
使用 uni.request 方法发送异步请求，该方法返回一个 Promise 对象，可以使用 then 方法处理请求成功的回调，使用 catch 方法处理请求失败的回调。
uni.request({url: http://api.example.…
记录一下uniapp 集成腾讯im特别卡(已解决)
uniapp的项目运行在微信小程序 , 安卓 , ios手机三端 ,
之前这个项目集成过im,不过版本太老了,0.x的版本, 现在需要添加客服功能,所以就升级了
由于是二开 , 也为了方便 , 沿用之前的webview嵌套腾讯IM的方案 , 选用uniapp集成ui ,升级之后所有安卓用户反馈点击进去特别卡,几…
快快销ShopMatrix 分销商城多端uniapp可编译5端 - 升级申请（可自定义申请表单）
在企业或组织中，升级申请通常涉及到员工职位、权限、设备或者其他资源的提升或更新。创建一个可自定义的升级申请表单可以帮助更高效地收集和处理这类申请信息。以下是一个基本的步骤： 确定表单字段： 申请人信息：姓名、部门、职位…
uniapp 打包成 apk（原生APP-云打包）免费
修改APP配置 根据需求，修改 manifest.json 配置，常见的修改有：
应用名称，应用版本名称，应用版本号 升级版本时，应用版本名称和应用版本号必须高于上一版的值
应用图标
点浏览选择png格式的图片后&#x…
uniapp中uview组件库丰富的CountDown 倒计时使用方法
目录
#平台差异说明
#基本使用
#设置是否显示天，时，分，秒
#倒计时分隔符
#倒计时样式
#倒计时执行的时机
#如何获取当前倒计的秒数
#API
#Props
#Events
#Methods 该组件一般使用于某个活动的截止时间上，通过数字的变化…
#Uniapp：map地图组件
示例
<map class"map" :latitude"mapOptions.latitude" :longitude"mapOptions.longitude" :scale"mapOptions.scale"
:markers"mapOptions.markers"></map>mapOptions: {longitude: 108.95, // 中心经度latit…
uniapp怎么开发插件并发布
今天耳机坏了,暂时内卷不了,所以想开发几个插件玩玩,也好久没写博客了,就拿这个来写了
首先,发布插件时需要你有项目
这里先拿uniapp创建一个项目, 如下,创建好的项目长这样 然后根据uniapp官网上说的,我们发布插件时,需要在uni_modules里面编写和发布
ps:还需要使用uniapp…
uniapp + node.js 开发问卷调查小程序
前后端效果图 后端：nodejs 12.8 ; mongoDB 4.0 前端：uniapp 开发工具：HBuilderX 3.99
前端首页代码 index.vue
<!-- 源码下载地址 https://pan.baidu.com/s/1AVB71AjEX06wpc4wbcV_tQ?pwdl9zp --><template><view class&q…
uniapp中，子组件给父页面传值（父组件）
前言
最近在做的一个小程序项目中，有一个身份切换的功能，点击切换按钮时，子组件向父组件传递身份信息，父页面依据这个身份信息对页面进行显示与隐藏。
具体实现
子组件中定义一个点击事件,在这里是identitySwitching()方法
&l…
uniapp的nvue是什么
什么是nvue
uni-app App 端内置了一个基于 weex 改进的原生渲染引擎，提供了原生渲染能力。
在 App 端，如果使用 vue 页面，则使用 webview 渲染；如果使用 nvue 页面(native vue 的缩写)，则使用原生渲染。一个 App 中可…
uniapp 实现tabBar-switchTab之间的传参
一、需求：
tabbar之间跳转页面时，需要传递一个参数。 官方文档明确说明: 跳转tabBar栏的页面只能使用 uni.switchTab 并且url 路径后面不能传递参数。 二、解决方法：
方法1：setStorageSync(本地缓存)
//index.vue 页
onclick …
uniapp智能工具助手（附送250套精选微信小程序源码）
前言
现在的微信小程序非常火爆，网上也有很多学习资源，但是源码资源还是很少的。其实在学习开发微信小程序的时候如果有源码可以供我们借鉴，学习效率也会成倍的增加。 搭建或者想要基于某个小程序框架做二次开发 这里已收集整理好, 类目涵盖…
uni-app 如何返回到指定的页面
实际开发中，发现了一个问题，即使签署合同的时候，发现调用法大大的页面，出现了一个问题，就是签署后，点回退，回退到了重新签署的页面。所以需要对回退进行自定义处理。 处理的话，就要到…
uniapp水文【uniapp】
文章目录 1、前言2、历史3、发展4、功能5、优缺点6、总结7、附录7.1、高频使用7.2、使用注意 1、前言
Uniapp是一种跨平台的移动应用开发框架，它允许开发者使用一套代码库，同时生成iOS、Android等多个平台的应用程序。这种技术方案可以大大降低开发成本…
uniapp中根据不同状态跳转不同页面
大纲： 今天我们讲 在uniapp中，如何根据不同的状态跳转到不同的页面。
以下代码，是Tabs标签的展示 🌿 :list"list" 是参数配置，该参数要求为数组，元素为对象，且对象要有name属性&…
【uni-app】使用外部组件不显示报错组件未找到解决方案
文章目录 前言一、问题描述二、温馨提示总结 前言
大家好，今天和大家分享一下uni-app使用外部组件不显示报错的一个解决方案，希望能够帮助到大家。
一、问题描述
我在使用uni-app在开发项目时引入了一个外部的组件库，刚开始引入的时候还是…
uniapp主题切换功能的第二种实现方式（scss变量+require）
在上一篇 “uniapp主题切换功能的第一种实现方式（scss变量vuex）” 中介绍了第一种如何切换主题，但我们总结出一些不好的地方，例如扩展性不强，维护起来也困难等等，那么接下我再给大家介绍另外一种切换主题的…
uniapp微信小程序投票系统实战 (SpringBoot2+vue3.2+element plus ) -关于我们页面实现
锋哥原创的uniapp微信小程序投票系统实战：
uniapp微信小程序投票系统实战课程 (SpringBoot2vue3.2element plus ) ( 火爆连载更新中... )_哔哩哔哩_bilibiliuniapp微信小程序投票系统实战课程 (SpringBoot2vue3.2element plus ) ( 火爆连载更新中... )共计21条视频…
分销商城多端uniapp 可编译5端 - 等级提现额度
等级提现额度 等级提现额度是一种常见的财务管理策略，通常用于在线平台、金融服务或游戏中，用于控制不同等级用户的提现限额。这样的机制有助于平台管理资金流动性，防范欺诈，并鼓励用户提升他们的活跃度或忠诚度。以下是一个简单的…
uniapp 简易自定义日历
注：此日历是根据接口返回的日期自动对应星期的，返回的数据中也包含星期，其实就是一个div自定义，可根据自己需求更改； 1、组件代码 gy-calendar-self.vue <template><view class"calendar"><…
uniapp 中使用 rem 以及改变窗口动态刷新页面
注意：页面元素需要全部使用 rem 作为单位。
1.使用 uniapp 中的页面属性配置节点，page-meta，注意放在根元素的位置，也就是 template下面的第一层
<template><page-meta :root-font-size"fontsizepx" user-sc…
#Uniapp: onReachBottom页面触底的事件回调
onReachBottom页面触底的事件回调
定义
页面上拉触底事件触发时距页面底部距离，单位只支持px，详见页面生命周期
可在pages.json里定义具体页面底部的触发距离onReachBottomDistance，
"pages": [ //pages数组中第一项表示应用启…
uniapp微信小程序投票系统实战 (SpringBoot2+vue3.2+element plus ) -投票帖子排行实现
锋哥原创的uniapp微信小程序投票系统实战：
uniapp微信小程序投票系统实战课程 (SpringBoot2vue3.2element plus ) ( 火爆连载更新中... )_哔哩哔哩_bilibiliuniapp微信小程序投票系统实战课程 (SpringBoot2vue3.2element plus ) ( 火爆连载更新中... )共计21条视频…
真机调试，微信小程序，uniapp项目在微信开发者工具中真机调试，手机和电脑要连同一个wifi，先清空缓存，页面从登录页进入，再点真机调试，这样就不会报错了
微信小程序如何本地进行真机调试？_unity生成的微信小程序怎么在电脑上真机测试-CSDN博客
微信小程序 真机调试
注意事项
uniapp项目在微信开发者工具中真机调试，手机和电脑要连同一个wifi，先清空缓存，页面从登录页进入…
uniapp本地存储日志
uniapp本地存储日志 背景实现代码实现使用查看生成log读取 注意事项尾巴 背景
我们的APP开发完成之后，在我们测试环境或者自测的时候都好好的，但是发布到生产环境客户使用总会出现一些奇奇怪怪的问题。这时候因为没在开发环境，我们无法查看到…
2024最新婚恋交友系统，PHP书写，前端UNI，前后端源码交付，支持二开，APP小程序H5，三端都有！
如何开发婚恋交友的软件
1、实名认证：每个申请注册用户必须提交真实可信的个人身份信息内容，并且必须通过平台的核查，然后才能正常使用。
2、用户量大：该平台汇聚了来自全国各地的未婚男女。用户可以线上发送私人信息࿰…
uni-app在hbuilderx打开微信开发工具运行
一、运行设置配置微信开发者工具路径
运行-运行到小程序模拟器-运行设置 配置微信开发工具的安装路径（可浏览文件位置选择）；web服务器端口号在第二步骤获得；
二、打开微信开发者工具设置-安全设置 打开服务端口开关࿰…
Uni-app 如何上传文件， 使用的API是什么
在uni-app中上传文件的方法有很多，其中一种常用的方法是使用wx.uploadFile() API。该API可以上传本地文件或网络文件，并支持设置请求头、请求参数等选项。
一.引入API
import { uploadFile } from /util/request.js;二.使用API 上传文件
uploadFile({…
uniapp 使用canvas 画海报，有手粘贴即可用
html部分
<view click"doposter">下载海报</view>
<canvas canvas-id"myCanvas" type2d style"width: 370px; height: 550px;opcity:0;position: fixed;z-index:-1;" id"myCanvas" />js 部分 drawBackground() {c…
Uniapp多选Popup（弹出层）
uniapp中多选组件很少，故个人简单开发了一个，可简单使用，也可根据个人需求稍微改进 支持的功能
单选多选（默认）限制选择数量默认选中禁用选项
属性说明
属性默认值说明singlefalsetrue为开启单选，否则为…
uniapp基于Android的环境保护环保商城系统生活垃圾分类 小程序_rsj68
本环境保护生活App是为了提高用户查阅信息的效率和管理人员管理信息的工作效率，可以快速存储大量数据，还有信息检索功能，这大大的满足了用户和管理员这两者的需求。操作简单易懂，合理分析各个模块的功能，尽可能优化界面…
uni-app 经验分享，从入门到离职（年度实战总结：经验篇）——上传图片以及小程序隐私保护指引设置
文章目录 🔥年度征文📋前言⏬关于专栏 🎯关于上传图片需求🎯前置知识点和示例代码🧩uni.chooseImage()🧩uni.chooseMedia()📌uni.chooseImage() 与 uni.chooseMedia() 🧩uni.chooseF…
uniapp开发过程一些小坑
问题1、uniapp使用scroll-view的:scroll-into-view“lastChatData“跳到某个元素id时候，在app上不生效，小程序没问题
使用this.$nextTick或者
setTimeout(()>{that.lastChatData 元素id
},500)
进行延后处理就可以了。
问题2：uniapp开…
(十五)、从插件市场引入问题反馈页面【uniapp+uinicloud多用户社区博客实战项目(完整开发文档-从零到完整项目)】
1，插件市场问题反馈页面
插件市场链接 dloud插件插件市场中找到问题反馈插件： 首先确保登录了dcloud账号。
使用hbuilderX导入插件到自己项目中。 选择合并导入。 从插件市场导入意见反馈页面的路径地址如下：
2，点击跳转到…
uniapp中uview组件库TopTips 顶部提示使用方法
目录
#平台差异说明
#基本使用
#自定义导航栏使用本组件的问题
#主题设置
#显示时间设置
#API
#Methods
#Props 该组件一般用于页面顶部向下滑出一个提示，尔后自动收起的场景。
#平台差异说明
AppH5微信小程序支付宝小程序百度小程序头条小程序QQ小程序√…
精品基于Uniapp+springboot智慧校园管理系统App课程选课成绩
《[含文档PPT源码等]精品基于Uniappspringboot智慧校园管理系统App》该项目含有源码、文档、PPT、配套开发软件、软件安装教程、项目发布教程、包运行成功！
软件开发环境及开发工具：
开发语言：Java
后台框架：springboot、ssm
…
微信小程序vue+uniapp瑜伽馆课程预约选课管理系统
本文对该站点以及对其进行了全面的剖析，为瑜伽馆管理系统的发展带来了借鉴。瑜伽馆管理系统小程序对于瑜伽馆起到了很好的引导作用，特别是对于地方瑜伽馆的处理起到了很大的作用。 按照已有的功能，除了管理员外，还可以对系统中的全…
vue-cli 构建uniapp项目 对比 HBuilderX，哪个好？
两种构建 uniapp 项目的方式各有优缺点，您可以根据自己的需求选择适合自己的方法。
vue-cli 构建 uniapp 项目：
优点： vue-cli 是一个强大的工具，可以快速构建出各种类型的项目，配置灵活，便于维护和管理。…
基于springboot vue uniapp校园论坛源码
开发环境及工具：
大等于jdk1.8，大于mysql5.5，idea（eclipse），vscode（webstorm），HBuilder
技术说明：
springboot mybatis vue elementui uniapp
代码注释齐…
uni-app【网络通信API】
uni-app 网络通信API发起请求uni.request(OBJECT)uni.configMTLS(OBJECT)上传、下载uni.uploadFile(OBJECT)uni.downloadFile(OBJECT)WebSocketuni.connectSocket(OBJECT)uni.onSocketOpen(CALLBACK)uni.onSocketError(CALLBACK)uni.sendSocketMessage(OBJECT)uni.onSocketMess…
阿里巴巴矢量图标库在uni-app中的使用方法
开发工具为：HBuilderX
步骤1:
先将喜欢的字体图标加入购物车中 点击购物车然后点击添加至项目 有就选择没有就新建 步骤2:
1.将项目文件下载至本地 2.打开下载到本地的项目文件，将箭头所指的四个文件放入项目的static目录下(可以新建个文件夹放入&…
uniapp中软键盘弹起导致页面或元素挤压解决
需求：登录页面，全屏底背景，有表单输入框问题：键盘弹起后，底背景上推，表单输入框跟着上推
解决： 表单上推解决方案： page.json 配置
{"path" : "pages/login/login&…
UniAPP社区论坛项目实战--社区服务 API 接口文档
社区服务 API 接口文档 社区服务 API 接口文档基础相关信息一、广告管理1.1 查询所有广告位1.2 获取一个广告位的广告列表1.3 批量获取广告列表 二、动态管理2.1 批量获取动态列表信息2.2 获取指定 ID 动态详情2.3 创建一条动态2.4 点赞、取消点赞、点赞列表 当前动态2.5 评论指…
uniapp App端 解决input@input事件动态修改值不生效的问题
解决方法
1.延迟修改，利用setTimeout
2.异步修改，利用this.$nextTick
<template><view><input v-modal"num" type"number" placeholder"请输入" :maxlength"3" input"onInputOne" …
uni-app组件概述
1、组件
1.1、组件的含义 组件是视图层的基本组成单元。 组件是一个单独且可复用的功能模块的封装。
组件，包括：以组件名称为标记的开始标签和结束标签、组件内容、组件属性、组件属性值。 <component-name>是开始标签，</compon…
uniapp echarts x轴 支持html标签
在 UniApp 中使用 ECharts，也可以通过自定义渲染函数来支持在 x 轴标签中使用 HTML 标签。以下是一个示例代码，展示如何在 UniApp 中使用 ECharts 并支持 x 轴标签中的 HTML 标签：
在 template 中引入 ECharts 组件，并为其设置一…
uniapp技术积累
2024.01.19
1.textarea
（1）默认文字样式设置 placeholder-style"color:rgba(0,0,0,0.7)" 2024.01.18
1.hbuilderx运行uniapp到ipad（复用率低）
（1）电脑端：首先会有一个运行工具包&…
关于uni-app与vue路由配置的不同，不使用uni.navigateTo接口跳转时，使用this.$router.push的踩坑经验
目录
懵逼的一个小时
uni-app与vue路由配置的不同
非官方接口的另类写法
错误编写：
正确编写（只需写父组件即可，其他是多余）： 懵逼的一个小时 之前用vue写router路由的时候，先配置一个路由表&am…
让uniapp小程序支持多色图标icon：iconfont-tools-cli
前景：
uniapp开发小程序项目时，对于iconfont多色图标无法直接支持；若将多色icon下载引入项目则必须关注包体，若将图标放在oss或者哪里管理，加载又是一个问题，因此大多采用iconfont-tools工具，但…
uniapp组件库Popup 弹出层 的使用方法
目录
#平台差异说明
#基本使用
#设置弹出层的方向
#设置弹出层的圆角
#控制弹窗的宽度 | 高度
#内容局部滚动
#API
#Props
#Event 弹出层容器，用于展示弹窗、信息提示等内容，支持上、下、左、右和中部弹出。组件只提供容器，内部内容…
uniapp+vue开发微信小程序，image标签图片IOS可以正常回显，安卓回显不出
仅代表个人遇到的问题，仅代表个人遇到的问题，仅代表个人遇到的问题， 1.先说最快的解决方案，直接在src下面额外添加一段url，https://images.weserv.nl/?url， <imagestyle"width: 180rpx; height: 2…
uniapp cli创建项目 vite 动态加载图片
以 / 开头就可以了, 因为 uni 在 cli 中将 / 指向了 /src。
示例 :
"/static/img/home/icon1.png"所有端都可以加载成功，解决方式就是这么的朴实无华。
uniapp app端拉起高德网页地图
以下是demo // 跳转至网页版高德地图toScottMap(longitude, latitude, name) {// 高德网页版地址let url https://uri.amap.com/marker?position${longitude},${latitude}&name${name}&srcmypage&coordinategaode&callnative1// #ifdef H5 || MP-WEIXINwindo…
uniapp组件库中Collapse 折叠面板 的使用方法
目录
#平台差异说明
#基本使用
#控制面板的初始状态，以及是否可以操作
#自定义样式
#1. 如果修改展开后的内容？
#2. 如何自定义标题的样式？
#3. 如何修改整个Item的样式？
#API
#Collapse Props
#Collapse Item Props
#…
uni-app开发壁纸图像小程序 瀑布流、懒加载展示
标题：使用uni-app开发壁纸图像小程序：瀑布流与懒加载展示
引言： 在今天的移动应用市场中，壁纸图像小程序备受欢迎。为了提高用户体验，我们可以使用uni-app框架来开发这样的小程序，并实现瀑布流和懒加载展示…
【苹果内购支付】关于uniapp拉起苹果内购支付注意事项、实现步骤以及踩过的坑
前言
Hello！又是很长时间没有写博客了，因为最近又开始从事新项目，也是第一次接触关于uniapp开发原生IOS应用的项目，在这里做一些关于我在项目中使用苹果内购支付所实现的方式以及要注意的事项，希望能给正在做uniapp开…
uniapp+uView2.0实现自定义动态tabbar
1.需求说明 2.实现原理说明 3.实现过程 3.1集成uView2.0 3.2 自定义tabbar 3.3 vuex定义tabbar共享信息 3.4 tabbar显示个数控制 1.需求说明 要求不同时间显示不同的tabbar.点击不同的tabbar跳转到不同的页面,能随时…
uni-app:购物车页面--收货地址区域
收货地址区域
创建收货地址组件
在 components 目录上鼠标右键，选择 新建组件，并填写组件相关的信息： 渲染收货地址组件的基本结构：
<view><!-- 选择收货地址的盒子 --><view class"address-choose-box&q…
uni-app:登录与支付--登录
创建 settle 分支
运行如下的命令，基于 master 分支在本地创建 settle 子分支，用来开发登录与支付相关的功能：
git checkout -b settle 点击结算按钮进行条件判断 说明：用户点击了结算按钮之后，需要先后判断是否勾选…
【微信小程序】-- 配置uni-app的开发环境（四十八）
💌 所属专栏：【微信小程序开发教程】 😀 作 者：我是夜阑的狗🐶 🚀 个人简介：一个正在努力学技术的CV工程师，专注基础和实战分享 ，欢迎咨询！ &…
uniapp中如何给下拉框动态绑值
前言： 在项目中我们会经常遇到新增的功能，而新增的页面中就会有输入框、下拉框、文本域、日期选择框等等。那么在uniapp是如何给下拉框中调用接口动态绑值的呢？请往下看 💨 💗 uView官网：介绍 | uView 2.0…
uniapp 适配全面屏
1、manifest.json 文件修改 app-plus 下 添加 "safearea": {"background": "#00000000","bottom": {"offset": "auto"}},2、部分页面设置全屏（登录页面）
methods: {//设置页面全屏onShow(…
选择微信原生小程序还是uniapp？
这个问题还是困扰过我的。但是现在我有了明确的答案。 入门的时候用微信原生小程序，熟悉了之后，马上转uniapp。
我有强有力的依据来说明为什么我确信要用uniapp开发小程序。 1.微信原生小程序语法非常的难用。是一个不伦不类的东西。 语法学vue和react,…
uni-app 打包h5 踩坑
坑1 在我直接点击上图所示编译打包时，报我当前的手机账号需要验证 我百度了下 说是hbuildx版本太低，我升级之后还是不行。 其实就乖乖根据提示去官网认证一下手机号就好了 坑2 打包出来的文件访问时是个空页面 这是因为没有在h5配置相对路径 坑踩了 记录…
【uniapp】Vue3版本项目出现Proxy代理对象无法正常取值问题解决
习惯了使用Vue2版本的uniapp项目，直到后来想升级版本，改用Vue3版本就会遇到一些无法正常取值（访问属性）问题，其中最显著问题就是Proxy代理造成的
在我们用浏览器调试的时候，遇到如同下图这样，出…
uniapp swiper组件实现tab导航滑动切换文本内容
swiper组件可以做滑动切换，但是必须设置一个固定的高度，每一个swiper-item里的内容后台返回的文字内容不一样，就会造成内容不能自动撑开，会被截取
重点：使用nextTick延时设置
//导航
<view class"tab-menu r…
uni-app修改swiper里dot的样式
注意：必须写在App.vue页面 <style>/* 首页的banner dot效果 */.home uni-swiper .uni-swiper-dot {width:6rpx;height:6rpx;}.home uni-swiper .uni-swiper-dot-active {width: 34rpx;border-radius: 20rpx;}
</style>
uni-app从入门到进阶 系统完成项目实战 - uniapp开发ImoocBlog
收获： 1.微信小程序 2.uni-app开发慕课热搜项目 3.构建企业级项目的编程思维 4.上线可商用的企业项目
第5章 uniapp开发ImoocBlog
uniapp开发ImoocBlog
5-1：开篇
经过前面四个章节，我们已经完成了 微信小程序 的学习。那么从这一章开始我…
uniapp - 实现车牌号键盘与格子间隔显示组件，汽车牌照录入支持自定义样式、新能源等（附带组件完整源码，开箱即用，稍微改改就能用）
效果图
uniapp 全平台兼容，车牌号键盘输入、分格显示功能示例源码，注释很多！
可以直接复制一下，然后自己改改样式或功能就能使了。 示例源码
复制，运行。
&
uniapp或者小程序图片选择中的sizeType属性到底是什么
sizeType属性到底是什么 https://developers.weixin.qq.com/community/develop/doc/0006c261a300089771f9a233a56c00 https://ask.dcloud.net.cn/question/146679 第一个链接来自微信小程序社区，有开发者提了个问题：sizeType: ["original", &q…
![前端基于uniapp[uniPush]实现APP消息推送（安卓、IOS）](https://img-blog.csdnimg.cn/d7f5d5772bfc441ca878f362f65a1eb9.png#pic_center)
前端基于uniapp[uniPush]实现APP消息推送（安卓、IOS）
前提概述：此文章都是基于uniapp中uniPush2实现的在线、离线推送
app消息推送流程
登录开发者中心先填写好项目信息以及配置厂商在manifest.json文件中勾选推送模块在前端项目中创建云函数（此云函数的作用是接受后台发送的消息模板，解析出来…
UniApp使用ref动态绑定元素在APP端获取offsetTop为undefined解决方法
介绍：
要求实现，根据id自动滚动到列表中的某一条数据位置
问题：
使用ref绑定，在this. n e x t T i c k 根据 t h i s . nextTick根据this. nextTick根据this.refs.id获取元素读取其offsetTop一直为undefined，pc端测…
有关于我在用uniapp开发的问题
1、uniapp做微信小程序，内嵌H5进行支付
其本质是这样的，在微信小程序种，用web-view嵌入H5页面，然后通过web-view的url对H5进行传参，H5传参后可以做一些处理，然后再把参数传给小程序进行支付
//uniapp小程…
UNI-APP前端项目开发实战
一、创建项目 1.创建项目分为通过HBuilderX可视化界面和vue-cli命令行两种方式创建 2.官方推荐使用HBuilderX可视化界面方式创建，主要是编译器跟随开发工具升级，vue-cli是跟在项目中的，需要手动通过 npx @dcloudio/uvm 命令升级。 3.使用HBuilderX有一个弊端就是无…
uni-app开发组件之view组件详细教程
View 是 UniApp 中最基础的组件之一，用于创建容器来包含其他组件或元素。它类似于 HTML 中的 div 元素，提供了布局和样式控制的功能。本教程将介绍如何使用 View 组件，并提供一些示例代码帮助你更好地理解。
使用 View 组件
要使用 View 组…
Uuiapp使用生命周期，路由跳转传参
Uniapp生命周期：
1. beforeCreate：在实例初始化之后，数据观测和事件配置之前被调用。
2. created：在实例创建完成后被立即调用。
3. beforeMount：在挂载开始之前被调用：相关的 render 函数首次被调用。 …
uni-app APP、html引入html2canvas截图以及截长图
下载安装html2canvas
方式一，https://www.bootcdn.cn/ CDN网站下载html2canvas插件 这里下载后放在测项目目录common下面 页面中引入
方式二、npm方式安装html2canvas
1、npm方式下载
npm i html2canvas2、引入html2canvas
import html2canvas from html2can…
uni-app跳转路由方式
首先是最简单的通过标签跳转
<navigator url "/pages/mmage/indypl" open-type"navigate">跳转页面</navigator>这就是最基本的路由跳转标签 但不怎么常用 不要无脑复制 注意好页面的url路径哦 但如果你要跳转的页面被设置tabBar中 这样是跳…
UniApp组件封装
什么是UniApp组件？
UniApp是一个跨平台的开发框架，允许开发者使用Vue.js编写一次代码，然后将其发布到多个平台，包括iOS、Android和Web。在UniApp中，组件是构建用户界面的基本单元，它们可以重复使用&#x…
uni-app+vant-weapp使用vue.js快速开发微信小程序
uni-app可以通过hbuildx进行下载，选择模板，使用vue.js语法进行开发，对vue支持程度非常高，最终打包成各种应用，主要说下微信小程序方面使用以及开发。有赞vant-weapp 是一款移动端UI框架包括vue版本、微信小程序版本、支…
用uniapp完成一个前端项目
持续更新中… 这里给初学者提供一个uniapp的练习项目，学习uniapp需要vue和微信小程序的基础（其实微信小程序基础需要的不多），建议把基础内容学牢固了再看本文。
本项目完成的是H5小程序APP的新闻项目，下面就开始说一下…
uniapp页面跳转到原生ios页面
这段时间一直在忙项目加班，好久没写笔记了。今天来公司加班，忙完手里的活，先把这段时间遇到的问题难点梳理总结下。好记性不如烂笔头嘛。
项目背景是前端用uniapp开发页面，然后嵌套到原生ios及安卓里面，在开发的时候就…
Windows命令行压缩gz文件
tar -help
win10好像是某个版本号之后，才能使用tar命令，所以想要直接在win10上面使用tar命令，就更新系统吧。
按 winr 键后输入 cmd 打开命令行终端，输入 tar -help 命令，如下所示。 tar -cf xxx.tar.gz ./xxx //是…
u-view2.0 的placeholder-style设置失效， 解决办法
设置placeholder-style属性发现怎么设置都无效，此时更有趣的事情发生了；（使用了uview-ui v1，情况都一样）
查了一些资料，原因是因为动态创建元素的原因，
解决办法：用v-if去控制显隐…
uniapp 使用app-plus自定义导航栏(titleNView)右侧自定义图标+文字按钮
前言 最近在使用uni-app写H5移动端时候，在pages.json文件配置导航栏的图标时发现不生效 去官网查阅了很久，意思是不支持本地图片，支持iconfont.ttf（iconfont本地下载）格式图片 意思是在导航栏的图标需要在iconfont图…
uniapp小程序订阅消息推送+Thinkphp5后端代码教程示例
记录一下通过uniapp开发小程序消息推送的实例，配合后端tp推送，之前写的项目是微信小程序而且后端是原生php，这次通过项目记录一下 目录 回顾access_token获取规则以及思路 第一步：设计前端触发订阅事件第二步：设计将to…
uniapp和springboot微信小程序开发实战：后端架构搭建之使用shiro和jwt实现登录认证
文章目录 shiro和jwt技术shiro什么是认证？什么是授权？Shiro靠什么做认证与授权的？JWTJWT（Json Web Token）JWT可以用在单点登录的系统中JWT兼容更多的客户端shiro和jwt依赖shiro和jwt整合流程创建JwtUtil工具类定义密钥和过期时间创建JwtUtil工具类令牌封装成认证对象创建O…
uni-app学习笔记(2)：组件
文章目录1、vue生命周期2、计算属性、方法、监听3、父子组件传值4、组件参数校验5、pages.json6、navigator1、vue生命周期
vue生命周期图
<template><view><button click"click">提交</button><view>{{text}}</view></vie…
uniapp 蓝牙模块封装
文章目录 蓝牙模块封装代码代码介绍 蓝牙模块封装代码
class BluetoothClass{constructor(deviceId,serviceId,notifyId,writeId){this.deivceList_find []this.deviceId deviceIdthis.serviceId serviceIdthis.notifyId notifyIdthis.writeId writeId}//获取所有蓝牙设备…
uni-app项目的启动
uni-app项目的启动
在manifest.json中开启纯nvue文本项目 将pages下的index下的index.vue后缀改为nvue 最后运行即可
原生微信小程序/uniapp使用空格占位符无效解决方法
最近碰到一个需求，在一个<text>文本中的前后添加空格占位符，总所周知，我并不会前端，于是我查看了原生微信小程序以及uniapp官方文档，得到了以下答案：
原生微信小程序官方文档 uniapp官方文档 从文档…
HBuilder（uniapp） 配置android模拟器
下载android-studio-ide 下载完成，打开如下页面
点击Configure—》SDK Manager—》 选择AndroidSDK 选择完成之后，点击ok，再次点击Configure—》AVD Manager 可以先建个模拟器： 建完之后会出现以下页面： 配置adb…
uniapp项目的map组件生成地图显示
需要腾讯地图服务商 SDK 配置配置：
1.首先需要获取腾讯地图的秘钥
打开腾讯位置服务： https://lbs.qq.com/ 点击右上角创建应用 创建之后点击右上角添加key: 述 填入key名称和验证码之后，点击确定。
2.打开manifest.json 3.点击h5配置&a…
#vue# vue阻止事件冒泡
需求/问题：
父盒子设置了一个点击事件，子盒子也设置了一个点击事件，
为了不点击子盒子时，会触发父盒子的点击事件，
在这个时候，我们需要设置阻止冒泡事件
方法：
只需要在子盒子的点击事件里…
如何在uni-app项目里使用tailwindcss，且兼容小程序（详细）
Hbuilder构建项目自由度比较低，我选择使用VScode构建uni-app
不懂的请看这一篇文章：《如何用vscode构建uni-app项目》
安装相关依赖： 这是我项目的依赖给大家参考一下： 安装tailwindcss 本人安装的是兼容版的：详细安…
uniapp 带样式---轮播
上家伙，先瞅瞅…… HTML代码：
<view class"banner"><swiper class"banner-swiper" autoplay circular :interval"3000" :duration"500" change"swiperChange"><swiper-item v-for&qu…
5，uniapp功能之—打印机，打印文本和二维码等，（佳博的打印机）
效果图： 思路：1，一个打印按钮，2点击按钮弹窗一个蓝牙模块，选择蓝牙进行连接，连接成功就直接进行打印了，3，打印的内容自己设置 项目结构： 上代码，打印机参数…
uni-app使用本地文件在移动端长久存储数据
需求
1.本地存储数据。 2.在连接上服务器后可以完成移动端和服务端之间的数据同步。
解决方案
uni-app 框架中使用plus.io.requestFileSystem技术完成数据在手机端的持久化处理。
代码
plus.io.requestFileSystem代码
let addr "/storage/emulated/0/database/&quo…
uniapp开发小程序-分包（微信错误码：800051）
在使用uniapp开发小程序时，上传的时候因为文件过大，显示上传失败。
以下是开发过程中遇到的问题及解决方法：
1. 问题一：因为文件过大，显示上传失败 ①尝试过把本地使用的图片压缩到最小； ②把图片转换为网…
4，uniapp功能之——APP更新，打包上线安装后的app的随时更新，页面实时显示当前更新的百分比
App.vue这文件都有吧，当然，也可以写在其他页面，看项目需求了。 思路：第一个方法调接口返回来的是版本号和新的版本链接，将这个版本号与当前app的版本号进行比较，接口返回的版本号大于当前的版本号就弹窗提示…
2，uniapp功能之—扫码（条形码，二维码）点击扫码或者pda侧边按钮扫码
最近在搞uniapp的项目，所以最近的文章基本上是关于uniapp的。 分享一个自动生成二维码的网址，点击前往 注意 如果扫码和上一个nfc功能在同一个页面里面，会发生冲突，只有一个有用，一个没有用，所有，我给扫码的分装成了一个组件，这样就不会冲突了。 1，在component里面新建…
【UniApp开发小程序】小程序首页(展示商品、商品搜索、商品分类搜索)【后端基于若依管理系统开发】
文章目录 界面效果界面实现工具js页面首页让文字只显示两行路由跳转传递对象将商品分为两列显示使用中划线划掉原价 后端商品controllerservicemappersql 界面效果
【说明】
界面中商品的图片来源于闲鱼，若侵权请联系删除关于商品分类页面的实现，请在我…
uni-app目录用处
componentsuni-app组件目录，放可复用的组件pages业务页面文件存放的目录static存放应用引用静态资源（如图片、视频等）的地方，注意：静态资源只能存放于此App.vue应用配置，用来配置App全局样式以及监听 生命周…
uniapp常见问题
1.打包后横屏
<script>export default {onLaunch: function() {plus.screen.lockOrientation(landscape-primary); //锁定横屏效果是 软件打开时依旧是竖屏，过会儿自动横过来},onShow: function() {},onHide: function() {}}
</script>2.隐藏状态栏和虚…
解决uniapp 二次登陆 登录页是首页时，登录页闪现问题
pages.json文件中，pages数组中第一项是登录页，用户第一次登录后，存储登录状态，以后再进入应用时，自动登录跳转至首页。
但是自动登录跳转至首页时，登录页总是会闪现一下。
第一步：manifest.js…
vue 使用插件高德地图--vue-amap
第一步：安装 vue-amap npm install vue-amap第二步：在你的 Vue 项目中注册 vue-amap： // main.js
import Vue from vue;
import VueAMap from vue-amap;Vue.use(VueAMap);VueAMap.initAMapApiLoader({// 高德开发者平台申请key值key: cc9c098…
uni-app中监听网络状态，并在嵌入webView页面的组件中添加网络监测
uni-app中监听网络状态，并在嵌入webView页面的组件中添加网络监测
uni-app中监听网络状态
下载插件
打开网络异常组件页面，点击"下载插件并导入HBuilderX"按钮，打开HBuilderX软件后，选择需要导入插件的项目ÿ…
uniapp 之 动态获取swiper 的高度
场景： swiper 组件，swiper 需要设置高度，不能设置同样高度，有的swiper-item的高度可能不需要那么高，有的又需要那么高，所以不同swiper-item内容不同，需要渲染出来的高度不同；
&…
VUE_网页自定义右键菜单组件
可以在uni-app或vue脚手架项目使用
引入组件会接管页面右键事件，所有options为空数组时，在页面右键将没有反应
rightMenu.vue
<template><view><view v-if"show" class"contextMenu" :style"lay_style"…
uni-app中使用钉钉h5微应用扫码功能
1.在使用uni-app中，为了兼容多个平台，跨端交互成了我们前端开发的一个大的难点，同时我们在项目开发时，测试工具就成了我们一个必然的需求，当然针对不通的端我们有不同的测试工具。
接下来我们做一个在钉钉项目中使用扫…
民族传统文化分享系统uniapp 微信小程序
管理员、用户可通过Android系统手机打开系统，注册登录后可进行管理员后端；首页、个人中心、用户管理、知识分类管理、知识资源管理、用户分享管理、意见反馈、系统管理，用户前端；首页、知识资源、用户分享、我的等。 本系统的使用…
【RuoYi移动端】uni-app如何发布h5网站？
一、登录D-Cloud开发者中心
开发者中心https://dev.dcloud.net.cn/二、创建应用 三、填写和提交创建应用 四、复制APPID
基于Android的课程教学互动系统 微信小程序uniapp
教学互动是学校针对学生必不可少的一个部分。在学校发展的整个过程中，教学互动担负着最重要的角色。为满足如今日益复杂的管理需求，各类教学互动程序也在不断改进。本课题所设计的springboot基于Android的教学互动系统，使用SpringBoot框架&am…
uniapp封装ajax请求
import /common/api/interceptor.js; // 引入拦截器文件
export default{common:{baseUrl:"http://localhost:3000/api",data:{},header:{"Access-Control-Allow-Origin":"*","Content-Type":"application/json","Cont…
uniapp实现底部弹出菜单选择
其实uniapp有内置的组件，不用自己去实现，类似于这样：
uni.showActionSheet({itemList: [菜单一, 菜单二, 菜单三],success: function (res) {console.log(选中了第${res.tapIndex 1}个菜单);},fail: function (res) {console.log(res.errMs…
uni-app 分不清的全局变量this, uni, $u, vm, uni.$u, this.$u
项目引入了uview,并将uview所有模块指给uniapp全局变量uni uni.$u$u 在登录页面，或者APP.vue打印以下变量：
this, uni, $u, vm, uni.$u, this.$u
Uniapp笔记（七）uniapp打包
一、项目打包
1、h5打包 登录dcloud账户，在manifest.json的基础配置选项中，点击重新获取uniapp应用标识APPID 在manifest.json的Web配置选项的运行的基础路径中输入./ 在菜单栏的发行栏目，点击网站-PC或手机H5 输入网站标题和网站域名&am…
vue3+ts+uniapp小程序端自定义日期选择器基于内置组件picker-view + 扩展组件 Popup 实现自定义日期选择及其他选择
vue3ts 基于内置组件picker-view 扩展组件 Popup 实现自定义日期选择及其他选择 vue3tsuniapp小程序端自定义日期选择器 1.先上效果图2.代码展示2.1 组件2.2 公共方法处理日期2.3 使用组件 3.注意事项3.1refSelectDialog3.1 backgroundColor"#fff" 圆角问题 自我记…
Uniapp开发的开源盲盒系统源码
最近比较火的盲盒系统，该项目是基于uniapp开发的盲盒项目，有需要的朋友可以联系我，运营级的项目，本次开源的是uniapp前端模板，选用技术为JAVA，采用框架：spring bootmybatisvue开发。
通过node安…
uni-app基本使用（一）
关注了下最近uni-app使用率在提高，毕竟是多端公用代码，用户体验更接近原生效果，还是值得一看的，今天抽时间进行下总结，如果不对的地方，欢迎指出，及时修改
1.根据官网补充下介绍
1.uni-app是一…
小程序-uni-app：hbuildx uni-app 安装 uni-icons 及使用
一、官方文档找到uni-icons
uni-app官网 二、下载插件 三、点击“打开HBuildX” 四、选择要安装的项目 五、勾选要安装的插件 六、安装后，项目插件目录
根目录uni_modules目录下增加uni-icons、uni-scss 七、引入组件，使用组件
<uni-icons type&qu…
【uniapp】 实现公共弹窗的封装以及调用
图例：红框区域为 “ 内容区域 ” 一、组件
<!-- 弹窗组件 -->
<template>
<view class"add_popup" v-if"person.isShowPopup"><view class"popup_cont" :style"{width:props.width&&props.width&…
ipa上架App Store【uniapp-ios】
前置条件：已获取到.mobileprovision描述文件、.p12证书并打包生成ipa包
（如果还没获取证书、描述文件等可以去看我前两篇博客：uniapp-ios打包步骤 、uniapp-ios打包安装测试。一篇是已经付费了即已经注册了Apple Developer Program…
uni-app crypto-js DES 加解密 ，支持app , h5，小程序
crypto-js DES 加解密 ，支持app,h5，小程序 第一步 npm install crypto-js 可以直接下载示例运行，看控制台打印 下载地址 https://ext.dcloud.net.cn/plugin?id13351
crypto-js DES 加解密 - DCloud 插件市场
uni-app之使用内置组件Canvas
UniApp 是一个基于 Vue.js 的跨平台开发框架，它允许开发者使用一套代码同时构建多个平台的应用程序。UniApp 提供了丰富的内置组件，其中包括 Canvas 组件，用于在应用中绘制图形和实现图形动画效果。本文将详细介绍 UniApp 内置组件 Canvas 的…
快速入门uniapp——从环境搭建到项目实践
🙂博主：小猫娃来啦 🙂文章核心：快速入门uniapp——从环境搭建到项目实践 文章目录 初步介绍UniApp开发环境搭建下载和安装UniApp开发工具创建新项目（HBuilderX）开发工具界面介绍 UniApp基础知识页面结构页面…
uniapp快速开发小程序全流程
uniapp快速开发小程序全流程
完整项目代码：https://gitee.com/Zifasdfa/ziyi-app 欢迎fork与star 1 项目效果及环境准备
1.1 项目效果 本文主要使用uniapp实现一个简单的app应用 1.2 环境准备&项目初始化 ①node环境：去node.js官网下载稳定版的nod…
前端Vue自定义精美悬浮菜单按钮fab button 可设置按钮背景颜色 菜单按钮展开条目
前端Vue自定义精美悬浮菜单按钮fab button 可设置按钮背景颜色 菜单按钮展开条目,下载完整代码请访问uni-app插件市场地址：https://ext.dcloud.net.cn/plugin?id13321
效果图如下: # cc-suspensionMenu
#### 使用方法
使用方法
<!-- scrollShow:是否显示滑动…
配置uniapp调试环境
目录 uni-app介绍
uni-app开发工具HBuilderX
创建项目前提条件
uni-app项目结构
配置mumu模拟器
uni-app生命周期
1.应用生命周期 小程序规范
2.页面生命周期-小程序规范
3.组件生命周期 vue规范
uni-app登录按钮方法
uni-app发布安卓app uni-app介绍
uni-app 是一个…
uniapp 实现地图距离计算
在uniapp中实现地图距离计算可以借助第三方地图服务API来实现。以下是一种基本的实现方式： 注册地图服务API账号：你可以选择使用高德地图、百度地图等提供地图服务的厂商，注册一个开发者账号并获取API密钥。 安装相关插件或SDK：根…
uni-app 自定义swiper组件
uni-app 自定义导航栏 uni-app 自定义导航栏步骤uni-app 自定义导航栏实例 uni-app 自定义系统导航栏 uni-app 自定义导航栏
uni-app 自定义导航栏步骤
在 uni-app 中，可以通过修改页面的导航栏配置来实现自定义导航栏的效果。以下是实现自定义导航栏的一般步骤&a…
uni-app app端.m3u8类型流的播放
1.开发环境：HBuilderX3.8.7、uni-app、vue2.0、view2.0、uni-ui 2.实现通过web-view 嵌入H5页面，进行视频流自动播放。 注意事项： 如果只是在android端可以直接使用.flv格式的视频流； 如果App需要支持ios就可以考虑一下播放.m3u8格…
uniapp-地区的四级联动
本来填写订单的页面选地址是三级联动的
但是由于领导的要求，需要改成四级联动
解决思路
最开始用的是官方的 picker , 所以我去翻看了uniapp 的官网
我们需要用到的是多列模式 解决步骤
1. 先封装对应的请求
/*** 获取省市县街道的列表*/
export const getA…
【uniapp】picker mode=“region“ 最简单的省市区 三级联动
省市区 picker
template
<picker mode"region" :value"date" class"u-w-440" change"bindTimeChange"><u--inputborder"bottom"class"u-fb u-f-s-28"placeholder"请选择省市区"type"te…
uniapp安卓ios打包上线注意事项
1、安卓包注意事项
隐私政策弹框提示 登录页面隐私政策默认不勾选隐私政策同意前不能获取用户权限APP启动时，在用户授权同意隐私政策前，APP及SDK不可以提前收集和使用IME1、OAID、IMS1、MAC、应用列表等信息 ios包注意事项
需要有注销账号的功能
3、安…
uniapp 网络请求封装(uni.request 与 uView-Plus）
一、背景
在开发项目中，需要经常与后端服务器进行交互；为了提高开发效率和代码维护性，以及降低重复性代码，便对网络请求进行封装统一管理。
二、创建环境文件
2.1、根目录新建utils文件夹，utils文件夹内新建env.js文…
uniapp：蓝牙设备ios与安卓端deviceId不一致问题及ios端获取蓝牙mac地址方法
问题
在uniapp开发项目中，主要是指APP端，使用API接口：uni.getBluetoothDevices或者uni.onBluetoothDeviceFound查找到的蓝牙设备数据里deviceId值不一样： 在安卓中deviceId即mac地址 在ios中deviceId即uuid 如何在ios端也能获取到…
基于JAVA SpringBoot和UniAPP的宠物服务预约小程序
随着社会的发展和人们生活水平的提高，特别是近年来，宠物快速进入人们的家中，成为人们生活中重要的娱乐内容之一，过去宠物只是贵族的娱乐，至今宠物在中国作为一种生活方式得到了广泛的认可，随着人们精神文明…
在uni-app中，input组件的auto-focus和focus属性用于控制输入框的自动聚焦行为，它们之间的区别
auto-focus属性： 作用：指定输入框是否默认自动获得焦点。值：布尔值，true表示自动聚焦，false表示不自动聚焦。使用方法：直接将auto-focus属性赋值给input组件即可。示例： htmlCopy Code <inp…
uniapp使用webview将页面转换成图片支持h5、app、小程序
uniapp使用webview将页面转换成图片支持h5、app、小程序
在uniapp项目中新建主页和webview页面
index.vue代码
<template><view><!-- 微信小程序要设置src为网络路径 --><web-view src"/hybrid/html/webview.html"></web-view><…
uniapp分包 解决分多个包的问题
1. 分包可以分很多个, 但是在"optimization": { "subPackages": true } 里面只能写一个, 2. 想分多个包 , 在 pages.json 里面 的 subPackages 里面继续加 第三个 第四个即可 3. 保存之后 创建页面就可以看见多个包了
uni-app动态tabBar，根据不同用户展示不同的tabBar
1.uni框架的api实现 因为我们用的是uni-app框架开发，所以在创建项目的时候直接创建uni-ui的项目即可，这个项目模板中自带了uni的一些好用的组件和api。 起初我想着这个效果不难实现，因为官方也有api可以直接使用，所以我最开始尝试…
uni-app 折叠自定义
uni-app的uni-collapse折叠组件样式修改 下面是修改后的样式
<uni-collapse accordion class"ze" v-model"isCollapse" click"toggleCollapse"><!-- 因为list默认带一条分隔线，所以使用 titleBorder"none" 取消…
uni-app里使用webscoket
实现思路和vue中是一样的。如果想看思路可以看这篇文章：websocket
直接上可以运行的代码：
一、后端nodeJS代码：
1、新建项目文件夹
2、初始化项目：
npm init -y
3、项目里安装ws
npm i ws --save
4、nodeJS代码࿱…
uview ui 1.x ActonSheet项太多，设置滚动
问题：ActionSheet滚动不了。
使用uview ui ：u-action-sheet, 但是item太多，超出屏幕了， 查了一下文档，并没有设置滚动的地方。
官方文档：ActionSheet 操作菜单 | uView - 多平台快速开发的UI框架 - uni-a…
Uniapp笔记（三）uniapp语法2
一、本节项目预备知识
1、组件生命周期
1.1、什么是生命周期
生命周期(Life Cycle)是指一个对象从创建-->运行-->销毁的整个阶段，强调的是一个时间段
我们可以把每个uniapp应用运行的过程，也概括为生命周期 小程序的启动，表示生命周…
Uniapp笔记（八）初识微信小程序
一、微信小程序基本介绍
1、什么是微信小程序
微信小程序简称小程序，英文名Mini Program，是一种不需要下载安装即可使用的应用，它实现了应用“触手可及”的梦想，用户扫一扫或搜一下即可打开应用 小程序是一种新的开放能力&#…
uniapp项目实践总结(十四)封装存储和路由方法
导语：在日常 APP 开发过程中，经常要用到数据的存储、获取和删除等操作以及页面导航之间的跳转，为此，封装了一个两个简单的方法来统一调用。 目录
原理分析方法实现实战演练案例展示
原理分析
主要是以下 API。
uni.setStorage…
uniapp H5生成画布，插入网络图片。下载画布
因为网络图片不能直接使用ctx.drawImage(）插入。得使用uni.getImageInfo()方法下载后插入。 但是当画布中存在多张网络图片时，必须等待uni.getImageInfo()下载完成后才行。这样得下载套下载。太过于繁琐。所以定义了一个递归下载方法。同时避免下载图片异…
uni-app 微信小程序movable-area遮盖 遮挡住 点击事件
问题描述：
使用了movable-area拖拽在页面有点击事件的地方会覆盖住点击事件
直接上代码： <movable-area class"movable-area"><movable-view class"movable-view" :x"x" :y"y" direction"all&q…
uniapp打包安卓后在安卓屏上实现开机自启动
实现开机自启动(使用插件)
打开插件地址安卓开机自启动 Fvv-AutoStart - DCloud 插件市场
使用方法
选择你要开启自启动的项目 在项目的manifest.json中app-plus下写入以下代码 注意需要替换 android_package_name 为自己的,不然无法进行安卓apk打包
"nativePlugins&q…
uniapp-video自定义视频封面
uniapp官方文档：video | uni-app官网uni-app,uniCloud,serverlesshttps://uniapp.dcloud.net.cn/uni-app-x/component/video.html#video
主要使用到的是poster属性，详细属性可点击上方api进行查看 <video id"myVideo" class"xwlogo&q…
uni-app+uView实现点击查看大图片的效果
<u-button text"月落" click"imgPreview()"></u-button>
//注意：参数urls 是预览图片的链接地址，是个数组
imgPreview() {uni.previewImage({indicator: "none",loop: false,urls: []，})
},参数说…
微信小程序原生框架转Uni-App：你需要知道的一切
目录 微信小程序原生框架转Uni-App：你需要知道的一切引言目录为什么选择Uni-App准备工作文件结构调整代码转换API适配微信小程序：获取用户地理位置Uni-App：获取用户地理位置对比与分析 测试与调试总结与建议 博主 默语带您 Go to New World. …
uni-app:允许字符间能自动换行（英文字符、数字等）
<template><view class"container"><!-- 这里是你的文本内容 -->{{ multilineText }}</view>
</template><style>
.container {word-break: break-all;
}
</style>例如：
<template><view class"…
工具类APP如何解决黏性差、停留短、打开率低等痛点？
工具产品除了需要把自己的功能做到极致之外，其实需要借助一些情感手段、增设一些游戏机制、输出高质量内容、搭建社区组建用户关系链等方式，来提高产品的用户黏性，衍生产品的价值链。
工具类产品由于进入门槛低，竞争尤为激烈&…
uniapp项目实战系列(4)：服务的异步请求，请求服务的二次封装
目录 系列往期文章（点击跳转）uniapp项目实战系列(1)：导入数据库，启动后端服务，开启代码托管（点击跳转）uniapp项目实战系列(2)：新建项目，项目搭建，微信开发工具…
深入解析即时通讯App开发中的关键技术
即时通讯App开发在现代社交和通信领域中扮演着重要的角色。随着移动设备的普及和网络的高速发展，人们对即时通讯工具的需求不断增加。本篇文章将深入探讨即时通讯App开发中的关键技术，帮助读者了解该领域的最新动态和技术趋势。
基础架构和通信协议
现…
uniapp实现移动端的视频图片轮播组件
1、视频轮播组件app体验地址
https://tt.appc02.com/nesxr6
2、支持小程序、H5、APP，在小程序上运行的效果图 3、使用方法
第一步，按照截图步骤配置好 第二步：参考以下代码，使用视频图片轮播组件
<template><view>…
uniapp项目实践总结(七)编写一个简单的应用页面
之前自定义了顶部和底部导航栏，那接下来就写一个简单的二级页面，这个是出了导航页面之外经常用到的。 目录 结构模板样式方法示例结构
一个普通页面的结构应该是如下所示：
<!-- html -->
<template><view class="list"> 列表内容 </view&g…
uniapp 处理 分页请求
我的需求是手机上一个动态滚动列表，下拉到底部时，触发分页数据请求 uniapp上处理分页解决方案
主要看你是如何写出滚动条的。我想到的目前有三种
（1）页面滚动：直接使用onReachBottom方法，可以监听到达底部…
uniApp webview 中调用底座蓝牙打印功能异常
背景:
使用uniApp, 安卓底座 webView 方式开发;
调用方式采用H5 向 底座发送消息, 底座判断消息类型, 然后连接打印机进行打印;
内容通过指令集方式传递给打印机;
过程当中发现部分标签可以正常打印, 但又有部分不行,打印机没反应, 也没有报错;
原因分析:
对比标签内容…
数字藏品系统：开启无与伦比的收藏之旅
数字藏品系统：开启无与伦比的收藏之旅 随着数字技术的飞速发展，数字藏品系统已经成为了艺术品收藏领域的新宠。数字藏品系统依托先进的数字化技术，将珍贵的艺术品、文物、纪念品等转化为数字格式，让收藏家们可以随时随地欣赏、收藏…
[uni-app] scroll-view中吸顶的简单做法 - overflow-y: auto；
记录一个css技巧
overflow-y: auto;
效果 <scroll-view scroll-y"true"><view class"top">这是吸顶view</view><view class"content">这是滚动view</view></scroll-view>要实现scroll内部 , .top吸顶 , .…
UNIAPP之js/nvue混淆探索
因项目需要对UNIAPP的js混淆做了一些调研 混淆教程: https://uniapp.dcloud.net.cn/tutorial/app-sec-confusion.html 按照教程配置进行打包正式包进行混淆 下载正式包将 .ipa改为.zip 解压获取到HBuilder.app 右键显示包内容
获取到混淆的key
不同时间进行打包混淆同一文…
uniapp cli创建 vue3 + typeScript项目 配置eslint prettier husky
1 命令创建项目
npx degit dcloudio/uni-preset-vue#vite-ts my-vue3-project2 下载依赖
npm install3 填写appid 4 运行项目并且微信开发工具打开
npm run dev:mp-weixin5 安装 vscode 插件
安装 **Vue Language Features (Volar)** ：Vue3 语法提示插件
安装 *…
uni-app跳转到另一个app
第一步： 首先要知道 app的包名 获取方式如下 第二步：
在第一个 demo1 app 一个页面中需要一个按钮去跳转 方法如下
<template><view class"content"><button click"tz">跳转</button></view>
</…
手动实现uni-app可用的new URL
使用
import URL from url
const url new URL(https://www.aaa.com:8989/bbb/ccc/ddd.html?e1&f2&g#h3&i4&j?k5#l6&e4)
console.log(url)结果
{"href": "https://www.aaa.com:8989/bbb/ccc/ddd.html?e1&f2&g#h3&i4&j…
uni-app 之 picker选择器
uni-app 之 picker选择器
同步滚动：开
uni-app 之 picker选择器
一、普通选择器 二、多列选择器 三、时间选择器 四、日期选择器 一、普通选择器
<template><view><picker change"bindPickerChange" :value"index" :range&q…
uniapp点击事件在小程序中无法传参
这个问题很是神奇，第一次遇到。在h5中，点击事件可以正常传参，打包小程序后确失效了。 修改：for循环中的key，使用 index就好了
uni-app：设置图片一直旋转
核心代码
标签
<view class"search_tip_icon"><image :src"refresh1_icon"></image>
</view> 样式
animation: spin 2s linear infinite; //animation-name: spin;：指定要应用的动画名称为 spin。该名称对应了 keyf…
uniapp 开发 之 如何给边框添加阴影效果
uniapp 开发 之 如何给边框添加阴影效果 image.png <view style"width: 100px; height: 100px; margin: 50px; -moz-box-shadow:2px 2px 10px #06c; -webkit-box-shadow:2px 2px 10px #06c; box-shadow:2px 2px 10px #06c; ">测试边框阴影</view>css的bo…
uniapp滚动页面改变背景颜色
可以利用uni-app自带的组件scroll-view，结合scroll事件实现滚动时改变背景颜色的效果。
下面是一个示例代码：
<template><view style"background-color: {{bgColor}}"><scroll-view class"scroll-view" scroll&quo…
uniapp vue项目把图片路径从data数据传到css（uniapp css变量）
<view class"top-menu-li f34 " tap"changeTopMenu(0)" v-if"isExpressAble":class"{active : curNowCat 0}" :style"dynamicStyle"><text class"text">快递</text></view><view clas…
uniapp：不同权限设置不同的tabBar
1、在pages.json里，将所有tabBar涉及的页面都加进来。
我这里使用username来动态显示tabBar。
jeecg用户显示：首页，订单，消息，发现，我的，一共5个tabBar。
admin用户显示：首页&…
uniapp录音功能
录音功能需要使用到uniapp官方文档里面的API
模版区
<template><view><button tap"startRecord">开始录音</button><button tap"endRecord">停止录音</button><button tap"playVoice">播放录音<…
uni-app：实现元素中实现竖直居中
效果展示
前： 后： 未实现前代码
<template><view class"container"><view class"centered-element">我是要被居中的元素</view></view>
</template><script>export default {data() {r…
uni-app：点击图片进行图片旋转（可自定义旋转次数）
效果 代码
<template><view><view class"top_line"><view class"top_img"><image src"../../../static/bg/index.png" mode""></image></view><view class"top_button">…
基于Java+SpringBoot+UniApp的微信小程序朋友圈
✌全网粉丝20W,csdn特邀作者、博客专家、CSDN新星计划导师、java领域优质创作者,博客之星、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和毕业项目实战✌ 🍅文末获取项目下载方式🍅 一、项目背景介绍： 随着社交媒体的兴起和…
uniapp项目实践总结(十三)封装文件操作方法
导语：在日常 APP 开发过程中，经常要进行文件的保存、读取列表以及查看和删除文件等操作，接下来就看一下具体的方法。 目录
原理分析方法实现实战演练案例展示
原理分析
主要是以下 API。
uni.saveFile：保存文件到本地缓存列表…
tailwindcss 如何在 uniapp 中使用
直接使用https://tailwindcss.com/docs/guides/vite这篇官方教程的写法是跑不通的，摸索以后整理了一下，最关键的是第五步 npm install -D tailwindcss postcss autoprefixernpx tailwindcss init -p在 tailwind.config.js 中写入
/** type {import(tail…
如何精细化管理APP用户生命周期，寻找业绩增长点？
在APP精细化运营中，经常会提到用户生命周期，在对APP进行运营的时候，需要明确，自己的APP是处于产品生命周期的哪一个，然后根据这个生命周期的特点，使用最准确的运营方法。
01、为什么要提升用户生命周期价值…
uni-app 之 文字分两行显示超出用省略号表示
uni-app 之 文字分两行显示超出用省略号表示
vue 将一大串文字分两行显示超出用省略号表示
通过css设置文字强制不换行超出用省略号表示: {white-space: nowrap; 文本强制不换行；text-overflow:ellipsis; 文本溢出显示省略号；overflow:hidden; 溢出的部…
uni-app：实现图片周围的图片按照圆进行展示
效果 代码
<template><view class"position"><view class"circle"><img src"/static/item1.png" class"center-image"><view v-for"(item, index) in itemList" :key"index" class&q…
uniapp iconfont-引用阿里巴巴矢量图标库
k-icons-font图标插件:
https://ext.dcloud.net.cn/plugin?id14612
下载图标库
https://www.iconfont.cn/
为了方便使用设置FontClass为空，当然不设置也可以 下载图标库 将图标可以中的：iconfont.css、iconfont.ttf拷贝到插件目录上"k-icons-f…
【uni-app】—3.新建一个uni-app项目
一、新建uni-app项目
1. 打开HBuilder X 2. 新建项目 3. 配置项目信息 4. 安装Sass 插件 （因为项目需要） 这里需要登录，自行用邮箱注册登录，再下载安装插件，安装完成如下
二、项目目录扩展
1. 初始化项目目录 2. 扩…
uni-app直播从0到1实战
1.安装开发工具 2.创建项目 参考：uniapp从零到一的学习商城实战_云澜哥哥的博客-CSDN博客 3.编写公共样式：common.css & free.css App.vue引入公共文件： 图标库：iconfont-阿里巴巴矢量图标库
利用transform和border 创造简易图标，以适应uniapp中多字体大小情况下的符号问题
heml:
<text class"icon-check"></text> css: .icon-check {border: 2px solid black;border-left: 0;border-top: 0;height: 12px;width: 6px;transform-origin: center;transform: rotate(45deg);}
实际上就是声明一个带边框的div 将其中相邻的两边去…
uniapp ssr发行后一直Hydration completed but contains mismatches Cannot find module
最开始我用前端网页托管的地址访问一直是 Hydration completed but contains mismatches
解决方案 要从云函数的地址访问项目。 先绑定域名，否则用uniapp自带地址访问一直是下载文件 设置路径 最后效果
uniapp ssr 云函数访问 MODULE_NOT_FOUND:Cannot fin…
uniapp使用Vue2框架生成二维码
1. 生成二维码插件
npm install qrcodejs2 --save
上代码：
<template><view><view class"page" ><div id"qrCode" ref"qrCodeDiv" ></div></view><view class"page">核…
【uniapp】小程序开发，初始化项目vscode
使用uniapp开发小程序可以实现一份代码打包成多个不同平台的小程序。 这里使用uniapp官方的项目模板作为示例，采用vue3ts开发，并使用vscode作为开发工具
一、通过命令行创建项目并运行
1、通过以下命令创建模板项目
参考 官方说明
npx degit dcloudi…
uniapp h5 echarts 打包后图表点击失效/及其他失效
文章目录 期望效果实际效果环境引入echarts方式解决方法：注意 原因多说一句在h5打包的时候将 history 改为 hash 不然在浏览器打开后刷新会404 期望效果 实际效果 环境
pc端 window11 hbuilderx版本 3.8.12 echarts版本 5.4.3
引入echarts方式
npm install echar…
基于Java+SpringBoot+Vue+uniapp校园点餐小程序（包含协同过滤算法和会员系统，强烈推荐！）
校园点餐小程序 一、前言二、我的优势2.1 自己的网站2.2 自己的小程序（小蔡coding）2.3 有保障的售后2.4 福利 三、开发环境与技术3.1 MySQL数据库3.2 Vue前端技术3.3 Spring Boot框架3.4 微信小程序 四、功能设计4.1 系统功能结构设计4.2 主要功能描述 五…
uniapp和小程序设置tabBar和显示与隐藏tabBar
（1）设置tabBar：
uni.setTabberItem({});
wx.setTabberItem({});
indexnumber是tabBar 的哪一项，从左边算起，索引从0开始textstring否tab 上按钮文字iconPathstring否图片路径selectedIconPathstring否选中时的图片路…
uniapp微信小程序《隐私保护协议》弹窗处理流程
背景 《关于小程序隐私保护指引设置的公告》 《小程序隐私协议开发指南》
流程
1.第一步 必须设置且审核通过！！！ 2.第二步
uniapp在manifest.json中添加！！！
/*
在 2023年9月15号之前，在 ap…
uniapp获取接口数据并渲染至页面中
在UniApp中获取接口数据并渲染到页面中，你可以按照以下步骤进行操作：
在Vue组件的data中定义一个用于存储接口数据的变量。示例代码如下：
export default {data() {return {dataList: [] // 存储接口数据的数组}},// ...
}在上述示例中&…
uniapp:tabBar点击后设置动画效果
APP端不支持dom操作，也不支持active伪类，绞尽脑汁也没办法给uniapp原生的tabBar点击加动画效果，所以最终只能舍弃原生tabBar，改用自定义tabBar。
自定义tabBar的原理是，页面的上部分分别是tabBar对应的页面组件&#…
uni-app：实现背景渐变效果
效果 代码
单个渐变色 background-image: linear-gradient(to top right, #f00, #00f); 多个渐变色 background-image: linear-gradient(to bottom, #0073ff 0%, #1d6cff 25%, #1e8bff 50%, #41b3ff 100%); /* 多个渐变色 */ <template><view></view>
<…
uni-app：顶部标题栏的部分相关设置（标题更改， 加载效果）
一、标题更改
效果 方法一：在pages.json中进行修改 {"path": "pages/index/index","style": {"navigationBarTitleText": "自定义标题"}
},
方法二：在页面直接进行修改
onLoad() {// 设置页面的标…
uni-app：canvas绘制图形3
效果 代码
<template><view><!-- 创建了一个宽度为300像素，高度为200像素的canvas元素。canvas-id属性被设置为"firstCanvas"，可以用来在JavaScript中获取该canvas元素的上下文对象。 --><canvas style"width:200…
uniapp ui安装 阿里图标库使用 报错 Assignment to constant variable.
安装 ui uni-app官网 (dcloud.net.cn)
（一）安装 pages.js配置 安装 sassnpm i sass -D 或 yarn add sass -D 安装 sass-loader
npm i sass-loader10.1.1 -D 或 yarn add sass-loader10.1.1 -D安装 uni-uinpm i dcloudio/uni-ui 或 yarn a…
uniapp：如何修改组件默认样式
日历组件默认样式如下图，但是我不想要右上角的红点，并且日期下面的数字要加红色背景，变成圆形，还是先用元素检查找到元素的类名，然后通过/deep/来覆盖样式，需要注意的是，lang要scss或者less&…
uniapp小程序与webview通信（二）
前面**uniapp小程序与webview通信（一）**说到了uniapp给webview的传参，本篇说说webview如何给uniapp传参
1.同样地，webview的页面也要引入uniapp的SDK：
<script type"text/javascript" src"https:/…
uniapp 之 本地存储
uniapp 之 本地存储
uniapp如何本地存储
uniapp是一种跨平台的开发框架，它被广泛用于开发基于微信小程序、H5、Android和iOS等平台的应用。随着应用越来越复杂，数据的存储成为一个必须考虑的问题。而本地存储是一种常见的数据存储方式，可以…
uni-app：canvas-图形实现1
效果 代码
<template><view><!-- 创建了一个宽度为300像素，高度为200像素的canvas元素。canvas-id属性被设置为"firstCanvas"，可以用来在JavaScript中获取该canvas元素的上下文对象。 --><canvas style"width:200p…
uni-app 之 短信验证码登录
uni-app 之 短信验证码登录 image.png image.png <template><view style"width: 100%; display: flex; flex-direction:column; align-items:center;"><view style"width: 300px; margin-top: 100px;"><!-- // --><!-- 1&#…
uniapp使用scroll-into-view实现锚点定位和滚动监听功能【楼层效果 / 侧边导航联动效果】
大佬网址：
https://blog.csdn.net/weixin_47136265/article/details/132303570
效果 代码
<template><!-- 这里面有2个bug，已经解决，需要知道的地方1.methods里的scrollEvt(e)方法里面的 this.tabIndex index ! -1 ? index :…
uni-app：实现页面效果2（canvas绘制，根据页面宽度调整元素位置）
效果 代码
<template><view><!-- 车搭配指示器-双显 --><view class"content_position"><view class"content"><view class"SN"><view class"SN_title">设备1</view><view class…
uniapp h5 端 router.base设置history后仍有#号
manifest.json文件设置：
"h5": { "router": { "base": "./", "mode": "history" },
}按相对路径发行时路由模式强制为hash模式，不支持history模式（两者相悖）…
uniapp中tabbar导航的点击事件
onTabItemTap : function(e) {console.log(e);// e的返回格式为json对象： {"index":0,"text":"首页","pagePath":"pages/index/index"}
},index：点击的序号，从0开始
pagePath：…
uniapp 获取地理位置（uni#getLocation和高德sdk获取中文地址）
参考
https://uniapp.dcloud.net.cn/api/location/location.html
https://ask.dcloud.net.cn/article/35070
1. uniapp api获取经纬度
uni.getLocation({type: wgs84,success: function (res) {console.log(当前位置的经度： res.longitude);console.log(当前位…
![uni-app开发微信小程序的报错[渲染层错误]排查及解决](https://img-blog.csdnimg.cn/e25d1be8ff3f45fe933fca768fa4a963.png#pic_center)
uni-app开发微信小程序的报错[渲染层错误]排查及解决
一、报错信息
[渲染层错误] Framework nner error (expect FLOW INITIALCREATION end but get FLOW CREATE-NODE)
二、原因分析及解决方案
第一种 原因：基础库版本的原因导致的。 解决： 1.修改调试基础库版本 2.详情—>本地设置—>调试基础库…
uniapp 运行到 app 报错 Cannot read property ‘nodeName‘ of null
uniapp 运行到某一个页面，报错，h5没有问题 Unhandled error during execution of scheduler flush. This is likely a Vue internals bug. Please open an issue at https://new-issue.vuejs.org/?repovuejs/coreat <GuiPagecustomHeadertruecustomF…
Uniapp路由拦截-自定义路由白名单
步骤一：新建routerIntercept.js文件 步骤二：routerIntercept文件中写入：（根据自己需要修改whiteList白名单中的页面路径和自己的逻辑处理）
import Vue from vue
// 白名单
const whiteList = [/pages/public/login,/pages/public/privacyAgreement,
]export default asy…
uniapp打包配置
安卓： 首先不管是什么打包都需要证书，安卓的证书一般都是公司提供或者自己去申请。然后把包名等下图框住的信息填上，点击打包即可。
ios：ios需要使用mac到苹果开发者平台去申请证书，流程可以参考下边的链接 参考链接…
uniapp开发H5微信公众号,使用微信的扫一扫等Api试错
记录使用uniapp开发H5微信公众号,有些业务需要用到一些API，比如扫码，h5和微信小程序，app在使用过程中有有些不同，h5使用需要单独引入微信的jsdk,才能使用否则会报错无法使用 引入微信jsdk
npm安装
npm install jweixin-module -…
uni-app：实现页面效果1
效果 代码
<template><view><view class"add"><image :src"add_icon" mode""></image></view><view class"container_position"><view class"container_info"><view c…
uniapp项目实践总结(二十四)安卓平台 APP 打包教程
导语：当你的应用程序开发完成后，在上架安卓应用商店之前，需要进行打包操作，下面简单介绍一下打包方法。 目录 准备工作配置项目生成证书打包配置准备工作
在打包之前，请保证你的 uniapp 应用程序编译到安卓手机模拟器的 App 是可以正常运行的，APP 打包分为安卓和 ios 两…
uniapp-vue3-微信小程序-按钮组wo-btn-group
采用uniapp-vue3实现, 是一款支持高度自定义的按钮组组件，支持H5、微信小程序（其他小程序未测试过，可自行尝试） 可到插件市场下载尝试： https://ext.dcloud.net.cn/plugin?id15012
使用示例 <template><vie…
Uniapp小程序 时间段选择限制（开始时间 结束时间相互限制）
实现效果： 这里我使用的是uview2.0的DatetimePicker 选择器，实现开始时间与结束时间相互限制的效果，接下来简单看下实现的代码吧，首先看下选择器组件以及相关参数值的初始化 <!-- 时间选择-开始 -->
<u-datetime-picker …
uni跳转页面不缓存上一个页面的方法
一、前言
要实现一个需求，从a页面跳转到b页面，从b页面跳转到c页面，然后按返回，从c页面直接返回a页面（不返回b页面）
a->b->c
c->a
二、实现方法
前端框架使用的是uni-app，我们修改…
uni-app 实现凸起的 tabbar 底部导航栏
效果图 在 pages.json 中设置隐藏自带的 tabbar 导航栏
"custom": true, // 开启自定义tabBar(不填每次原来的tabbar在重新加载时都回闪现) 新建一个 custom-tabbar.vue 自定义组件页面
custom-tabbar.vue
<!-- 自定义底部导航栏 -->
<template><v…
uni-app：js修改元素样式（宽度、外边距）
效果 代码 1、在<view>元素上添加一个ref属性，用于在JavaScript代码中获取对该元素的引用：<view ref"myView" id"mybox"></view> 2、获取元素引用 ：const viewElement this.$refs.myView.$el; 3、修改…
Uniapp 婚庆服务全套模板前端
包含 首页、社区、关于、我的、预约、订购、选购、话题、主题、收货地址、购物车、系统通知、会员卡、优惠券、积分、储值金、订单信息、积分、充值、礼品、首饰等
请观看 图片参观 开源，下载即可
链接：婚庆服务全套模板前端 - DCloud 插件市场
问题反…
uni-app：引入echarts（使用renderjs）
效果 代码
<template><view click"echarts.onClick" :prop"option" :change:prop"echarts.updateEcharts" id"echarts" class"echarts"></view>
</template><script>export default {data()…
uniapp下拉刷新
为什么要使用uniapp的下拉刷新呢 跨平台兼容性： Uniapp 允许你一次编写代码，然后在多个平台（如微信小程序、H5、iOS 和 Android 等）上运行。使用 Uniapp 的下拉刷新功能，可以确保在不同平台上都能提供一致的用户体验&a…
uniapp中使用编辑器editor
1.需求：
开发小程序时，想要在手机上添加编辑内容，使用u–textarea时，换行操作不显示，为此使用了uniapp自带的组件editor来实现：
2.使用：
<template><view class"">&l…
uniapp apple 苹果登录 离线本地打包
官方文档 uni-app官网
文档写的不全，没有写离线打包流程
加lib 签名里带 sign in with apple hbuilder开关
代码
测试代码，获取app里所有的provider
uni.getProvider({service: oauth,success: function (res) {console.log(res.provider)uni.showT…
前端uniapp生成海报并保存相册
uiapp插件 目录 图片qrcode.vue源码完整版封装源码qrcodeSwiper.vue最后 图片 qrcode.vue源码完整版
<template><view class"qrcode"><div class"qrcode_swiper SourceHanSansSC-Normal"><!-- <cc-scroolCard :dataInfo"dat…
前端uniapp如何修改下拉框uni-data-select下面的uni-icons插件自带的图片【修改uniapp自带源码图片/图标】
目录 未改前图片未改前源码未改前通过top和bottom 和修改后图片转在线base64大功告成最后 未改前图片 未改前源码
然后注释掉插件带的代码，下面要的
未改前通过top和bottom 和修改后
找到uni-icons源码插件里面样式 图片转在线base64
地址 https://the-x.cn/b…
uniapp微信小程序之分包异步化之组件分包
一、组件分包异步化解决的问题 日渐增加的通用组件造成的主包空间不足； 提升小程序访问速度，降低白屏率； 二、开启组件分包异步化过程中遇到的问题 如何进行占位组件配置； 如何解决通过$refs访问异步组件报错； 如何判断所有异步组件都已加载完毕； 多分包组件之间互相调用…
geecg-uniapp 路由修改 页面创建 （2）
首先打开 首页面
（1）我们以home的常用服务 为例 我们修改 usList 数据 （2）查找对应路径 work.js 我们修改荒石对应的路径 现在跳转 helloword （3）修改跳转路径 （4）创建页面 …
uniapp云打包app使用sqlite实现本地缓存，以及云打包sqlite不生效踩坑记录
文章目录 一、uniapp中使用sqlite1.什么是sqlite2.如何在uniapp中使用sqlite 二、云打包sqlite的坑1. sqlite模块找不到2. 勾选了模块，打包之后sqlite不生效。1. 可能是db文件的存储路径问题，具体如下：2. 可能没有自动创建库文件3. 在onload钩…
uniapp：使用subNVue原生子窗体在map上层添加自定义组件
我们想要在地图上层添加自定义组件，比如一个数据提示框，点一下会展开，再点一下收起，在h5段显示正常，但是到app端真机测试发现组件显示不出来，这是因为map是内置原生组件，层级最高，自…
uniapp开发h5 监听用户物理返回键 类似拼多多返回后弹窗
uniapp有个onBackPress生命周期 但是h5中只能监听到navbarr左边的返回按钮以及uni.navigateBack() 方法 h5既然监听不到物理返回键，那么用户点击了物理返回键自然会路由返回上一页，那么我们监听路由，由于路由是uni自己封装的，我测…
uni-app医院智能导诊系统源码
随着科技的迅速发展，人工智能已经逐渐渗透到我们生活的各个领域。在医疗行业中，智能导诊系统成为了一个备受关注的应用。本文将详细介绍智能导诊系统的概念、技术原理以及在医疗领域中的应用，分析其优势和未来发展趋势。 智能导诊系统通过人工…
uni-app编程checkbox-group获取选中的每个checkbox的value值
uni-app编程checkbox-group获取选中的每个checkbox的value值_uniappcheckboxvalue-CSDN博客
uniapp开发h5项目引入weixin-sdk报错wx.miniprogram undefined
1、当前用法<script type"text/javascript" src"https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>html引入静态不行解决方案APP.vue：// #ifdef H5onLaunch: function () {const script document.createElement(script)…
Uniapp 跳转回上一页面并刷新页面数据
比如我从A页面跳转到B页面 然后再从B页面返回到A页面 顺带刷新一下A页面数据 let pages getCurrentPages(); // 当前页面 //获取当前页面栈let beforePage pages[pages.length - 3]; // //获取上一个页面实例对象beforePage.$vm.reloadList(); //调用它方法然后跳转…
uni-app集成uni-simple-router，报错：Uncaught ReferenceError: ROUTES is not defined
参考连接：GitHub - SilurianYang/uni-read-pages: read pages.json file to generate the routes table
作用：配置 vue.config.js 通过 webpack注入全局变量 问题：缺少Webpack 配置环境 方法：
项目根目录下打开终端，…
uni-app/vue 文字转语音朗读（附小程序语音识别和朗读）uniapp小程序使用文字转语音播报类似支付宝收款播报小程序语音识别和朗读）
uni-app/vue 文字转语音朗读（小程序语音识别和朗读）
uniapp小程序功能集合
1、uniapp小程序文字转语音播报
一、第一种方式：直接加语音包
固定的文本 先利用工具生成了 文本语音mp3文件，放入项目中，直接用就好了
…
uni-app通过 vuedraggable 创建上下拖动排序组件
我们右键项目 选择 使用命令行窗口打开所在目录 然后 在终端中输入
npm install vuedraggable --save导入 vuedraggable 然后组件编写代码如下
<template><view class"container"><draggable v-model"list" :options"dragOptions&…
uniapp collapse动态生成多个折叠面板手动展开收起（包括uni-ui版）
前言 官方文档没有暴露出相关api，那就看看组件源码。 以下示例均通过 vue-cli 创建的 uni-app h5 项目 uView（1.x）版本
源码 node_modules\uview-ui\components\u-collapse-item\u-collapse-item.vue 这个方法是用来改变折叠面板子组件收起还…
uniapp开发小程序 小米手机真机bottom:0无效 底部间隙 设备安全区域处理办法
uniApp自定义导航 CSS设置 bottom:0竟然无效，而iphone和开发模拟器没有问题 height: 150rpx;position: fixed;left: 0;right: 0;bottom: calc(var(--window-bottom,0));
网上查了各种方法，包括设置bottom:-20啊以及
padding-bottom: constant(safe-are…
uniapp高德地图ios 使用uni.chooseLocation选取位置显示没有搜索到相关数据
uniapp云打包后，高德地图ios选取位置显示“ 对不起，没有搜索到相关数据” 详细问题描述 废话不多说，直接上图 解决方案
1.打开高德地图开发平台 2.重新创建key 3.获取云打包时的ios报名作为安全码 4.使用生成的高德key更改manifest.json里…
Vue（uniapp）父组件方法和子组件方法执行优先顺序
涉及到的知识点：watch监控：先看问题，父组件从后端通过$ajax获取数据，在将父组件将值传输给子组件，使用子组件使用created钩子函数获取数据，按自己的想法应该是父组件先获取后端数据，在传入给子组…
【uniapp】html和css-20231031
我想用控件和样式来表达应该会更贴切，html和css的基础需要看看。 关于html：https://www.w3school.com.cn/html/html_layout.asp 关于css：https://www.w3school.com.cn/css/index.asp html让我们实现自己想要的布局（按钮࿰…
uniapp自定义右击菜单
效果图： 代码：
1、需要右击的view:
<view class"answer-box" contextmenu.stop.prevent.native"showRightMenu($event, item, content)">
</view>2、右击弹出层：
<view v-if"visible" :styl…
uniapp——自定义组件插槽及使用
案例样式 自定义组件pageBox.vue
<template><view><view class"bgColor" :style"{ height: bgHeight rpx }"></view><view class"main"><!-- 主要内容放这里 --><slot></slot></view>&…
uniapp中nvue页面使用fixed后，数据更改不更新到该视图。
解决方案：position: fixed;定位改成position: absolute;
记录一下，遇到这个贼离谱的问题，uniapp项目里的nvue页面因为要弄个引导蒙版，所以使用了fixed定位，点击蒙版关闭，加了this.$forceUpdate()也不行&am…
uniapp 单选框以及多选框样式更改
radio以及checkbox默认样式不符合自身需求时，根据自身需求更改样式，以下是自身的示例：
单选：
多选：
由于uniapp自身包含了一套默认的样式，所以如果不想全局更改只想在某个单据页面使用的话，就…
uniapp 中添加 vconsole
uniapp 中添加 vconsole
一、安装 vconsole
npm i vconsole二、使用 vconsole
在项目的 main.js 文件中添加如下内容
// #ifdef H5
// 提交前需要注释 本地调试使用
import * as vconsole from "vconsole";
new vconsole() // 使用 vconsole
// #endif三、成功
Android原生项目集成uniMPSDK(Uniapp)遇到的报错总结
uni小程s序SDK 集成到Android原生项目:老项目中用到的库较多，会出现几种冲突问题，总结如下： 报错1：
Execution failed for task :app:processDebugManifest. > Manifest merger failed with multiple errors, see logs
Andro…
uni-app小程序，uview-ui组件样式无法穿透修改的解决办法
1.首先设置以下选项.该选项的作用是让微信小程序允许样式穿透.
在需要改动的文件内加上 options: { styleIsolation: shared }
2.然后再使用vue的样式穿透写法.
::v-deep .类样式{} 或者 /deep/ .类样式{}
【易售小程序项目】后端部署、Uniapp项目Web部署
Uniapp项目Web打包部署
为什么不部署小程序
因为小程序部署审核比较严格，还需要备案，而且我现在还没有完全开发完成（研究生开学之后，基本没有时间开发了），到时候再摸索一下吧。之所以还没有开发完成我就部…
uni-app--》基于小程序开发的电商平台项目实战（三）
🏍️作者简介：大家好，我是亦世凡华、渴望知识储备自己的一名在校大学生 🛵个人主页：亦世凡华、 🛺系列专栏：uni-app 🚲座右铭：人生亦可燃烧，亦可腐败…
【匠心打造】从0打造uniapp 可视化拖拽设计 c_o 第十篇
一、click one for uniapp置顶： 全部免费开源 (你商业用途也没关系，不过可以告诉我公司名或者项目名，放在官网上好看点。哈哈-_-) 二、写在之前
距离上一篇更新已经大约4个月了，公司的事情，自己的一些琐事一直没时间…
记录UNIAPP打包苹果iOS·APP
用到生成的四个文件：1-1.CSR证书文件、2-2.CER证书文件、3-3.PP文件【证书Profiles文件】、4-4.P12文件【证书私钥】
1. 生成CSR证书文件： 2. 操作苹果后台：Sign In - Applehttps://developer.apple.com/account/resources/certificates/list
最新Uniapp软件社区-全新带勋章源码
测试环境：php7.1。ng1.2，MySQL 5.6 常见问题： 配置好登录后转圈圈，检查环境及伪静态以及后台创建好应用 上传图片不了，检查php拓展fileinfo 以及public文件权限 App个人主页随机背景图，在前端uitl文件夹里面…
uniapp 常见的问题以及解决办法
当开发UniApp时，可能会遇到一些常见问题。以下是一些常见问题及其解决办法：
1. 页面或组件无法正常显示
确保页面或组件的路径和文件名的大小写正确。检查模板代码中是否存在错误或不完整的标签闭合。使用调试工具（如Chrome开发者工具&…
uniapp 使用 UDP
一、搭建UDP服务端，nodejs
const dgram require("dgram");const message Buffer.from("你好，这是一个UDP广播消息");
const port 3000; // 用你想要的端口替换这里// 创建一个UDP套接字
const socket dgram.createSocket("…
uniapp/H5富文本复制文本功能
代码实现：
copy() {let replacedContent this.form.resTaskBaseInfoDetail.content;let text readHtml(replacedContent)// #ifdef H5let textarea document.createElement("textarea")textarea.value texttextarea.readOnly "readOnly"d…
uniapp原生插件之安卓获取设备唯一标识
插件介绍
安卓获取设备唯一标识，集成了获取imei，获取安卓ID，获取GUID，获取获取OAID/AAID等
插件地址
安卓获取设备唯一标识 - DCloud 插件市场
超级福利
uniapp 插件购买超级福利
详细使用文档
uniapp 安卓获取设备唯一标…
Vue或uniapp引入自定义字体
一、为什么引入字体
对于大部分APP或网站而言，字体是很重要的一部分。在前端开发中，选用合适的字体往往会极大地提升网站的视觉体验。然而，网页中默认字体的种类和风格有限，且在不同的设备、浏览器上渲染效果不尽相同。因此&…
uniapp微信小程序自定义封装分段器。
uniapp微信小程序自定义封装分段器。
话不多说先上效果 这里我用的是cil框架 vue3 下面贴代码 组价代码：
<template><view class"page"><viewv-for"(item, index) in navList":key"index"click"changeNav(ind…
uni-app集成使用SQLite
一、打开uni-app中SQLite 二、封装sqlite.js module.exports {dbName: chat, // 数据库名称dbPath: _doc/chat.db, // 数据库地址,推荐以下划线为开头 _doc/xxx.db/*** Description: 创建数据库 或 有该数据库就打开* author: ZXL* createTime: 2023-10-12 09:23:10* Copyr…
uni-app 实现图片上传添加水印操作
一、定义一个canvas标签，微信小程序的实现方式有所变动 <!-- #ifdef MP-WEIXIN --><canvas type"2d" id"upload-canvas" class"uploadCanvas" :style"{width:widthpx,height:heightpx,position:absolute,z-index:-999,…
uniapp编译到小程序Component is not found in path “components/energy/illumination“
Component is not found in path "components/energy/illumination"
直接清除缓存重新编译
uniapp小程序实现绘制内容,生成海报并保存截图(Painter和Canvas两种方式举例)
一、Painter方法
Painter插件传送门
1.下载资源包 2.将资源包的如下部分 3.使用页面引入组件 ui样式
<paintercustomStyle=margin-left: 40rpx; height: 1000rpx;palette="{{palette}}"bind:imgOK="onImgOK"/>data 中数据(绘制内容,替换区域) pai…
uniapp自定义权限菜单，动态tabbar
已封装为组件，亲测4个菜单项目可以切换， 以下为示例，根据Storage 中 userType 的 值，判断权限菜单
<template><view class"tab-bar pb10"><view class"tabli" v-for"(tab, index) in ta…
【unaipp】tabBar配置/tabBar图标无法显示
bug：注意list配置iconfont我们自定义的图标就会无法显示 "tabBar": {"color": "#7A7E83","selectedColor": "#3cc51f","borderStyle": "black","backgroundColor": "#ffffff…
uni-app项目 前端加前缀(包括页面及静态资源)
具体步骤
参考： https://www.jianshu.com/p/f1fe5daa3a3c
manifest.json 文件##
位置如下：
"h5" : {"title" : "物业公告","router" : {"mode" : "history", //采用history模式URL的路…
uniapp之 使用map组件有个小报错
怎么说 getLocation:fail the api need to be declared in the requiredPrivateInfos field in app.json/ext.json getLocation:失败的api需要在app.json/ext.json的requiredPrivateInfos字段中声明
解决办法
在 "requiredPrivateInfos": ["getLocation"…
[uni-app] 防重复点击处理 - 自定义指令
一般用节流防抖的方式处理, 这里通过vue的自定义指令方式也可以
实现:
import Vue from vue
// 自定义指令防止按钮重复点击 v-debounceconst debounce {install(Vue) {// 防止重复点击Vue.directive(debounce, {inserted: function(el, binding) {el.addEventListener(clic…
uni-app 开发的H5 定位功能部署注意事项
一、H5部署的时候，如果设计到定位功能，需要注意以下几点
1、打包部署的时候需要在Web配置-定位和地图里面勾选一个地图，并配置key 2、打包部署需要域名是https协议的，大多数现代浏览器要求在HTTPS协议下才能够访问地理位置信息&a…
uniapp踩坑之项目：uniapp数字键盘组件—APP端
//在components文件夹创建digitKeyboard文件夹，再创建digitKeyboard.vue <!-- 数字键盘 -->
<template><view class"digit-keyboard"><view class"digit-keyboard_bg" tap"hide"></view><view clas…
uniapp原生插件之安卓文字转拼音原生插件
插件介绍
安卓文字转拼音插件，支持转换为声调模式和非声调模式，支持繁体和简体互相转换
插件地址
安卓文字转拼音原生插件 - DCloud 插件市场
超级福利
uniapp 插件购买超级福利
详细使用文档 uniapp 安卓文字转拼音原生插件
用法
在需要使用插…
uniapp实现微信授权（前后端）
在使用UniApp开发微信小程序时，实现微信授权登录是一个常见的需求。本文将介绍如何在UniApp中实现微信授权登录，并涵盖前后端的实现步骤。
1. 后端配置 首先，我们需要在后端进行相关配置和处理。
在微信公众平台申请开发者账号，…
无需更换vue-cli 脚手架 uniapp-搭建项目-H5-低版本安卓IOS兼容问题（白屏）（接口请求异常）
✨求关注~ 💻博客：www.protaos.com I. 简介 A. UniApp项目概述 B. 白屏和接口请求异常问题的背景
II. 白屏问题 A. 问题描述 1、uniapp 打包H5内嵌入APP内、低版本手机系统访问白屏问题 B. 问题根本原因 1、低版本手机系统 自带的webview内核不支持ES6语…
2023每年最难忘的一天，今年特别的特别寡助之至，亲戚畔之：您就是那个典型反面教材啊
为孝维持的婚姻。仅此而已了。 其他多想无益，甚至于say 无济于事。不如做事。做事开发游戏的继续推进进度啊！ 最明智的做法，明智之举，就是靠拼您个人啊！ 您以为呢？！ 谁都靠不住，…
uni-app 中如何实现数据组件间传递？
在 uni-app 中，实现数据组件间传递可以使用 Props 或 Vuex。
Props 是一种组件通信的方式，通过向子组件传递数据来实现组件间的数据传递。下面是一个示例：
父组件：
<template><child :message"hello">&l…
0002Java安卓程序设计-基于Uniapp+springboot菜谱美食饮食健康管理App
文章目录 开发环境 《[含文档PPT源码等]精品基于Uniappspringboot饮食健康管理App》该项目含有源码、文档、PPT、配套开发软件、软件安装教程、项目发布教程、包运行成功 编程技术交流、源码分享、模板分享、网课教程 🐧裙：776871563
功能介绍ÿ…
uniapp使用抖音微信自定义组件
tt.vue中使用video-player组件
用到的目录如下： pages.json {"path": "pages/Tabbar/tt/tt","style": {"navigationBarTitleText": "","enablePullDownRefresh": false,// 使用自定义组件"using…
基于Android校园交流uniAPP+vue 微信小程序v7e1
本系统结合现今XX校园交流APP的功能模块以及设计方式进行分析，使用Android平台和Ssm框架进行开发设计，具体研究内容如下： (1) 系统管理员主要对用户管理、类型管理、娱乐天地管理、投诉举报管理、学习平台、我的收藏管理、系统管理等功能进…
uniapp前端微信支付代码
1.支付按钮，定义支付事件
<u-button text"立即抢购" click"payTap" shape"circle" color"#E10000"></u-button>2.支付事件 // 这些参数根据后端需要什么就传什么，一般有用户id和订单号就行&#x…
uniapp小程序使用web-view组件页面分享后，点击没有home小房子解决办法
uniapp小程序使用web-view组件页面分享后，点击没有home小房子解决办法
小程序 ：IOS 测试正常， 安卓 不显示home
微信小程序使用的是全局自定义导航，通过首页 banner 跳转到一个 web-view 页面，展示官网。 web-view 页…
uniapp小程序才到第五层就报错navigateto:fail webview count limit exceed
错误截图
原因 小程序官方描述是说可以跳转10层，但是使用uniapp开发的程序在小程序中才运行到第五层就报错了，原因是因为没有设置appId。如果设置了就正常了。
uniapp小程序v-for提示“不支持循环数据”
问题描述:
在uniapp小程序项目中使用多层for循环时，小程序端提示：uniapp v-for 暂不支持循环数据，以至于获取不到循环的数据。
<view v-for"(item,index) in list" :key"item.id"> <view v-for"child i…
uniapp 请求接口的方式
在UniApp中，我们可以使用多种方式来发送请求接口。以下是几种常用的方式：
1、使用unmireuest方法:uni.reuest是uniApp提供的原生AP，可以发送HTTP请，我们可以通过传递一个图对象来设置请求的参数，RL、请求方法GET/POST…
【uniapp】解决在H5谷歌浏览器下 u-input 标签 设置只读后,click事件不生效
【问题描述】 谷歌浏览器更新后，h5模式下原本的input外层view中的click事件不触发了?? 但是更换浏览器后就可以，打包app也是正常可以触发的，本来是没打算兼容h5，既然遇到了就记录一下~ 【解决办法】 使u–input里写上readonly&…
uni-app：引用文件的方法
绝对定位 ①import common from "/utils/common.js" ②import common from "utils/common.js" <template><view></view>
</template>
<script>import common from "/utils/common.js"export default {data() {ret…
uni-app基于vue实现商城小程序
一、前言
参考“网易严选”小程序
项目采用传统vue项目结构，即uni-app打包和运行成小程序，使用HBuilder开发工具开发项目，通过运行启动“微信开发者工具”完成项目启动。
二、功能效果图
1.首页 2.分类 3.活动 4.我的 5.商品详情 6.购物车…
UNIAPP框架中使用BLE蓝牙连接
概述
蓝牙连接包括搜索蓝牙设备，选择蓝牙设备，监听设备特征值，发送命令，断开蓝牙连接5种基础方法。Uni-App BLE 文档地址搜索设备时
搜索蓝牙设备
function discoveryDevices(pushDevice){console.log(enter search ble blueto…
uniapp中picker 获取时间组件如何把年月日改成年月日默认时分秒为00:00:00
如图所示，uniapp中picker组件的日期格式为：
但后端要 2023-11-08 00:00:00格式 如何从2023-11-08转化为 2023-11-08 00:00:00：👇
const date new Date(e.detail.value);//"2023-11-17"
date.setHours(0, 0, 0);
// 2…
uniapp H5预览PDF支持手势缩放、分页、添加水印、懒加载、PDF下载
效果预览 项目说明 uniapp vue2 node：v14.18.3 npm： 6.14.15 安装pdfh5.js插件 pdfh5 - npm (npmjs.com)pdfh5.js 基于pdf.js和jQuery pdfh5 - npm (npmjs.com) npm install pdfh5 由于我安装最新的pdfh5.js后运行时报错 所以我选择降低版本,可能是node…
uniapp：打包ios配置隐私协议框
使用uniapp打包ios 上架商店需要配置隐私协议政策弹窗。当用户点击确定后才能继续操作。 首先manifest.json中配置使用原生隐私政策提示框是不支持ios的。不用勾选。
解决思路： 1、新建页面：iosLogin.vue，pages.json中 这个页面需要放在第一…
Capacitor 打包 h5 到 Android 应用，uniapp https http net::ERR_CLEARTEXT_NOT_PERMITTED
Capacitor 打包 h5 到 Android 应用，uniapp https http net::ERR_CLEARTEXT_NOT_PERMITTED capacitor 官网： https://capacitorjs.com/docs/ 项目上需要做一个 app，而这个 app 是用 uniapp 做的，里面用到了一个依赖 dom 的库&…
uniapp获取Android硬件的uuid，附：网络的判断
Android设备的UUID（Universally Unique Identifier）是一个128位的标识符，通常用于识别物体、应用程序、服务等，Android设备通常有多种方式来生成UUID，例如使用设备的硬件信息、操作系统信息、应用程序信息等。然而&…
【uniapp】uview1.x使用upload上传图片
和2.x不同的是，要用 action 来配置后端上传图片的接口地址； 再来一些配置项的命名有所不同，一般1.x的命名用 -，2.x的命名使用小驼峰； 1.x 的上传会自带删除时的提示框，2.x 没有；
重要的几个配置…
uniapp实现瀑布流
首先我们要先了解什么是瀑布流：
瀑布流（Waterfall Flow）是一种常见的网页布局方式，也被称为瀑布式布局或砌砖式布局。它通常用于展示图片、博客文章、商品等多个不同大小和高度的元素。
瀑布流布局的特点是每个元素按照从上到下…
【uniapp】JavaScript基础学习-20231027
今天有找到一个比较好的网站 https://www.w3school.com.cn/js/index.asp 介绍也全面，内容也比较多。我觉得把最基本的语法看看，然后可以上手写代码了。其他的就是需要靠长期的学习和积累了。 基础语法的使用： 1、定义一个变量 2、对变量赋值 …
uniapp保存网络图片
先执行下载uni.downloadFile接口，再执行保存图片uni.saveImageToPhotosAlbum接口。 // 保存二维码
saveQrcode() {var _this this;uni.downloadFile({url: _this.qrcodeUrl, //二维码网络图片的地址success(res) {console.log(res);uni.saveImageToPhotosAlbum({fi…
决定放弃uniapp开发了，因为它实在是没有taro友好
被uniapp折腾了两天，实在是受不了它对vue3的支持和react的支持，可以这么说，uniapp完全没有支持vue3和react，这么说我觉得一点也不过分。相对于折腾了两天uniapp来讲，我使用taro只花了1个小时不到，就可以完美…
uniapp开发微信小程序uview里的u-upload组件上传图片点击没反应，开发者工具点击正常，正式上手机上点击没反应
项目场景：
用uniapp开发的微信小程序，uview插件ui，u-upload上传文件，上传头像等方法，早就审核发布过的突然反应上传图片，文件啥的点击没反应
问题描述 原因分析： 根据查资料得知可能是因为小程…
uniapp使用vur-cli新建项目并打包
新建项目
npm install -g vue/cli
vue create -p dcloudio/uni-preset-vue my-project选择默认模板npm run dev:h5 运行
安装sass和uview （npm安装失败）
bug：使用uni.scss中的变量或样式，<style lang"scss"> 必…
❤ Uniapp使用Ucharts（二）（组件类型）
❤ Uniapp使用Ucharts（二）（秋云组件类型）
一、折线图
1、结构
<template><view class"charts-box"><qiun-data-charts type"area":opts"opts":chartData"chartData"/&…
uniapp中使用图片网络路径使用不了解决方法
uniapp中使用图片网络路径使用不了解决方法：
使用uni.getImageInfo()调用一下网络路径使用临时路径图片可以使用；
uni.getImageInfo({src: this.merchantInfo.cdn_static statistics/luckDrawImg/scratchcard/scratchingBefore.png,success: …
uni-app发布后iOS端页面背景图片上下滑动问题
问题分析
uni-app发布后iOS端页面背景图片会跟着上下滑动。
解决方案
添加配置bounce
{"pages": [{"path": "pages/login/login","style": {"navigationStyle": "custom","navigationBarTitleText"…
在uniapp中通过自定义事件使页面之间传递数据
在uniapp中，可以使用uni.$emit来在页面之间传递数据。uni.emit是一个事件触发器，可以在一个页面中触发一个自定义事件，并在其他页面中监听和处理这个事件。
// A页面
uni.$emit(dataChanged, { message: Hello from A page! });在接收数据的…
在 uniapp 中 一键转换单位 (px 转 rpx)
在 uniapp 中 一键转换单位 px 转 rpx Uni-app 官方转换位置利用【px2rpx】插件Ctrl S一键全部转换下载插件修改插件 Uni-app 官方转换位置
首先在App.vue中输入这个：
uni.getSystemInfo({success(res) {console.log("屏幕宽度", res.screenWidth) //屏…
uniapp h5发行
前端使用uniapp开发项目完成后，需要将页面打包，生成H5的静态文件，部署在服务器上。 这样通过服务器链接地址，直接可以在手机上点开来访问。
打包全步骤如下：
首先在manifest.json文件中进行基础配置，获取…
uniapp的实战总结大全
🙂博主：冰海恋雨 🙂文章核心：uniapp部分总结
目录
编辑
目录
前言：
解决方案
1. 跨平台开发
2. Vue.js生态
3. 组件库
4. 自定义组件
5. Native能力
6. 插件生态
7. 性能优化
写法
1. 模板…
uniapp 微信小程序分享功能 onShareAppMessage(options)
一、背景
在微信小程序中需要完成转发分享功能，接收人未登录小程序情况下，在微信上打开不用强制登录，可以查看部分分享的内容；如果用户要查看更多内容，可以点击【查看全部】按钮，触发登录逻辑，…
uniapp生成自定义(分享)图片并保存到相册
需求描述 在一个页面中底部有个保存图片的功能，点击能够保存一张生成的自定义表格图片。 第一眼见到这个需求 自己会出现了两个问题
如何去处理图片中的自定义内容以及样式如何将自定义内容转化成图片 至于保存图片，uniapp有对应的api去实现uni.saveIma…
uniapp 跨页面传值及跨页面方法调用
uniapp 跨页面传值及跨页面方法调用
1、跨页面传值
使用全局方法监听uni.$emit、uni.$on、uni.$off 发布、监听、移除
methods: {addFun(){let data [1]uni.navigateBack({ // 返回上一页delta: 1})uni.$emit(successFun,{data}) // 传值}
}监听页
onLoad() {uni.$on(succ…
uniapp app tabbar 页面默认隐藏
1.在page.json 中找到tabbar visible 默认为true,设为false则是不显示
uni.setTabBarItem({ index: 1, //列表索引 visible:true //显示或隐藏 })
Uniapp连接iBeacon设备——实现无线定位与互动体验（实现篇）
export default { data() { return { iBeaconDevices: [], // 存储搜索到的iBeacon设备 deviceId: [], data: [], url: getApp().globalData.url, innerAudioContext: n…
uniapp使用页面通讯$on、$emit进行数据传参，页面DOM不刷新问题
A页面传递
setTimeout(() > {uni.$emit(updateAddress, addressInfo);
}, 500);
uni.navigateBack({delta: 1
}) B页面接口
onLoad(option) {var _this this;// 获取选择的地址uni.$on(updateAddress, function(data) {// console.log(data);})
},
onUnload(option) {// …
uniapp APP下载流文件execl 并用WPS打开
使用plus.downloader.createDownload 方法将新建下载任务
HTML5 API Reference
export default function plusDownload(config){if(!config){console.error("Argument should not be null");return;}const urlrequest.baseUrlconfig.url;let token uni.getStorage…
uniapp 富文本以及移动端富文本的展示问题
富文本展示有几种方式:
1.<view v-html"content"></view>
2. uniapp自带组件 rich-text
rich-text | uni-app官网
<rich-text :nodes"content"></rich-text>
3.uView组件 u-parse
Parse 富文本解析器 | uView 2.0 - 全面兼…
uniapp 给小程序添加分享功能
在 Uni-app 中，要为小程序添加分享功能，你可以通过使用小程序的自定义分享组件或通过配置页面的分享信息来实现。下面我将分别介绍这两种方法。
方法一：使用小程序的自定义分享组件
在小程序中，你可以创建一个自定义的分享组件&…
uniapp打开外部链接方式
uniapp打开外部链接方式
1、H5，打开方式
window.location.href url
2、APP，打开方式
plus.runtime.openURL(url)
uni-app 自带返回方法onBackPress，返回上一级并且刷新页面内容获取最新的数据
onBackPress 返回上一级并且刷新页面内容获取最新的数据
onBackPress 方法是uinapp自带返回键方法，也就是在app和H5返回键
onBackPress() {setTimeout(() > {uni.switchTab({url: /pages/Users/index,})}, 300)return true},
methods: {}在这里 uni.switchTab…
uniapp + electron 打包项目
参考文献
1、控制台安装electron和electron打包工具electron-packager
npm install electron -g
npm install electron-packager -g2、manifest.json修改
运行的基础路径修改为：./ 不然打包出来会出现白屏，读取不到，因为打包出来的h5默认加…
解决：uniapp项目打包微信小程序时，报错：failed to load config from /xx/xx-mall/vite.config.ts
复现步骤：在vscode终端中运行：pnpm build:mp-weixin-prod 命令，打包小程序生产包时，报错failed to load xxx/vite.config.ts，但实际项目根目录中有该vite.config.ts文件。 项目使用技术：uniapp vue3 node…
uniapp-从后台返回的一串地址信息上，提取省市区进行赋值
1.这是接口返回的地址信息 2.要实现的效果 3.实现代码： <view class"address">{{item.address}}</view>listFun() {let url this.$url.url.positionInfoCompany;let param {page: this.page,limit: this.limit,keyword: this.keyword,};thi…
uniapp实现文件预览过程
H5实现预览
<template><iframe :src"_url" style"width:100vw; height: 100vh;" frameborder"0"></iframe>
</template>
<script lang"ts">
export default {data() {return {_url: ,}},onLoad(option…
【像素画板】游戏地图编辑器-uniapp项目开发流程详解
嘿，用过像素画板没有哦，相信喜欢绘画的小朋友会对它感兴趣呢，用来绘制像素画非常好看，有没有发现，它是可以用来绘制游戏地图的，是不是很好奇，来一起看看吧。 像素画板，也叫像素画的绘…
【uniapp/uview】Collapse 折叠面板更改右侧小箭头图标
最终效果是这样的： 官方没有给出相关配置项，后来发现小箭头不是 uview 的图标，而是 unicode 编码，具体代码：
// 箭头图标
::v-deep .uicon-arrow-down[data-v-6e20bb40]:before {content: \1f783;
}附一个查询其他 u…
uniapp实现在线PDF文件预览
下载pdf文件放在static文件夹下
bug：hbuildX创建的项目pdf文件夹可以放在根目录下面，但是cli创建的项目无法预览，只能放在static下面
按钮跳转预览页面
<button click"toPdf">pdf</button>methods: {toPdf() {uni.…
uni-app(快速上手)
uniapp框架
uni-app 是一个使用 Vue.js 开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、Web（响应式）、以及各种小程序（微信/支付宝/百度/头条/飞书/QQ/快手/钉钉/淘宝）、快应用等多个平…
uniapp获取设备mac地址
const net plus.android.importClass(java.net.NetworkInterface);const wlan0 net.getByName(wlan0);const macByte wlan0.getHardwareAddress();let macStr ;macByte.forEach(item > {// .toString(16)数字以十六进制值显示let temp ;if (item < 0) temp (256 i…
uniapp踩坑之项目：隐藏显示密码功能
1.input组件的password设置为动态前面加:冒号； 2.动态切换眼睛图标使用:style //html
<view>
密码：<input placeholder"请输入密码" :password"openPassword" type"text" placeholder-style"color:#e2e2e2;…
uniapp在不需要后端数据的情况下 怎么记录用户进一次记录一次
目录
前言：
html部分
js部分
完整代码 前言：
一时兴起，不喜勿喷，今天听到了这个问题想到了一个方法，解决方式如下。
html部分
他用于显示访问次数（visitCount变量的值）。
<template&…
uniapp中在组件中使用被遮挡或层级显示问题
uniapp中在组件中使用或croll-view标签内使用uni-popup在真机环境下会被scroll-view兄弟元素遮挡，在开发环境下和安卓系统中可以正常显示，但在ios中出现了问题
看了许多文章都没有找到问题的原因，最后看到这一个文章http://t.csdnimg.cn/pvQ…
Uniapp实现时间选择器
Uniapp是一款基于Vue.js开发的跨平台应用框架，可以快速构建多端的移动应用。要在Uniapp中实现时间选择器，可以借助uni-datetime-picker组件来完成。 步骤 以下是在Uniapp中实现时间选择器的步骤：
在需要使用时间选择器的页面中引入 uni-date…
uniapp: 实现pdf预览功能
目录
第一章 实现效果
第二章 了解并解决需求
2.1 了解需求
2.2 解决需求
2.2.1 方法一
2.2.2 方法二
第三章 资源下载 第一章 实现效果 第二章 了解并解决需求
2.1 了解需求
前端需要利用后端传的pdf临时路径实现H5端以及app端的pdf预览首先我们别像pc端一样&#…
uni-app顶部导航栏背景色如何设置，微信小程序返回键设置
百度经验
https://jingyan.baidu.com/article/67508eb48c5c37dcca1ce499.html 这样设置微信小程序没有返回键 {"path": "pages/index/index","style": {"navigationBarTitleText": "首页","app-plus": {"ti…
校园圈子论坛，交友，帖子内短视频，二手市场，APP小程序H5三端交付，源码交付，支持二开
校园圈子论坛，交友频道，商城，二手市场，活动专区，短视频，从校园生活的方方面面展现出了充满活力和创造力的镜头。这个频道是一个让学生们相互交流、结识新朋友的平台，不仅有交友功能，…
微信小程序image组件图片设置最大宽度 宽高自适应
问题描述：在使用微信小程序image组件的时候，在不确定图片宽高情况下 想给一个最大宽度让图片自适应，按比例，image的widthfiex和heightFiex并不能满足（只指定最大宽/高并不会生效）
问题解决：使用…
uniApp微信支付实现
后端：小程序下单 - 小程序支付 | 微信支付商户文档中心
服务端需要请求：https://api.mch.weixin.qq.com该地址获取微信支付Api接口需要的参数。
服务端请求接口需要的Body参数： 客户端（前端）需要调用：wx.…
UniApp 中的 image 属性讲解
在 UniApp 中，image 是用于显示图片的组件，它具有多种属性，可以控制图片的展示方式和行为。下面我将为您讲解一些常用的 image 属性。
基本属性
src：指定要显示的图片资源路径，可以是本地路径或远程 URL。mode&#…
基于uniapp+vue微信小程序的健康饮食管理系统 907m6
设计这个微信小程序系统能使用户实现不需出门就可以在手机或电脑前进行网上查询美食信息、 运动视频等功能。 本系统由用户和管理员两大模块组成。用户界面显示在应用程序中，管理员界面显示在后台服务中，通过小程序端与服务端间进行数据交互与数据传输实…
uniapp-微信授权登录
目录
一、微信授权登录的介绍
1.用户在微信内点击登录按钮，跳转到授权页面；
2.用户同意授权后，返回授权码给开发者服务器；
3.开发者服务器通过授权码向微信服务器发送请求，获取用户信息；
4.微信服务器…
基于uQRCode封装的Vue3二维码生成插件
标题：基于uQRCode封装的Vue3二维码生成插件
摘要：本文介绍了一种基于uQRCode封装的Vue3二维码生成插件，可以在Javascript运行环境下生成二维码并返回图片地址。该插件适用于所有Javascript运行环境，并且支持微信小程序。本文将详…
微信小程序 基于Android的共享付费自习室座位选座系统uniAPP
题目： 基于Android的共享自习室APP设计与实现 (学校要求：数据库不少于有逻辑关系的20个表，系统功能不少于60个功能点） 技术： 功能： 1. 用户端： 一、首页： （1&…
高德地图使用逆地理编码服务
进入高德地图开发者平台申请web服务，并获取web服务生成的key下面是高德地图官网的逆地理编码服务使用说明https://lbs.amap.com/api/webservice/guide/api/georegeo/
getAddressByLocation(latitude, longitude) {const key key; // 高德地图key密钥const url h…
uniapp+vue3路由跳转传参
在uni-app中使用Vue 3进行路由跳转传参，可以通过以下步骤实现：
1.在router文件夹中创建一个名为index.js的文件，用于配置路由。在这个文件中，我们将导入createRouter和createWebHistory函数，并定义路由规则。同时&…
uniapp使用Vue3挂载函数到全局
在uni-app中，我们可以使用Vue3的全局API来挂载函数到全局。以下是一个简单的示例：
首先，我们需要在main.js文件中引入Vue3和我们的全局函数：
import { createApp } from vue
import App from ./App.vue
import globalFunction f…
地铁在线售票vue票务系统uniAPP+vue 微信小程序
功能介绍 管理员 （1）管理员登录功能 （2）查看和修改线路信息 （3）减少线路 （4）修改价格（5站3元 5-10 5元 10-15站6元 往上8元） （5）删除用…
高校大学校园后勤移动报修系统 微信小程序uniapp+vue
本文主要是针对线下校园后勤移动报修传统管理方式中管理不便与效率低的缺点，将电子商务和计算机技术结合起来，开发出管理便捷，效率高的基于app的大学校园后勤移动报修app。该系统、操作简单、界面友好、易于管理和维护；而且对后勤…
带你用uniapp从零开发一个仿小米商场_2.创建空白项目及公共样式引入
创建空白项目
打开uniapp 点击新建->项目
如下,
是编辑你项目的名字的地方是你项目存放地址,可以点击浏览器去文件管理里面选地址是模板选择,这里选择默认模板就好是一些其他选择比如uvue能让你项目在编译成软件时运行更快,unicloud能让你用js写后端,且直接就是云开发,g…
案例029:基于微信小程序的阅读网站设计与实现
文末获取源码 开发语言：Java 框架：SSM JDK版本：JDK1.8 数据库：mysql 5.7 开发软件：eclipse/myeclipse/idea Maven包：Maven3.5.4 小程序框架：uniapp 小程序开发软件：HBuilder X 小程序…
(env: Windows,mp,1.06.2308310； lib: 3.2.4) uniapp微信小程序
应公司需求，在特定情况下需要修改ip
在开发过程中出现的小插曲
1、第一种情况：重复声明 2、第二种情况： 应官方要求，需要跳转的 tabBar 页面的路径（需在 pages.json 的 tabBar 字段定义的页面）࿰…
uniapp上传图片 前端以及java后端代码实现
最近在做uniapp相关的开发，在上传图片的时候遇到了一些问题，所幸经过一些努力，解决开发过程中遇到的困难，记录一下uniapp上传图片的实现过程
1、前端代码
setPic1: function() {var me this;var serverUrl this.serverUrl;uni…
uni-app+ts----微信小程序锚点定位 、自动吸顶、滚动自动选择对应的锚点（点击tab跳转对应的元素位置）
uni-app----微信小程序锚点定位 、自动吸顶、滚动自动选择对应的锚点（点击tab跳转对应的元素位置）
html代码部分 重点是给元素加入【 :id“‘item’ item.id”】 <view class"radiusz bg-white pt-[30rpx] z-[999]"><u-tabs:list&q…
uniapp页面使用多个echarts出现数据渲染错乱问题解决
首先，uniapp当中使用echarts是在通过使用renderjs的script模板的前提下实现的，在官方提供的案例当中，核心代码是这一部分： 但如果将其封装为组件，并在一个页面当中引用多次来生成多个charts图标，那么这个时…
Uni-app智慧工地可视化信息云平台源码
智慧工地的核心是数字化，它通过传感器、监控设备、智能终端等技术手段，实现对工地各个环节的实时数据采集和传输，如环境温度、湿度、噪音等数据信息，将数据汇集到云端进行处理和分析，生成各种报表、图表和预警信息&…
uniapp之Vue3配置跨域（代理）
在uni-app中，我们可以使用vue.config.js文件来配置跨域（代理）。以下是一个示例：
// vue.config.js
module.exports {devServer: {proxy: {/api: { // 这里填写你要代理的接口前缀，例如/apitarget: http://localhost:…
uni-app图片上传
注意： 1、定义：fileList，
2、图片上传请求地址按照自己的修改 async afterReadList(event) { let lastFileIndex this.fileList.length - 1; let remainingCount lastFileIndex > 9 ? 0 : 10 - lastFileIndex; …
uni-app中的onLoad不执行
问题
想在onLoad()中发请求获取数据，却发现onLoad()根本不会执行
原因
这个页面没有在pages.json中配置，不属于uni-app中的页面
uni-app的文档也做出了说明，组件是无法使用页面级的onLoad等生命周期的
解决方法
uni-app除支持页面生命周…
uniapp+微信小程序监听返回事件
代码附在最后
适用场景：uniapp开发微信小程序
需求是我点击列表进入数据信息的详情界面，点击详情界面的收藏，返回上一界面后，更新列表中的收藏情况。
目录
一、使用onUnload监听页面卸载
二、使用getCurrentPages()获取当前页…
Nodejs+vue基于微信小程序的高校餐厅食品留样管理系统uniapp
任何系统都要遵循系统设计的基本流程，本系统也不例外，同样需要经过市场调研，需求分析，概要设计，详细设计，编码，测试这些步骤，基于nodejs小程序技术设计并实现了小程序。采用B/S结构,…
uni-app：心跳机制基础逻辑（定时器方法解决）
思路
1、在登录的时候，定义一个存储当前时间的全局变量，并且开始心跳请求
2、在全局中定义一个定时器，该定时器每秒都会执行一次，并获取当前的时间
3、将定时器每秒的获取的当前时间和全局变量获取的时间进行比较
4、指定一个…
创建可以离线打包开发的uniapp H5项目
安装node环境
略
安装vue脚手架，在线 npm install -g vue/cli PS：vue-cli已进入维护模式，vue3最新脚手架使用npm init vuelatest安装，安装后使用create-vue替换vue指令，create-vue底层使用vite提升前端开发效率&…
【uni-app + uView】CountryCodePicker 国家区号组件
1. 效果图 2. 组件完整代码
<template><u-popup class="country-code-picker-container" v-if="show" :show
uniapp如何制作一个收缩通讯录（布局篇)
html：
<view class"search"><view class"search_padding"><u-search change"search" placeholder"请输入成员名称" v-model"keyword"></u-search></view></view>
<view…
关于uniapp X 的最新消息
uni-app x 是什么？ uni-app x，是下一代 uni-app，是一个跨平台应用开发引擎。 uni-app x 没有使用js和webview，它基于 uts 语言。在App端，uts在iOS编译为swift、在Android编译为kotlin，完全达到了原生应用的…
微信小程序uni-app：常用Form表单组件input、textarea、picker使用示例
目录 input 输入框textarea多行输入框picker 选择器 input 输入框
https://developers.weixin.qq.com/miniprogram/dev/component/input.htmlhttps://uniapp.dcloud.net.cn/component/input.html
<inputclass"input-class"type"text"v-model"val…
【教程】app备案流程简单三部曲即可完成
APP备案流程包括以下步骤：
1. 开发者实名认证：在提交备案申请之前，开发者需要通过移动应用开发平台进行实名认证。这个步骤需要提供身份证号码、姓名、联系方式等信息，并上传相关证件照片或扫描件。
2. 应用信息登记：…
uniCloud（一） 新建项目、初始化服务空间、云对象访问测试
一、新建一个带有unicloud 二、创建一个服务空间
1. 右键uniCloud，关联云服务空间
我当前没有服务空间，需要新建一个服务空间，之后将其关联。初始化服务空间需要的时间有点长 服务空间初始化成功后，刷新HBuilder，勾选…
uniapp 连接斑马PDA调试
1、先把PDA设置成开发者模式
打开设置--》关于手机 --》单击版本号，5次以上 连线单击5次以上 2、后退--》找到系统 --》高级 3、打开 --》开发都模式 4、找到调试 --》 打开USB调试 5、设置USB偏好设置，插入电脑连接PDA就会在通知栏上显示，默…
微信开发者工具导入uniapp项目
引言
作为一名经验丰富的开发者，我将教会你如何在微信开发者工具中导入uniapp项目。在本文中，我将详细介绍整个导入流程，并提供每一步所需的代码和注释。
导入流程概览
下表展示了导入uniapp项目到微信开发者工具的步骤： 步骤描述1在微信开发者工具中新建项目2设置项目信…
uniapp开发小程序使用axios进行网络请求 uniapp 小程序调试
前言
本篇最好放到项目的【README.md】文件中，方便每次发布的时候检查纠错，毕竟好记性不如烂笔头。而且其他开发者帮忙修改bug、发布新版本的时候，只需要根据这个事项就能实现整个流程的提审发布，提高效率。
1、微信小程序配置
1.1、检查APPID是否正确 测试：wx--------…
uniapp 页面回退逻辑梳理
在uniapp 开发项目，有时在同一个页面 回退 会有不同的要求，无法通用的用navigaBack去解决 因此 这时候 就可以使用onBackPress方法，根据不同的参数条件来控制回退的页面
uView ui 1x uniapp 表格table行内容长度不一导致高度不统一而出现的不对齐问题
问题
因为td单元格内空长度不定导致行单元格未对齐 解决：
重置td的高度：height:100% 改为height:auto !import <u-table><u-tr v-for"(item,index) in Lineinfo.Cust_Name" ><u-td style"height: auto !important;back…
wu-ui-uniapp 多平台快速开发的UI框架
WU-UI
多平台快速开发的UI框架(无论平台，一致体验)
官方群
wu-ui官方1群: 767943089
说明
wu-ui(如虎添翼) 是 全面兼容多端的uniapp生态框架，基于vue2、vue3和nvue开发。丰富组件库，便捷工具库，简单高效。无论平台&#x…
使用uniapp写小程序，真机调试的时候不显示log
项目场景：
当小程序文件太大的情况下使用真机调试，但是真机调试的调试器没有任何反应 问题描述
使用uniapp写小程序，真机调试的时候不显示log
原因分析： 提示：因为真机调试的时候没有压缩文件，所以调试的…
uniapp ios保存本地照片权限 uniapp存储权限
全局变量
我们在开发应用中，全局变量是非常重要的一环。 比如记录当前用户token，配置接口请求服务地址等全局使用的变量。 在uni-app中，有多种方式现全局变量，下面将一个一个整理分析。
一、 Storage 本地存储
本地存储及已文件的形式保持在本地，需要的时候通过访问本地…
uniapp ios 授权弹窗 uniapp弹出框怎么实现
新版本的信息弹窗组件
可以弹出很多条信息，并单独控制消失时间、点击消失。 用循环来生成很多个弹窗，用this.$refs来传值，并添加数组。
1.布局
2.js
具体流程。需要一个弹窗，基本信息传入组件，处理后添加入数组&am…
uniapp中使用pageScrollTo让页面滚动到固定节点或距离
uniapp中使用pageScrollTo让页面滚动到固定节点或距离
思路：计算当前节点距离顶部的距离滚动距离然后使用pageScrollTo进行滚动（要保证页面加载完成之后在执行）
#topic" id ：页面的节点
changeTop(id) {let query uni.c…
uni-app 微信小程序之加载行政区图
文章目录 1. 实现效果2. 实现步骤 1. 实现效果 2. 实现步骤
使用三方组件 ucharts echarts 高性能跨全端图表组件页面导入引入的三方组件 组件demo代码
<template><view class"qiun-columns"><view class"cu-bar bg-white margin-top-xs"…
uni-app中vue3表单校验失败
目录
1.问题
2.原因及解决方式
3.表单校验方式（vue3） 1.问题
在app中使用uni-forms表单，并添加校验规则，问题是即使输入内容，表单校验依然失败。
代码：
<template><view><uni-forms r…
陪玩圈子系统：打破单身孤独，展开精彩社交旅程，APP小程序H5，源码交付，支持二开！
近年来，随着社交网络的快速发展，越来越多的人开始寻求各种方式来解决单身孤独的问题。而陪玩圈子系统便应运而生，在为用户提供社交服务的同时也促进了人与人之间的互动和交流。在这个拥有庞大用户数量和各种丰富活动的平台上，你将…
uniapp基础-教程之HBuilderX基础常识篇03
该内容为了大家更好的理解，将每个页面进行分离，单独创建项目，如在index中之写只写了一个搜索框，将其他页面分别放在HBuilderX目录中的components中，没有的可自行创建。
然后在components中创建轮播图新建一个swiper.v…
uniapp实战 —— 自定义顶部导航栏
效果预览 下图中的红框区域 范例代码 src\pages.json
配置隐藏默认顶部导航栏 "navigationStyle": "custom", // 隐藏默认顶部导航src\pages\index\components\CustomNavbar.vue
封装自定义顶部导航栏的组件（要点在于：获取屏幕边界…
uniapp 设置内容超长时的省略样式
需求
在uniapp中，页面在展示搜索历史的时候，需要对内容过长的进行处理，也就是文本超出我的最大长度时，不允许换行，且末尾为省略
期望的效果如下 思路
使用 官网 text-overflow 可选值俩个
clip 修建文本ellipsi…
uni-app解决video组件全屏时页面横竖错乱问题
使用 video组件播放视频时，在苹果手机上全屏后页面横竖屏错乱，点击返回按钮退出全屏，页面变成横屏，在iOS16 以上都会出现这个问题。
解决方案
修改manifest.json配置文件
"app-plus" : {...略"screenOrientatio…
如何进行代码混淆？方法与常见工具介绍
如何进行代码混淆？方法与常见工具介绍
目录
什么是代码混淆？
代码混淆的方法
常见代码混淆工具 什么是代码混淆？
代码混淆是指将计算机程序的代码转换成一种功能上等价，但难于阅读和理解的形式的行为。混淆后的代码很难被…
uniapp正确引入本地iconfont（阿里图标库）（亲测无问题）
1.文件说明
从阿里巴巴iconfont下载的文件中包含 iconfont.ttf、iconfont.css， 将 iconfont.ttf文件转位 base64。
2.转换地址
转换地址
3. 操作方式
3.1 打开 iconfont.css文件，修改 @font-face 部分，将转换好的 base64代码粘贴到对应位置，并且设置 代码如下：
@fon…
微信开发者工具里面模拟操作返回、录屏、网络速度、截屏等操作
有时候可能因为自己开发的页面使用了自定义的样式，所以没有了左上角的导航返回，所以进入我自定义的页面后，想要返回的话，就可以用到这里面你的操作，或者想截屏了也可以直接使用里面的截屏，或者返回主页面等…
uniapp自定义进度条组件
目标效果
原型设计为这样的样式，但是现有的进度条组件样式都无法满足需求，于是编写组件实现。
设计引用格式为
<zLineProgress :total"15" :val"7" title"你好吗" />定义组件
<template><view style&…
uniapp中wx.getSystemInfoSync() 或 wx.getSystemInfo() 踩坑
可以通过 wx.getSystemInfoSync() 或 wx.getSystemInfo() 方法获取设备的信息，其中包括 User-Agent。wx.getSystemInfoSync() 方法是同步获取设备信息，返回值是一个对象，包含了设备的详细信息，如系统版本、屏幕宽高等。wx.getSyst…
uniapp使用vue-i18n国际化多国语言
前言：uniapp是自带有i18n这个插件的，如果没有npm安装即可 此插件需要自己去给每一个需要国际化的字符去手动配置key，所以如果是已经完成的项目可能工作量就稍微有点大了 第一步：
语言命名是有规范的不能乱取名，具体可…
uniapp实战 —— 弹出层 uni-popup (含vue3子组件调父组件的方法)
效果预览 弹出的内容 src\pages\goods\components\ServicePanel.vue
<script setup lang"ts">
// 子组件调父组件的方法
const emit defineEmits<{(event: close): void
}>()
</script><template><view class"service-panel"…
uniapp封装websocket文件（app、h5兼容）
适合场景：只需要发送一次数据，服务器可以实时返回数据进行渲染。 socket文件
let isSocketClose false; // 是否关闭socket
let reconnectCount 5; // 重连次数
// let heartbeatInterval ""; // 心跳定时器
let socketTask null; // web…
案例054:基于微信的追星小程序
文末获取源码 开发语言：Java 框架：SSM JDK版本：JDK1.8 数据库：mysql 5.7 开发软件：eclipse/myeclipse/idea Maven包：Maven3.5.4 小程序框架：uniapp 小程序开发软件：HBuilder X 小程序…
案例062:基于微信小程序的健身房私教预约系统
文末获取源码 开发语言：Java 框架：SSM JDK版本：JDK1.8 数据库：mysql 5.7 开发软件：eclipse/myeclipse/idea Maven包：Maven3.5.4 小程序框架：uniapp 小程序开发软件：HBuilder X 小程序…
uniapp 微信小程序连接蓝牙卡死 uni.onNeedPrivacyAuthorization
解决方法，需要同意隐私保护协议，否则不能开启蓝牙权限和定位权限，会导致连接蓝牙失败
在uniapp中，可以使用那些预定义的样式类
u-flex：设置元素为弹性布局。u-flex-v：设置元素为纵向弹性布局。u-flex-h：设置元素为横向弹性布局。u-p-10：设置元素的上下左右边距为10rpx。u-p-t-10：设置元素的上边距为10rpx。u-p-b-10：设置元素的下边距…
uniapp踩坑之项目：使用过滤器将时间格式化为特定格式
利用filters过滤器对数据直接进行格式化，注意：与method、onLoad、data同层级 <template><div><!-- orderInfo.time的数据为：2023-12-12 12:10:23 --><p>{{ orderInfo.time | formatDate }}</p> <!-- 2023-1…
uniapp中使用u-loadmore，loadText内容不随status改变刷新
uniapp中使用u-loadmore，使用情况比较复杂，出现loadText内容不随status改变刷新的情况，即当status"loading"时，显示的内容是loadmore或nomore的文字。
解决办法：添加key参数
<u-loadmore :status"…
Uniapp软件库全新带勋章功能(包含前后端源码)
源码介绍：
Uniapp开发的软件库全新带勋章功能，搭建好后台 在前端找到 util 这个文件
把两个js文件上面的填上自己的域名，电脑需要下载：HBuilderX 登录账号 没有账号就注册账号，
然后上传文件，打包选择 “…
uniapp uview实现u-popup左侧弹起时铺满屏幕
效果如图: 代码如下: <u-popup :show="sign.signParams.show" mode="left" width="100%" height="100%" border-radius="0":mask-close-able="false">XXXXXXX内容xxxxx</u-popup>使用了 mode=“left”…
uniApp应用软件在运行时，不符合华为应用市场审核标准。解决方案合集！
（暂时用不到的也建议收藏一下，因为文章持续更新中）
最新更改时间：20023-12-10
第一次做App应用开发相信大家一定都遇到过华为应用市场审核的“驳回”！ 有些问题一看就明白可以立马修改，而有一些问题修改意…
uniApp 中实现一个骰子动效
代码如下
<template><!-- 骰子组件 --><view class"dice-wrap" tap"throwDice"><!-- 筛子运动时候的展示的图片 --><image v-if"isDicing" :src"diceAnimationImages[aniIndex]" class"dice-icon&qu…
记账本选择标签选择时间，计算器---记录一下
html部分
<template><view class"pages-main"><!-- 标题栏 --><!-- #ifndef MP-TOUTIAO --><view class"" :style"height:barHeight px;"></view><!-- #endif --><!-- #ifdef MP-TOUTIAO -->&…
uniapp用picker实现自定义三级联动（children）
数据大概得结构： html:
<view class"invite"><u-cell title"点击选则" isLink :value"value" click"showstrue"></u-cell><u-picker :show"shows" ref"uPicker" :columns"…
【教程】Ipa Guard为iOS应用提供免费加密混淆方案
概述：使用ios加固工具对ios代码保护，保护ios项目中的核心代码，
#ipagurd年终大促百厂联动暖冬特惠，超多软控件立享惊喜优惠>>
简介
iOS加固保护是直接针对ios ipa二进制文件的保护技术，可以对iOS APP中的可…
uniapp使用u-search以及相关api
u-search是uni-app框架中的一款搜索组件，可以方便地实现搜索功能。下面简单介绍一下如何使用u-search以及相关API。
引入u-search组件
在需要使用u-search组件的页面中，首先需要引入它： <template><view><u-search></…
【教程】源代码加密、防泄密软件
什么是代码混淆？
代码混淆 是一种将应用程序二进制文件转换为功能上等价，但人类难于阅读和理解的行为。在编译 Dart 代码时，混淆会隐藏函数和类的名称，并用其他符号替代每个符号，从而使攻击者难以进行逆向工程。
…
uniapp微信小程序下载base64图片流或https图片
常规https的图片下载是这样的
const urlPath https://test/logo.png
uni.downloadFile({url: urlPath,success(res){// 这时会产生一个临时路径，在应用本次启动期间可以正常使用。if (res.statusCode 200) {// 需要将图片保存到相册uni.saveImageToPhotosAlbum({…
【uview】省市二级联动地区选择器
uniapp插件地址 亲测 兼容微信小程序
使用
注意： 下载安装配置uview组件库，该插件基于uview的upicker组件
下载插件并导入到项目页面中直接引入标签
import barrypicker from /uni_modules/barry-picker/components/barry-picker/barry-picker.vueco…
uniapp微信小程序分包，小程序分包
前言，都知道我是一个后端开发、所以今天来写一下uniapp。 起因是美工给我的切图太大，微信小程序不让了，在网上找了一大堆分包的文章，我心思我照着写的啊，怎么就一直报错呢？ 错误原因 tabBar的页面被我放在分…
uniapp自定义导航栏方法
在uniapp中，可以使用uni-app官方提供的自定义导航栏插件 uni-navbar来设置自定义导航栏。
以下是使用 uni-navbar 设置自定义导航栏的步骤和示例代码： 安装 uni-navbar 插件： 在 HBuilderX 的插件市场中搜索 uni-navbar，并安装。…
uniapp到底用什么ui框架最合适-关于uni-app的ui库、ui框架、ui组件
文章目录 直接看答案关于uni-app的ui库、ui框架、ui组件组件的概念扩展组件的选择uni ui如何使用uni ui 综上，官方对组件的使用建议是：附录：其他全端兼容ui库参考文章： 直接看答案
如果想自己纯手写，直接用内置组件。…
Uniapp/微信小程序授权设置并实现点击保存图片
一：需要用到的API
1.uni.authorize(OBJECT) -- 提前向用户发起授权请求。
uni.authorize({scope: scope.userInfo,success() {console.log(授权成功);}
});注：如果用户之前拒绝了授权，此接口会直接进入失败回调。一般需要搭配uni.getSe…
使用set和emit在uni-app中实现响应式属性和自定义事件
在uni-app中，我们经常需要动态设置响应式属性，并且通过自定义事件来实现组件间的通信。这时，我们可以使用set和emit来轻松实现这些功能。
使用$set动态设置响应式属性
在Vue中，我们可以使用来动态设置响应式属性。在uniapp中使用…
Uniapp - 环境搭建 vscode开发
uni-app 基础
创建 uni-app 项目方式
uni-app 支持两种方式创建项目： 通过 HBuilderX 创建（需安装 HBuilderX 编辑器） 通过命令行创建（需安装 NodeJS 环境）
HBuilderX 创建 uni-app 项目
创建步骤
1.下载安装 H…
【uniapp小程序-上拉加载】
在需要上拉加载的页面的page.json上添加红框框里面的
onReachBottom() {if(this.commentCurrent<this.commentTotal){this.commentCurrent 1; this.commentList();this.status loading;}else{this.status ;}
},
methods:{commentList(){let params {courseid:this.cour…
uniapp横向滚动示例
目录 插件市场案例最后 插件市场
地址
案例
地址
最后 感觉文章好的话记得点个心心和关注和收藏，有错的地方麻烦指正一下，如果需要转载,请标明出处，多谢！！！
uniapp与vue的区别是什么
很抱歉之前回答不完整，再补充回答如下：
UniApp是基于Vue.js的跨平台应用框架，用于构建多端（如iOS、Android、H5、小程序等）统一开发的应用程序。虽然UniApp与Vue.js有一些相似之处，但在以下几个方面存在区…
HTML代码混淆技术：原理、应用和实现方法详解
HTML代码混淆技术：原理、应用和实现方法详解 HTML代码混淆是一种常用的反爬虫技术，它可以有效地防止爬虫对网站数据的抓取。本文将详细介绍HTML代码混淆技术的原理、应用以及实现方法，帮助大家更好地了解和运用这一技术。
一、HTML代码混淆…
案例052:用于日语词汇学习的微信小程序
文末获取源码 开发语言：Java 框架：SSM JDK版本：JDK1.8 数据库：mysql 5.7 开发软件：eclipse/myeclipse/idea Maven包：Maven3.5.4 小程序框架：uniapp 小程序开发软件：HBuilder X 小程序…
二手物品交易系统详细功能介绍
这是二手物品交易系统的详细功能介绍：
二手交易系统：该系统主要服务于二手交易市场，允许卖家发布二手商品信息，买家可以询价、购买支付，同时支持发布高价回收信息。多城市切换：用户可以切换到不同城市&…
uniapp组件map地图组件使用
在uniapp中，可以使用uni-app官方提供的map组件来实现地图功能。下面是一个简单的使用示例：
在页面中引入map组件，在template中添加以下代码：
<template><view><!-- map组件 --><map :longitude"longi…
第22节: Vue3 可写计算
在UniApp中使用Vue3框架时，你可以使用可写计算属性来封装复杂的计算逻辑，并将结果保存到一个响应式引用对象中，以便在其他地方使用。
下面是一个示例，演示了如何在UniApp中使用Vue3框架使用可写计算：
<template&g…
uni-app微信小程序隐藏左上角返回按钮
官方文档链接：uni.setNavigationBarTitle(OBJECT) | uni-app官网 (dcloud.net.cn) 首先要明确的是页面间的跳转方式有几种、每一种默认的作用是什么。 uniapp五种跳转方式
第一：wx.navigatorTo 【新页面打开，默认会有返回按钮】第二&#x…
HBuilderX 配置 夜神模拟器 详细图文教程
在电脑端查看App的效果，不用真机调试，下载一个模拟器就可以了 --- Nox Player，夜神模拟器，是一款 Android 模拟器。他的使用非常安全，最重要的是完全免费。
一. 安装模拟器
官网地址： (yeshen.com) 二.配…
uniapp的editor组件在H5上无法点击的问题处理
uniapp开发的移动端H5和小程序，富文本框输入框使用了editor的组件 在小程序端是运行正常的，但是在H5端出现了无法点击的情况，是好时坏
原因是H5端依赖远端的quill.min.js组件，该远端的组件偶尔会出现访问的情况 文档上写的比较清…
uniapp----button按钮去除边框
使用button标签，给其添加outline: none;border:none;无效果，去除边框，使用伪类进行处理。
button::after{ border: none;}
uniapp的uni-im 即时通信使用教程【用户与商家对话、聊天 / 最新 / 最全 / 带源码 / 教程】
目录 使用场景用户图片商家图片 官方文档官方文档地址插件地址 项目创建uniCloud开发环境申请开发环境申请完后 概括开始使用步骤1App.vue 步骤2找到软件登录图片找到软件登录接口登录源码如下 步骤3找到软件注册图片注册源码如下 步骤4找到index.vue首页图片 index.vue源码如下…
vue/uniapp - 返回上一页并onLoad/onShow刷新数据列表接口
目录 详情页(detail.vue)：列表页(list.vue)大佬最后 在uni中，返回页面是不会触发
onLoad方法的； 如果我们只想在特定情况下返回上一页才需要刷新数据，那么用onShow的话，那刷新就太频繁了；
这时候…
利用canvas封装录像时间轴拖动(uniapp),封装上传uniapp插件市场
gitee项目地址,项目是一个空项目,其中包含了封装的插件,自己阅读,由于利用了canvas所以在使用中暂不支持.nvue,待优化;
项目也是借鉴了github上的一个项目,timeline-canvas,
uniapp常用api讲解
Uniapp是一个基于Vue.js的跨平台开发框架，可以同时开发微信小程序、H5、App等多个平台的应用。下面是Uniapp常用的API讲解：
Vue.js的API
Uniapp采用了Vue.js框架，因此可以直接使用Vue.js的API。例如：v-show、v-if、v-for、compu…
[已解决】uniapp内置插件，editor富文本报错（附quill.min.js、image-resize.min.js文件）
在使用uni-app运行内置插件editor时，无法输入内容，控制台报错 原因：查看官网得知，需动态引入quill.min.js、image-resize.min.js文件 解决方法：
1.下载quill.min.js、image-resize.min.js到项目static/eidtor文件中 链…
uniapp计算视频学习进程，并且下次回来继续播放（不能快进）
前言：
该功能分别有三个难点：
1.计算百分比，计算上次播放秒数
2.如何使视频无法快进
3.如何从上次播放描述开始
首先现在这里熟悉一下如何计算：
1.计算视频播放的百分比
比如该视频的总时长为120秒，然后现在播放…
uniapp与vue的区别
Uniapp和Vue是两个相关但不完全相同的概念。
Uniapp是一个基于Vue.js的跨平台框架，用于开发多端应用，包括小程序、H5、App等。它通过使用Vue的语法和组件化开发模式，实现了一套代码可以在多个平台上运行的能力。Uniapp提供了一系列的API和组…
第21节: Vue3 计算缓存与方法
在UniApp中使用Vue3框架时，你可以使用计算属性和方法来处理一些依赖其他属性或数据的计算逻辑。计算属性会自动根据依赖属性的变化重新计算，而方法则可以用来封装一些可复用的函数逻辑。
下面是一个示例，演示了如何在UniApp中使用Vue3框架使…
uni-app基本标签
导航栏设置
- navigationBarBackgroundColor: 设置导航栏的背景颜色（全局页面） - navigationBarTextStyle: 导航栏标题颜色（仅支持 black 和 white） - navigationBarTitleText: 设置导航栏标题内容 - enablePullDownRefresh: 是否…
uniapp数据缓存（存储/获取/移除/清空）
1.存储：
异步：uni.setStorage(OBJECT)
uni.setStorage({key: storage_key,data: hello,success: function () {console.log(success);}
});同步：uni.setStorageSync(KEY,DATA)
try {uni.setStorageSync(storage_key, hello);
} catch (e) …
使用uni-app开发抖音小程序记录
问题
1. 设置底部bar，在抖音小程序调试器中显示白边
已经在uni-app中的pages.json中设置了tabBar的background为#000；本应底部bar显示为黑色； 但运行在调试程序中却会出现白边； 通过排查代码与通过抖音调试工具新建工程进行对比…
uniapp判断登录状态
在UniApp中，你可以通过以下步骤来判断登录状态：
定义一个变量来存储登录状态，例如isLoggedIn。 在登录成功后，将isLoggedIn设置为true。 在登录失败或注销后，将isLoggedIn设置为false。
以下是一个简单的示例代码&am…
案例073:基于微信小程序的智慧旅游平台开发
文末获取源码 开发语言：Java 框架：SSM JDK版本：JDK1.8 数据库：mysql 5.7 开发软件：eclipse/myeclipse/idea Maven包：Maven3.5.4 小程序框架：uniapp 小程序开发软件：HBuilder X 小程序…
uniapp websocket的使用和封装
在uniapp中socket分为两种形式，第一种适用于只有一个socket链接，第二种适用于多个socket链接。传送门 这里以socketTask为列子封装
在utils新建一个文件 在你要使用的页面引入，我这是聊天那种，所以我在拿到用户信息之后连接sock…
微信小程序动态导航栏（uniapp + vant）
本文使用到vant的van-tabbar组件来实现 一、uniapp整合vant ui
vant小程序版本：https://vant-contrib.gitee.io/vant-weapp/#/home 注：vant并没有uniapp的版本，所以此处是引入小程序版本的ui
1. 下载vant编译后代码 https://github.com/youzan/vant-weapp/tree/dev/dist 2…
uniapp 导入ucharts图表插件 H5项目， 使用echarts eopts配置
先下载ucharts H5示例源码：
uCharts: 高性能跨平台图表库，支持H5、APP、小程序（微信小程序、支付宝小程序、钉钉小程序、百度小程序、头条小程序、QQ小程序、快手小程序、360小程序）、Vue、Taro等更多支持canvas的框架平台&#…
uniapp 预览图片
preImg(index){let urls []this.images.map((item,i) > {if(indexi){urls.unshift(item.file_path)}else{urls.push(item.file_path)}})uni.previewImage({urls})}
uni-app 微信小程序蓝牙模块的解耦封装-持续更新
一、核心代码
core.js
import {showModal,stringToHex,sleep,uniqueArr,arrayBufferToHexString,hexStringToArrayBuffer,compareVersion
} from ./tool.js
//buffer分包，根据MTU的长度进行分包，蓝牙分发官方建议20个字节一包，但是随着硬件…
Uniapp + Vue3 + Pinia + Vant3 框架搭建
现在越来越多项目都偏向于Vue3开发，想着uniapp搭配Vue3试试效果怎么样，接下来就是详细操作步骤。
初始化Uniapp Vue3项目 App.vue setup语法
<script setup>import {onLaunch,onShow,onHide} from dcloudio/uni-apponLaunch(() > {console.l…
uniapp整合echarts（目前性能最优、渲染最快方案）
本文echarts示例如上图，可扫码体验渲染速度及loading效果，下文附带本小程序uniapp相关代码 实现代码
<template><view class="source
uniapp使用vue3的ref获取dom元素出现undefined
在我的代码里面，已经通过ref来定义想要获取的dom了，但是最后在页面渲染完之后，打印这个dom发现竟然是undefined： 获取不到dom元素： 最后查资料发现： 小程序中，uniapp的ref要绑定在子组件中才能…
uni-app地图标点展示
使用微信小程序框架编写的。它包含一个模板部分和一个脚本部分。 模板部分: <template>: 这是微信小程序中用来定义页面结构的标签。<view>: 微信小程序的基本组件，用来展示内容或布局。<view class"page-body">: 定义了一个页面主体部…
uniapp微信小程序下载保存图片流到本地,base64
我们在开发时下载图片或文件，地址基本上都是https的格式，下面来说一下后端返回base64的文件流，是如何下载的 必须把返回的流去掉这一部分：data:image/png;base64，否则下载不了
如我自己的流：
data:image/…
案例058:基于微信小程序的智能社区服务管理系统
文末获取源码 开发语言：Java 框架：SSM JDK版本：JDK1.8 数据库：mysql 5.7 开发软件：eclipse/myeclipse/idea Maven包：Maven3.5.4 小程序框架：uniapp 小程序开发软件：HBuilder X 小程序…
使用uniapp，引入uView遇到的问题(easycom无效解决方法）
在HBuilderX通过npm安装uView时，按照官网文档配置easycom无效
官网为：
4. 配置easycom组件模式
此配置需要在项目根目录的pages.json中进行。
温馨提示
uni-app为了调试性能的原因，修改easycom规则不会实时生效，配置完后&…
uni-app学习记录
uni-app注意点记录 页面跳转注意事项 navigateTo, redirectTo 只能打开非 tabBar 页面。switchTab 只能打开 tabBar 页面。reLaunch 可以打开任意页面。不能在首页 onReady 之前进行页面跳转。 页面通讯 // 发起页面uni.$emit(update,{msg:页面更新})// 接收页面uni.$on(upda…
106 uni-app 小程序之巨坑 not found path,not found methods v-for渲染出现报错
1.Component is not found in path
你是否像我一样，检查了无数遍，引入路径检查千万遍，就是没写错，小程序后台就是给你报错，
不用慌，心里默念：我不能砸电脑，我不能砸电脑࿰…
uni-app获取音频播放时长
在uni-app中，你可以使用uni.createInnerAudioContext()来创建一个内部音频上下文，然后通过这个对象来获取音频的播放时长。以下是一个示例代码：
// 创建一个内部音频上下文对象
const audioContext uni.createInnerAudioContext();// 设置要…
uniapp cli开发和HBuilderX开发
uniapp cli开发和HBuilderX开发
前言
uniapp是一个跨平台的开发框架，可以开发出微信小程序、支付宝小程序、百度小程序、头条小程序、H5、App等，开发者只需要写一套代码，就可以发布到各个平台，大大提高了开发效率。
uniapp的开…
uni-app如何解决在for循环里调用异步请求获取数据顺序混乱问题
总结/朱季谦
先前有一次做uni-app的js接口对接时，遇到过这样的情况，在for循环里，调用一个异步请求时，返回来的值顺序是乱的，因此，在以下的代码里，push到数组里的值，每次的顺序可能都…
Uniapp 开发 BLE
BLE
低功耗蓝牙（Bluetooth Low Energy，或称Bluetooth LE、BLE，旧商标Bluetooth Smart），用于医疗保健、运动健身、安防、工业控制、家庭娱乐等领域。在如今的物联网时代下大放异彩，扮演者重要一环ÿ…
uniapp如何原生app-云打包
首先第一步，需要大家在HBuilder X中找到一个项目，然后呢在找到上面的发行选项
发行->原生App-云打包 选择完该选中的直接大包就ok。
大包完毕后呢，会出现一个apk包，这是后将这个包拖动发给随便一个人就行了。
然后接收到的那…
uniapp 添加分包页面，配置分包预下载
为什么要分包 ? 分包即将小程序代码分成多个部分打包，可以减少小程序的加载时间，提升用户体验 添加分包页面 比较便捷的方法是使用vscode插件 uni-create-view 新建分包文件夹 以在我的页面，添加分包的设置页面为例，新建文件夹 s…
uniapp项目在微信开发工具里打开报错Error:app.json:在项目根目录未找到app.json
uni-app 项目我们在微信开发工具里面打开报错 编译报错：[ app.json 文件内容错误] app.json: app.json 未找 1、运行项目之前，我们这里使用的是HBuilder X 这个软件运行的。
打开这个软件，导入你的小程序的项目
2、在左上角找到运行&#…
uni-app只执行一次事件
在 <script setup> 中，你可以使用 onMounted 钩子函数来实现只执行一次的事件。onMounted 钩子函数会在组件挂载后立即执行，并且仅执行一次，因此适合用于只执行一次的事件处理。
以下是一个示例，演示了如何在 <script s…
音视频类App广告变现如何破局，最大化广告变现收益，让应用增收？
音视频App已然成为了我们日常获取、发布和交换信息的重要方式，在音视频行业不断的拓展中，用户的渗透率提升。
据数据显示，我国网络视听用户的规模已达9亿人次，网民使用率也突破了90%。庞大的市场规模和用户需求吸引了大批开发者和…
互联网+建筑工地源码，基于微服务+Java+Spring Cloud +Vue+UniApp开发
一、智慧工地概念 智慧工地就是互联网建筑工地，是将互联网的理念和技术引入建筑工地，然后以物联网、移动互联网技术为基础，充分应用BIM、大数据、人工智能、移动通讯、云计算、物联网等信息技术，通过人机交互、感知、决策、执行和…
如何在uni-app中进行状态管理的？
在uni-app中，可以使用vuex进行状态管理。下面是一个简单的uni-app中使用vuex的代码示例：
首先安装vuex：
npm install vuex在uni-app的根目录下创建一个store文件夹，在该文件夹中创建一个index.js文件：
import Vue f…
uni-app封装表格组件
组件代码：
<template><view><uni-table class"tableBox" border stripe emptyText"暂无更多数据" ><!-- 表头行 --><uni-tr class"tableTr"><uni-th align"center" v-for"item in …
uniapp在Windows系统上打包IOS
获取UDID
使用苹果手机自带Safari浏览器可获取UDID ：https://www.pgyer.com/udid
苹果开发者官网:https://developer.apple.com/ 生成开发证书
安装OpenSSL并配置环境变量：http://slproweb.com/products/Win32OpenSSL.html
管理员打开命令行
where …
第39节: Vue3 表单输入绑定及修饰符
在UniApp中使用Vue3框架时，你可以使用表单输入绑定来将用户输入与组件的数据进行绑定。以下是一个示例，演示了如何在UniApp中使用Vue3框架使用表单输入绑定：
<template> <view> <input v-model"message" type&qu…
vue 项目/备案网页/ip网页打包成 apk 安装到平板/手机（含vue项目跨域代理打包成apk后无法访问接口的解决方案）
下载安装HBuilder X编辑器 https://www.dcloud.io/hbuilderx.html 新建 5APP 项目 打开 HBuilder X，新建项目 此处项目名以 ‘test’ 为例 含跨域代理的vue项目改造 若 vue 项目中含跨域代理，如 vue.config.js
module.exports {publicPath: "./&…
在uni-app项目中，如何进行性能优化
在uni-app项目中，可以通过以下几种方式进行性能优化：
减少请求次数：合并请求，将多个请求合并成一个请求，减少网络请求次数，提高性能。优化图片加载：使用合适的图片格式，并进行压缩和…
uniapp创建/运行/发布项目
1、产生背景----跨平台应用框架
在移动端各大App盛行的时代，App之间的竞争也更加激烈，他们执着于让一个应用可以做多个事情 所以就应运而生了小程序，微信小程序、支付宝小程序、抖音小程序等等基于App本身的内嵌类程序。
但是各大App他不可…
uni-app和Vue.js有什么区别？
Uni-app和Vue.js是两种不同的框架，有以下区别： 构建平台：Uni-app是基于Vue.js开发的一款多端应用框架，可以一套代码同时编译到多个平台，如微信小程序、App、H5等。而Vue.js是一款用于构建Web界面的框架，只能…
uniapp框架——vue3+uniFilePicker+fastapi实现文件上传(搭建ai项目第二步)
文章目录 ⭐前言💖 小程序系列文章 ⭐uni-file-picker 组件💖 绑定事件💖 uploadFile api💖 自定义上传 ⭐后端fastapi定义上传接口⭐uniapp开启本地请求代理devServer⭐前后端联调⭐总结⭐结束 ⭐前言
大家好，我是ym…
黑马小兔鲜的uniapp项目，用vscode开发，根据文档安装了相关插件，写了相关eslint和prettier文件，出现了一些问题
小兔鲜儿 - 项目起步 | uniappvue3ts
1.它没有设置保存时代码自动格式化
2.ts.config.json文件出现报错关于node环境
3.eslintrc.cjs文件中的rules写了规则，prettierrc.json文件中也写了规则，不知道到底用哪个文件里的规则 解决问题：
解决…
uniapp Vue3 面包屑导航 带动态样式
上干货 <template><view class"bei"><view class"container"><view class"indicator"></view><!-- 遍历路由列表 --><view v-for"(item, index) in routes" :key"index" :class&quo…
uniapp开发移动端遇到的问题记录
1. 键盘弹起时页面整体上移问题
很常见但我解决过程中遇到了很多问题 我的键盘没有遮盖到输入框，但手机键盘弹起后，form部分会整体上移一点，并且底部的操作也会弹到键盘上方
网上写得很复杂，什么动态赋值高度balabala。看到有一…
uni-app/vue封装etc车牌照输入,获取键盘按键键值
先看下效果如下： 动态图如下 uniapp的keyup获取不到keyCode和compositionstart，compositionend，所以需要监听input节点的keyup事件，
思路以及代码如下： 1.将每一个字符用文本框输入，代码如下
<view …
uniapp-android原生插件如何打aar包 （避坑指南二）
1.打开android studio项目，找到module项目，打开右侧gradle，找到对应的module, 点击assemble，会打包生成aar，生成的aar在 [module]/build/outputs/aar/目录下 特殊情况，如果右侧的gradle，找到mo…
uniapp Vue3 日历 可签到 跳转
上干货
<template><view class"zong"><view><view class"top"><!-- 上个月 --><view class"sgy" click"sgy">◀</view><view class"nianyue">{{ year }}年{{ month 1 }}…
uniapp开发---Android打包发行（避坑指南四）
android离线打包，原生打包。参考官网
应用配置 | uni小程序SDK 【彩带- 避坑知识点】： 安卓离线打包，功能都正常，版本更新无法实现下载后自动安装。 但uniapp云打包则下载更新安装都正常。猜测可能是因为安卓离线打包缺少aar包导…
uniapp实现前端银行卡隐藏中间的数字，及隐藏姓名后两位
Vue 实现前端银行卡隐藏中间的数字 主要应用了 filters过滤器 来实现效果 实现效果，如图：
<template><div><div style"background-color: #f4f4f4;margin:50px 0 0 460px;width:900px;height:300px;"><p>原来&#…
uniapp原生插件 - android原生插件打包流程 （ 避坑指南一）
【彩带- 避坑知识点】: 当时开发中安卓插件打包成功后，uniapp引用插件aar，用云打包 ，总是提示不包含插件。原因是因为module的androidManifest.xml文件没有注册activity。 这一步 很重要，一定要注册。 --------------------------…
在uniapp中使用背景渐变色与背景图不生效问题
list上有文字详情以及背景图，从背景可以看出是渐变色和 背景图片的结合。
因为使用到渐变色，所以要结合 background-blend-mode 属性来实现与背景图片叠加显示，否则只通过 background: linear-gradient(); background-image: url(); 设置不会…
uniapp三元表达式判断状态更改字体颜色？
html
<template><view><text :style"getStatusColor(status)">状态: {{ status }}</text></view>
</template>
script
<script>
export default {data() {return {status: 1};},methods: {getStatusColor(status) {// …
uniapp的分包使用记录
UniApp的分包是一种将应用代码划分为多个包的技术。分包的核心思想是将不同部分的代码划分为不同的包，按需加载，从而提高应用性能。使用UniApp的条件编译功能，开发人员可以根据需要将代码划分为多个包。每个包都包含一组页面和组件࿰…
uni-app绘制二维码
在uni-app中绘制二维码，可以按照以下步骤进行：
打开HBuilderX开发工具，新建一个uni-app项目。在pages文件夹下，新建一个user文件夹，并创建user.vue文件。在template标签中，插入多个view和canvas。导入生成…
UniApp小程序使用vant引入vant weapp
HBuilder X里新建项目指路 HBuilderX新建项目 安装node.js指路 安装node.js 1.通过npm安装
查看npm环境
//打开终端输入命令查看版本
npm -version
1.1.右键打开外部终端窗口 1.2.输入npm init -y命令 1.3.通过命令安装
npm i vant/weapp1.3.3 -S --production 1.4.打开工具…
uni-app App.vue生命周期全局样式全局存储globalData
锋哥原创的uni-app视频教程：
2023版uniapp从入门到上天视频教程(Java后端无废话版)，火爆更新中..._哔哩哔哩_bilibili2023版uniapp从入门到上天视频教程(Java后端无废话版)，火爆更新中...共计23条视频，包括：第1讲 uni…
Error in onLoad hook: “URIError: URI malformed“ found in…报错处理以及完善uniapp针对对象传参
使用uniapp传参的过程中遇到这么一个问题，当我们需要传整个对象作为参数时，我会先将这个对象先编码，然后再解码，从而获取到怎么参数，平常实操的时候也没有遇到过问题，但是今天测试的时候，刚好一…
uniapp中复选框的使用
当在uniapp中使用复选框时，可以使用<checkbox>组件来实现。首先，在需要添加复选框的页面或组件中引入<checkbox>组件，在需要添加复选框的位置使用<checkbox>标签，并设置相应的属性，比如v-model来绑定…
uniapp中的uview组件库丰富的Keyboard 键盘 用法
目录 基本使用
#隐藏键盘"."符号
#是否打乱按键的顺序
#如何控制键盘的打开和关闭？
#如何监听键盘按键被点击？
API
#Props
#Events
#Slot 基本使用
通过mode参数定义键盘的类型，show绑定一个值为布尔值的变量控制键盘的弹…
微信小程序发送模板消息-详解【有图】
前言 在发送模板消息之前我们要首先搞清楚微信小程序的逻辑是什么，这只是前端的一个demo实现，建议大家在后端处理，前端具体实现：如下图 1.获取小程序Id和密钥
我们注册完微信小程序后，可以在开发设置中看到以下内容&a…
uniapp：富文本回显
一、使用uniapp官方的标签
rich-text：
会出现图片无法显示的问题，可以用以下方法来过滤处理
<rich-text :nodes"question.title | formatRichHtml"></rich-text> formatRichHtml(html) {if (!html) {return html;}//控制小程序…
uniapp中uview组件库丰富LoadingPage 加载页
目录 基本使用
#显示或隐藏
#文字内容
#动画模式
#动画图片
#文字颜色
#文字大小
#图标大小 2.0.32
#背景颜色
#图标颜色
API
#Props 基本使用
<template><view><u-loading-page></u-loading-page></view>
</template>#显示或…
uni-app 前后端调用实例 基于Springboot 数据列表显示实现
锋哥原创的uni-app视频教程：
2023版uniapp从入门到上天视频教程(Java后端无废话版)，火爆更新中..._哔哩哔哩_bilibili2023版uniapp从入门到上天视频教程(Java后端无废话版)，火爆更新中...共计23条视频，包括：第1讲 uni…
uni-app 前后端调用实例 基于Springboot 下拉刷新实现
锋哥原创的uni-app视频教程：
2023版uniapp从入门到上天视频教程(Java后端无废话版)，火爆更新中..._哔哩哔哩_bilibili2023版uniapp从入门到上天视频教程(Java后端无废话版)，火爆更新中...共计23条视频，包括：第1讲 uni…
uniapp中uview组件库的Search 搜索 的用法
目录 基本使用
#设置输入框形状
#是否开启清除控件
#是否开启右边控件
#自定义样式
API
#Props
#Events 基本使用
通过placeholder参数设置占位内容通过v-model双向绑定一个变量值，设置初始化时搜索框的值，如果初始内容为空，那么请绑…
uniapp vue 前端页面半小时选择器
<template><view><view class"uni-title uni-common-pl">时间选择器</view><view class"uni-list"><view class"uni-list-cell"><view class"uni-list-cell-left">当前选择</view>&l…
uni-app 经验分享，从入门到离职（实战篇）——模拟从后台获取图片路径数据后授权相册以及保存图片到本地（手机相册）
文章目录 📋前言⏬关于专栏 🎯需求描述🎯前置知识点🧩uni.showLoading()🧩uni.authorize()🧩uni.downloadFile()🧩uni.saveImageToPhotosAlbum() 🎯演示代码🧩关于图片接…
如何处理uni-app中的跨平台差异
在uni-app中，可以通过条件编译和平台判断来处理跨平台差异代码。具体步骤如下： 在uni-app项目的根目录下，找到名为manifest.json的文件，这是uni-app的配置文件。 在manifest.json文件中，可以使用条件编译指令来处理不…
案例070:基于微信小程序的一次性环保餐具销售系统
文末获取源码 开发语言：Java 框架：SSM JDK版本：JDK1.8 数据库：mysql 5.7 开发软件：eclipse/myeclipse/idea Maven包：Maven3.5.4 小程序框架：uniapp 小程序开发软件：HBuilder X 小程序…
案例094:基于微信小程序的图书馆自习室座位预约管理系统
文末获取源码 开发语言：Java 框架：SSM JDK版本：JDK1.8 数据库：mysql 5.7 开发软件：eclipse/myeclipse/idea Maven包：Maven3.5.4 小程序框架：uniapp 小程序开发软件：HBuilder X 小程序…
uniapp微信小程序投票系统实战 (SpringBoot2+vue3.2+element plus ) -小程序首页实现
锋哥原创的uniapp微信小程序投票系统实战：
uniapp微信小程序投票系统实战课程 (SpringBoot2vue3.2element plus ) ( 火爆连载更新中... )_哔哩哔哩_bilibiliuniapp微信小程序投票系统实战课程 (SpringBoot2vue3.2element plus ) ( 火爆连载更新中... )共计21条视频…
微信小程序 分享按钮 监听用户分享成功
代码 <view><button class"btnLq ed flex justify-center" open-type"share" click"getAward">点击分享</button>
</view>export default {data(){return{shareMd:false,//分享埋点}},onShow(){//if(this.shareMd){uni.…
uni-app页面数据传参方式
uni-app 是一个使用 Vue.js 开发所有前端应用的框架，可以编译到 iOS、Android、H5、小程序等多个平台。当你在多个页面间传递参数时，通常有多种方法，例如通过 uni.navigateTo、路由参数、本地存储等方式。下面是一些方法的说明和示例代码。
…
uni-app附件预览
// 预览附件perviewFile(file) {console.log(点击附件, file)var strfile.previewUrlvar filTypestr.split(.)console.log(filType,filType)uni.downloadFile({url: success: function(res) {console.log(打开文档成功, res);if (res.statusCode 200) {uni.saveFile({tempFile…
案例167:基于微信小程序的校园失物招领小程序
文末获取源码 开发语言：Java 框架：SSM JDK版本：JDK1.8 数据库：mysql 5.7 开发软件：eclipse/myeclipse/idea Maven包：Maven3.5.4 小程序框架：uniapp 小程序开发软件：HBuilder X 小程序…
使用Uniapp随手记录知识点
使用uniapp随手记录知识点 1 组件内置组件扩展组件 2 vuex状态管理使用流程mapState 辅助函数gettersMutation 1 组件
内置组件
内置组件内主要包含一些基础的view button video scroll-view等内置基础组件，满足基础场景
扩展组件
扩展组件是uniapp封装了一些成…
uniapp如何使用画布
Uniapp支持在多个端使用，包括但不限于以下平台： 小程序端：包括微信小程序、支付宝小程序、百度小程序等。H5端：可以在Web浏览器中打开，无需安装任何插件。App端：可以编译成iOS和Android应用，支持…
使用克魔助手进行iOS数据抓包和HTTP抓包的方法详解
摘要
本文博客将介绍如何在iOS环境下使用克魔助手进行数据抓包和HTTP抓包。通过抓包，开发者可以分析移动应用程序的网络请求发送和接收过程，识别潜在的性能和安全问题，提高应用的质量和安全性。
引言
在移动应用程序的开发和测试过程中&am…
#Uniapp：页面的生命周期
uni-app
页面的生命周期
函数名说明平台差异说明最低版本onInit监听页面初始化，其参数同 onLoad 参数，为上个页面传递的数据，参数类型为 Object（用于页面传参），触发时机早于 onLoad百度小程序3.1.0onLoad…
HBuilder/HBuilderX 运行APP
安装adb
https://developer.android.com/tools/releases/platform-tools?hlzh-cn
配置环境变量 测试是否配置成功
adb version HBuilder/HBuilderX 配置路径 数据线连接手机 运行即可 未检测到设备排查
真机运行常见问题run | uni-app官网
uniapp运行自定义底座到真机没反应
同步资源失败，未得到同步资源的授权，请停止运行后重新运行，并注意手机上的授权提示。 如果此时手机没有任何反应，请检查自定义基座是否正确;如果是离线制作的自定义基座包， 请检查离线包制作是否正确。 网上各种查找报…
uniapp中uview组件库丰富的ActionSheet 操作菜单使用方法
目录
#平台差异说明
#基本使用
#配置顶部的提示信息和底部取消按钮
#如何知道点了第几项
#API
#Props
#Event 本组件用于从底部弹出一个操作菜单，供用户选择并返回结果。 本组件功能类似于uni的uni.showActionSheetAPI，配置更加灵活，所…
uniapp：如何将返回标根据下滑的距离而改变颜色
在项目过程中我们会遇到这种情况： 返回标和背景颜色重合导致无法看见的情况，这里有一个简单的方法可以实现
监听页面向下滑动的api： onPageScroll : function(e) { //nvue暂不支持滚动监听，可用bindingx代替console.log("滚…
uniapp在web端怎么使用svg图标呢
在图标库中添加好项目用到的图标，点击symbol点击生成在线链接 点击生成的在线链接，此时会跳转到一个新窗口，是一个js文件 复制这个js文件的内容 然后在uniapp中新建svg.js文件，把从上面复制的代码粘贴到这个svg.js中 在main.js中引…
uniapp小程序超出一行显示...并展示更多按钮
注意:全部标签需要浮动在父盒子右边哦
循环获取所有需要展示数据标签的高度
this.goods this.goods.map(item > ({...item,showBtn: false}));this.$nextTick(() > {uni.createSelectorQuery().in(this).selectAll(".cart-info").boundingClientRect((data)…
uniapp中u-switch子组件点击触发到父组件（阻止事件冒泡）
解决方法：在u-switch 外面包和view标签，并使用tap.stop.prevent 可以阻止事件冒泡
.stop 阻止事件继续传播到父元素，prevent阻止事件默认行为
<view tap.stop.prevent><u-switch v-model"val_switch" change"chang…
uniapp微信小程序投票系统实战 (SpringBoot2+vue3.2+element plus ) -投票帖子明细实现
锋哥原创的uniapp微信小程序投票系统实战：
uniapp微信小程序投票系统实战课程 (SpringBoot2vue3.2element plus ) ( 火爆连载更新中... )_哔哩哔哩_bilibiliuniapp微信小程序投票系统实战课程 (SpringBoot2vue3.2element plus ) ( 火爆连载更新中... )共计21条视频…
uniapp小程序当页面内容超出时显示滚动条，不超出时不显示---样式自定义
使用scroll-view中的show-scrollbar属性 注意:需要搭配enhanced使用 否则无效 <scroll-view class"contentshow" scroll-y :show-scrollbartrue :enhancedtrue><view class"content" :show-scrollbartrue><text>{{vehicleCartinfo}}<…
uniapp 如何使用echarts 以及解决tooltip自定义不生效问题
使用的是echarts-for-wx插件； 正常写法案例：给tooltip数值加个%
<template><view><uni-ec-canvas class"uni-ec-canvas"id"uni-ec-canvas"ref"canvas"canvas-id"uni-ec-canvas":ec"ec&quo…
【持续更新ing】uniapp+springboot实现个人备忘录系统【前后端分离】
目录
（1）项目可行性分析
（2）需求描述
（3）界面原型
（4）数据库设计
（5）后端工程 接下来我们使用uniappspringboot实现一个简单的前后端分离的小项目----个…
uniapp多级动态表单规则
最近有个新的业务、主要涉及多层级的动态表单提交，其中又涉及很多类型，踩了很多坑之后，终于研发完毕。
传来的数据格式处理
传来的数据格式涉及比较多的内容，以下举例一个，涉及到规则的填写 规则写法有两种ÿ…
uniapp的touchstart与click
移动端的执行顺序：touchstart->touchmove->touchend->click
需求：点击消息查看详情，长按消息执行删除操作
点击事件正常触发，触摸事件正常触发，不会互相影响
问题：再执行删除操作的时候会连带点…
uniapp学习之路
uniapp 学习之路 1. 下载HBuilderX2. 下载uView初始框架3. 开始学习1.更改页面背景色，渐变色 1. 下载HBuilderX
https://www.dcloud.io/hbuilderx.html?ivk_sa1024320u2. 下载uView初始框架
https://ext.dcloud.net.cn/plugin?id15933. 开始学习
1.更改页面背景…
ts报错提示找不到uni的类型声明,uniapp项目用vscode开发，ts提示找不到uni,解决方法是安装@types/uni-app -D
vscode开发uniapp提示找不到uni名称，ts_找不到名称“uni”-CSDN博客
uniapp中uview组件库的丰富Upload 上传上午用法
目录 基础用法
#上传视频
#文件预览
#隐藏上传按钮
#限制上传数量
#自定义上传样式
API
#Props
#Methods
#Slot
#Events 基础用法
可以通过设置fileList参数(数组，元素为对象)，显示预置的图片。其中元素的url属性为图片路径
<template>…
uniapp打包Android、Ios、微信小程序
首先我们需要在我们的代码中，把我们所要用到的配置信息配置好，在检查一下我们测试的内容是否有打开（取消注释），在检查一下我们的版本信息是否正确，查看一下接口ip是否是正式线
这里的配置信息一定要配置好…
图鸟引入多套字体图标的方式教程
https://www.yuque.com/tuniao/qunyou/tgfvpg ①上传icon，生成iconfont.css
将css文件放这里
app.vue全局引入 适当改造iconfont.css的写法，方便调用
uni-app uni-app内置组件
锋哥原创的uni-app视频教程：
2023版uniapp从入门到上天视频教程(Java后端无废话版)，火爆更新中..._哔哩哔哩_bilibili2023版uniapp从入门到上天视频教程(Java后端无废话版)，火爆更新中...共计23条视频，包括：第1讲 uni…
uniapp 开发小程序的时候使用自定义 tabbar 时出现切换页面闪烁的情况
问题：在使用自定义组件的时候可以看到页面切换明显的闪烁, 这种体验是很不好的, 当然最好的方式就是使用原生导航栏, 不要搞花里胡哨的东西。
来看下体验不好的效果
优化调整
先说思路，就是仍然设置原生 tabbar, 在应用启动的时候主动隐藏原生 tabba…
uniapp导航栏组件如何使用
在uni-app中，可以使用官方提供的uni-navigator组件来实现导航栏的功能。
具体使用步骤如下：
在App.vue文件中，引入uni-navigator组件：
<template><view><uni-navigator /><router-view /></view>…
uniapp 多轴图，双轴图，指定哪几个数据在哪个轴上显示
这里使用的在这里导入，
秋云 ucharts echarts 高性能跨全端图表组件 - DCloud 插件市场
这里我封装成一个组件，自适应的，可以直接复制到自己的项目中
<template><qiun-data-charts type"mix":opts"opts":cha…
uni-app 前后端调用实例 基于Springboot 详情页实现
锋哥原创的uni-app视频教程：
2023版uniapp从入门到上天视频教程(Java后端无废话版)，火爆更新中..._哔哩哔哩_bilibili2023版uniapp从入门到上天视频教程(Java后端无废话版)，火爆更新中...共计23条视频，包括：第1讲 uni…
uniapp选择android非图片文件的方案踩坑记录
这个简单的问题我遇到下面6大坑，原始需求是选择app如android的excel然后读取到页面并上传表格数据json
先看看效果 uniapp 选择app excel文件读取 1.uniapp自带不支持 uniapp选择图片和视频非常方便自带已经支持可以直接上传和读取 但是选择word excel的时候就出现…
【后端已完成，前端更新ing】uniapp+springboot实现个人备忘录系统【前后端分离】
目录
（1）项目可行性分析
（一）技术可行性：
（二）经济可行性：
（三）社会可行性：
（2）需求描述
功能模块图
用例图&#…
uniapp---安卓真机调试提示检测不到手机【解决办法】
最近在做APP，由于华为手机更新过系统，再次用来调试APP发现就不行了。下面给出具体的解决方法：
第一步：打开【允许开发人员选项】
找到【设置】点击【关于手机】找到【版本号】点击7次或多次，允许开发人员选项。
第二…
微信小程序使用echarts报错 ReferenceError: Image is not defined 解决
报错 ReferenceError: Image is not defined
在用uni-app开发微信小程序时，使用到了echarts（V4.6.0）配置项中的icon属性，微信开发者工具报错如下：
定位问题
定位问题到了压缩echarts文件中的new Image 使用非压缩…
uniapp中uview组件丰富的Code 验证码输入框的使用方法
目录 基本使用
#自定义提示语
#保持倒计时
API
#Props
#Methods
#Event 基本使用
通过ref获取组件对象，再执行后面的操作，见下方示例。
通过seconds设置需要倒计的秒数(默认60)通过ref调用组件内部的start方法，开始倒计时通过监听cha…
在uni-app中使用sku插件，实现商品详情页规格展示和交互。
商品详情 - SKU 模块
学会使用插件市场，下载并使用 SKU 组件，实现商品详情页规格展示和交互。
存货单位（SKU）
SKU 概念
存货单位（Stock Keeping Unit），库存管理的最小可用单元，通…
uniapp 移动端app判断用户app版本是否是最新版(Android)
1.在uniapp项目中的App.vue文件下
<script>import { ref } from vue;const token ref();export default {onLaunch: function() {// #ifdef APP//获取打包时设置的版本号，然后存到storage里plus.runtime.getProperty(plus.runtime.appid, (wgtinfo) > {u…
精品基于Uniapp+springboot车辆充电桩缴费管理系统管理系统App-地图
《[含文档PPT源码等]精品基于Uniappspringboot充电桩管理系统App》该项目含有源码、文档、PPT、配套开发软件、软件安装教程、项目发布教程、包运行成功！
软件开发环境及开发工具：
开发语言：Java
后台框架：springboot、ssm
安…
Uniapp使用wx.getFuzzyLocation()方法，没有超过日调用次数，报错：“此key每日调用已达到上限”
前言：
最近在进行一个小程序项目开发的时候，使用wx.getFuzzyLocation()方法，没有超过日调用次数，但是却出现了报错：“此key每日调用已达到上限”。 解决方案：
打开腾讯位置服务 - 立足生态，连…
❤ Uniapp使用二 ( 日常使用篇)
❤ Uniapp使用二 ( 日常使用篇)
一、表单
1、基础表单验证 form
<form submit"formSubmit" reset"formReset"> <view class"uni-form-item uni-column"><view class"title">请选择类型{{selectvalue}}</view&…
HBuilder X中uView UI框架的安装及使用
开发工具: HBuilder X
在最上方的工具中点击 插件安装 ——> 安装新插件 ——> 前往插件市场安装 在作者排行榜中找到 uView UI 选择该版本 然后点击下载并导入HBuilder X 然后选择你想导入的项目 在项目根目录中的main.js中，引入并使用uView的JS库ÿ…
uniapp page宽度设置为750rpx，子元素宽度100%，大小不一致
uniapp page宽度设置为750rpx，子元素宽度100%，大小不一致。 原因是我在page加了margin: 0 auto;去掉就正常了（但是如果在超大屏幕还是会出现，我猜是使用rpx导致的，rpx渲染成页面时会转成精确到一个小数点几位数的rem&a…
uniapp踩坑之项目：canvas第一次保存是空白图片
在ctx.draw()回调生成图片，参考canvasToTempFilePath接口文档 // data
imgFilePath: null,// 缓存二维码图片canvas路径//js
// 首先在draw（）里进行本地存储
......
ctx.draw(false, () >{uni.canvasToTempFilePath({ // 把画布转化成临时…
uniapp app更新
uniapp app更新 这个版本要随之增加，不然刚更新时直接用app, 新包增加的那些页面跳转会有问题，不能跳新的页面
//app更新检测
updataApp(){const that this;uni.showLoading({title:加载中...})plus.runtime.getProperty(plus.runtime.appid, functio…
uniApp封装一个滑块组件
最近 项目中有一个需求 PC端动态设计的表单 移动端要能渲染出来
那么 就要去找到对应的组件 而其中 没有的 就包括滑块 没有又能怎么办 只能自己封装一个
我们直接上代码
<template><view class"u-slider" tap"onClick" :class"[disabled…
uniapp map自定义气泡窗
uniapp map自定义气泡窗
1、map
<template><view><map class"map" :latitude"mapCenter.lat" :longitude"mapCenter.lng" :scale"5" :markers"mapData"><!--自定义冒泡--><cover-view slot&qu…
uniapp让图片缩小
image{width: 500rpx;height:500rpx;}
在图片属性设置为image{}宽高改变但是大小不改变，解决办法是改成下面的代码
& > img {width: 50px; height: auto; } 如图：
uniapp封装公共的方法或者数据请求方法
仅供自己参考，不是每个页面都用到这个方法，所以我直接在用到的页面引用该公用方法：
1、新建一个util.js文件
export const address function(options){return new Promise((resolve,reject)>{uni.request({url:"https://x.cxniu.…
软件资源管理下载系统全新带勋章功能 + Uniapp前端
测试环境：php7.1。ng1.2，MySQL 5.6
常见问题：
配置好登录后转圈圈，检查环境及伪静态以及后台创建好应用
上传图片不了，检查php拓展fileinfo
以及public文件权限
App个人主页随机背景图，在前端uitl文件…
uni-app小程序：文件下载打开文件方法苹果安卓都适用
api:
const filetype e.substr(e.lastIndexOf(.)1)//获取文件地址的类型
console.log(文档,filetype)
uni.downloadFile({url: e,//e是图片地址success(res) {console.log(res)if (res.statusCode 200) {console.log(下载成功,);var filePath encodeURI(res.tempFilePath);…
uni-app (安卓、微信小程序)接口封装 token失效自动获取新的token
一、文件路径截图 1、新建一个文件app.js存放接口
//这里存放你需要的接口import {request} from /utils/request.js //这个文件是请求逻辑处理
module.exports {// 登录 -- 注册perssonRegister: (data) > { // 供应商注册 return request({url: manageWx/Login/perssonR…
【Uni-App】Vuex在vue3版本中的使用与持久化
Vuex是什么 Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。 简而言之就是用来存数据，可以有效减少使用组件传参出现的问题。 基本元素：…
uniapp导入uView组件库
目录 准备工作 1. 新建一个项目
2. 导入uview组件库
3. 关于SCSS
配置步骤
1. 引入uView主JS库
2. 在引入uView的全局SCSS
3. 引入uView基础样式
4. 配置easycom组件模式 添加效果实验运行即可成功 准备工作 1. 新建一个项目 2. 导入uview组件库
在进行配置之前&#x…
uni-app vite+ts+vue3模式 集成微信云开发
1.创建uni-app项目
此处使用的是通过vue-cli命令行方式uni-app官网
使用vue3/vite版
创建以 typescript 开发的工程（如命令行创建失败，请直接访问 gitee 下载模板）
npx degit dcloudio/uni-preset-vue#vite-ts my-vue3-project(我创建失败…
uniapp H5 touchstart执行完成并返回成功再执行touchend 失败则不执行touchend
uniapp H5 touchstart执行完成并返回成功再执行touchend 失败则不执行touchend
直接上代码
<tmmplate>// 只绑定 touchstart 事件<view class"mp_yun_item"><view class"mp-ptz-btn mp-yun-top" touchstart"yunControl"><…
hbuiderx+uniapp基于Android宠物饲养交流养宠系统 微信小程序3_reqva
3.2 APP需求分析 作为一款宠物饲养管理APP，面向的是大多数学者，软件的界面设计简洁清晰，用户可轻松掌握使用技巧。在调查之后，获得用户以下需求： （1）用户注册登录后，可进入系统解锁更…
uniapp H5 px转换rpx
uniapp H5 px转换rpx
安装 px2rpx 重启 HBuilderX在要转换的文件 点击右键 点击 开启px2rpx(1px转成2rpx) 开启成功！使用 编辑页面后 按下键盘 Ctrl s 保存！转化成功！当然 你也需要对使用的插件 进行转换！否则可能导致样式出现…
uniapp 使用canvas 画海报，有手粘贴即可用（拆成组件了，看后面）
1.直接使用
html部分
<view click"doposter">下载海报</view>
<canvas canvas-id"myCanvas" type2d style"width: 370px; height: 550px;opcity:0;position: fixed;z-index:-1;" id"myCanvas" />js 部分 drawBac…
uniapp搜索附近蓝牙信标（iBeacon）
一、 iBeacon介绍
iBeacon是苹果在2013年WWDC上推出一项基于蓝牙4.0（Bluetooth LE | BLE | Bluetooth Smart）的精准微定位技术，在iPhone 4S后支持。当你的手持设备靠近一个Beacon基站时，设备就能够感应到Beacon信号，范…
【uniapp】遇到的一些问题
一、小程序中textarea ios样式不生效的方法
默认有内边距，加个disable-default-padding"true"
二、uni-data-picker循环使用，一个改了全局的值
换成了uni自带的picker，下面括号里必须有默认值，为空字符串的时候&…
uniapp如何实现跨端适配
Uniapp是一款基于Vue.js的跨平台开发框架，可以同时支持多个主流的移动端和Web端平台。Uniapp提供了一套统一的API和组件库，可以实现跨端适配。
Uniapp的跨端适配主要通过条件编译和样式适配来实现。具体的步骤如下： 使用条件编译：…
uniapp如何调用ANDROID原生函数
在 UniApp 中调用 Android 原生函数，通常需要使用 UniApp 的插件系统。以下是调用 Android 原生函数的一般步骤： 安装插件：首先，确保你已经安装了对应的插件。你可以在 UniApp 插件市场 中搜索并安装你需要的插件。对于 Android 原…
uniapp——自定义导航栏的封装
为什么需要封装自定义导航
首先如果开发的是微信小程序，那么在安卓环境下导航栏标题是默认靠左对齐的（虽然你在微信开发者工具上看到的依旧是居中展示），而在ios环境则是居中展示的。很多时候我们需要对整个项目有一个主题色或者公…
本地静态资源打包出来，本地配置ng访问服务器（uniapp打包成h5后，使用打包资源连接测试环境测试）
1.下载ng https://nginx.org/en/download.html 2.解压下载的压缩包
3.打包h5静态资源
4.将打包出来的资源放入ng -》html文件夹下面 5.进入ng-》conf-》nginx.conf 进行转发配置 6.启动ng服务，点击nginx.exe
7.浏览器直接访问http://localhost:8081/#/&#x…
uni-app购物车页面详细代码
效果图：
这里的购物车加减用的是uni-app中的sku插件
代码附下（全）：
<script setup lang"ts">
import {reqMemberCartList,reqMemberdelentCart,reqMemberPutCart,putMemberCartSelectedAPI,
} from /services/…
使用uniApp+vue3+Vite4+pinia+sass技术栈构建微信小程序
使用uniApp的cli模式安装，可以使用vscode开发。不用再单独去下载HBuilderX.
1.基础安装 vue3tsuniapp
方法一：
npx degit dcloudio/uni-preset-vue#vite-ts my-vue3-project方法二：可以去uni-preset-vue的vite分支下选择vite-ts直接下载zi…
uni-app 微信小程序之红包雨活动
文章目录 1. 页面效果2. 页面样式代码 1. 页面效果 GIF录屏有点卡，实际比较丝滑 每0.5s掉落一个红包控制4s后自动移除红包点击红包消除红包（或者自行1，或者弹窗需求） 2. 页面样式代码
<!-- 红包雨活动 -->
<template>…
uniapp 使用state 持久化存【已解决】
state状态管理，刷新页面后他是会重置的，并不能做到持久化保存数据这个时候我们有两种方法1，利用H5的本地存储(localStorage，sessionStorage);（不推荐，用了这个state好像又没什么用了）2ÿ…
uniapp微信小程序swiper无限数量不卡顿轮播图组件
uniapp插件市场链接：uniapp微信小程序swiper无限数量不卡顿轮播图组件 - DCloud 插件市场
兼容性： 仅支持微信小程序平台（其他平台没做测试），有uniapp框架版和纯微信小程序开发工具版。
问题： 你也遇到微…
uniapp-分类配置
渲染分类页面的基本结构
1.首先需要定义页面结构：
<template><view><view class"scroll-view-container"><!-- 左侧的滚动视图区域 --><scroll-view class"left-scroll-view" scroll-y :style"{height: wh …
uni-app 系列之（六）—— 运行环境平台
运行环境判断
开发环境和生产环境
uni-app 可以通过 process.env.NODE_ENV 来判断当前环境是开发环境还是生产环境。（一般用于连接测试服务器或生产服务器的动态切换。）
在 HBuilderX 中，点击“运行”编译出来的代码是开发环境在 HBuilder…
二手交易|校园二手交易小程序|基于微信小程序的闲置物品交易平台设计与实现(源码+数据库+文档)
校园二手交易小程序目录
目录
基于微信小程序的闲置物品交易平台设计与实现
一、前言
二、系统功能设计
三、系统实现
1、用户信息管理
2、商品信息管理
3、公告信息管理
4、论坛信息管理
四、数据库设计
1、实体ER图
五、核心代码
六、论文参考
七、最新计算机毕…
【Uni-App】Vue3如何使用pinia状态管理库与持久化
安装插件
pinia-plugin-unistorage
引入
// main.js
import { createSSRApp } from "vue";
import * as Pinia from "pinia";
import { createUnistorage } from "pinia-plugin-unistorage";export function createApp() {const app create…
uniapp实现自定义底部tab栏
1、自定义底部导航组件接收一个tabs数组作为参数，每个数组项包含icon和text字段，用于表示每个底部标签的图标和文本。通过遍历tabs数组，渲染每个底部标签项的图标和文本。activeIndex表示当前选中的底部标签的索引。点击底部标签时࿰…
随手记：uni-app中使用iconfont彩色图标
1、打开阿里巴巴矢量库 2、将下载的压缩文件解压，cmd打开控制台
3、安装npm install -g iconfont-tools（首次使用安装）
4、输入iconfont-tools会生成一个文件夹 5、打开这个文件夹，用里面的相应的css就行
uniapp 高德地图显示
1. uniapp 高德地图显示 使用前需到**高德开放平台（https://lbs.amap.com/）**创建应用并申请Key 登录 高德开放平台，进入“控制台”，如果没有注册账号请先根据页面提示注册账号 打开 “应用管理” -> “我的应用”页面…
uniapp中封装一个svg转base64的组件
uniapp中由于不支持svg--》base64，同时无法使用h5中atob，这里我们采用js-base64插件实现这样一个组件，只要传人svg的代码即可在uniapp中转为base64，同时支持自定义参数，比如宽度，高度,等
1 安装
npm inst…
uniapp 之 base64转临时地址播放mp3
需求是：进入页面的时候是先有背景音乐，发送问题请求回答的时候会返回文字和音频，前端要把音频读出来，并且把背景音乐停止，读完音频后再打开背景音乐
一开始用的直接base64直接拼接在地址后 真机放不了
const innerAu…
uniapp新增一条数据增加一个折叠栏
//折叠栏
<uni-collapse classcollapse refcollapse><uni-collapse-item v-for"(item, index) in dataForm.beefCattleNums" :key"index" :title"item.fatCalfNum" classcollapse-item title-bordershow :borderfalse clicktoggleItem(…
uniapp 本地存储的方式
1. uniapp 本地存储的方式 在uniapp开发中，本地存储是一个常见的需求。本地存储可以帮助我们在客户端保存和管理数据，以便在应用程序中进行持久化存储。本文将介绍uniapp中本地存储的几种方式，以及相关的代码示例。
1.1. 介绍 在移动应用开发…
如何使用 uniapp 开发（一）
1、下载 hbuilderx 编辑器 https://www.dcloud.io/hbuilderx.html
2、下载 微信开发者工具 https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html
3、使用hbuilder编辑器，开发微信小程序的时候需要借助 微信开发者工具显示，所以需…
日志报错 git -c dif.mnemonicprefix=false -c core.guotepath=false 解决方法
前言： 在进行下面操作前，必须确保，你是否安装了Git。 查看Git 在命令行窗口中输入`git --version`： 如果这个命令成功显示了Git的版本信息，这表明Git已经被安装。 1. 使用Sourcetree SourceTree 是 Windows 和Mac OS X 下免费的 Git 和 Hg 客户端…
vue传参，没有变化（渲染机制：指向内容仍然在，我认为我没有必要渲染）（uniapp）
今天遇到一个怪事，就是，加个判断渲染，改变布尔值，居然没有变化
<template v-if"caseTotalBot&&isHandle0" ><case-total :ec"ec3" />
</template>
这个e3传入给组件case-tota…
springboot微信小程序 uniapp学习资料分享系统v9uy4
理论意义 当今网络教学已成为各国教育改革 和发展的趋势。因此，构建一个适合交互式课堂教学模式的教学平台就成了当务之 急。 在国内高校，目前交互平台主要用于网络学院的远程教学，至于校园内的正规教学，老师自发建立课程主页的比…
【vue/过滤器】解析富文本返回的 html 中，单独给指定标签加样式
包含使用 quill 解析富文本传过来的内容 方法1：使用全局过滤器：
<div style"width: 100%;" class"ql-snow ql-editor" v-html"safeHtmlContent"></div>import Vue from vueimport "quill/dist/quill.co…
uni-app x，一个纯原生的Android App开发工具
uni-app x，下一代uni-app，一个神奇的产品。
用vue语法、uni的组件、api，以及uts语言，编译出了kotlin的app。不再使用js引擎和webview。纯纯的kotlin原生app。
uni-app x，让“跨平台开发性能不如原生”的这条曾广为流…
uniapp vue3怎么调用uni-popup组件的this.$refs.message.open() ?
vue2代码
<!-- 提示信息弹窗 --><uni-popup ref"message" type"message"><uni-popup-message :type"msgType" :message"messageText" :duration"2000"></uni-popup-message></uni-popup>typ…
uniapp微信小程序开发踩坑日记：uni.request回调函数地狱问题
使用await和async无法解决uniapp中的回调函数地狱问题，因为uni.request并不返回一个 Promise。通常情况下，我们期望await能够等待一个 Promise 或者其它类似 Promise 的对象，然后继续执行下面的代码，但uni.request的 success 回调…
uniapp 读取本地文件
uniapp 读取本地文件
介绍
开发中需要将一些固定配置保存到一个配置文件中，在static 下面创建了一个data.json文件
uniapp 有时候可能需要读取本地的json配置文件或者其他一些文件，晚上找了几个教程不管用，最后还是在官网找到了介绍
实现…
uniapp如何给视频组件设置图片
要给uniapp的视频组件设置图片，可以使用poster属性。poster属性用于设置视频播放前显示的图片，可以是远程图片的链接或本地图片的路径。
<template><view><video :src"videoUrl" :poster"posterUrl" controls>&l…
uniapp H5唤起手机App 中间下载页
我这里直接是打开中间下载页，在下载页判断手机是否已存在App，有则唤起App，没有则可点击下载按钮下载app。 唤起App的关键语句是：window.location.href scheme
Scheme链接格式样式： [scheme]://[host]/[path]?[que…
uniapp 放大中间图标
方法1：使用css /*样式直接复制到项目的App.vue即可*/.uni-tabbar {
/*.uni-tabbar__item:nth-last-child(3) 修改倒数第三个 也就是中间的图标 我这边底部栏是五个*/.uni-tabbar__item:nth-last-child(3) {.uni-tabbar__bd {/*.uni-tabbar__icon 去掉原图标大小&…
Uniapp零基础开发学习笔记(9) -媒体组件音视频摄像头等的练习使用
Uniapp零基础开发学习笔记(9) -媒体组件音视频摄像头等的练习使用
基础组件部分，最后就只剩余媒体组件以及地图，和画布Canvas，以及浏览器组件web-view。 此次先看看媒体组件，重点学习前面几个。 链接如下: https://uniapp.dcloud…
【uniapp小程序开发】—— 组件封装之【自定义弹窗】
文章目录🍋前言：🍍正文1、探讨需求封装popup自定义弹窗组件2、实战开发弹窗组件2.1 子组件内容 popup.vue文件2.2 父组件引用子组件3、效果图预览3.1 不使用具名插槽的原有样式效果3.2 使用具名插槽之后样式效果🎃专栏分享&#x…
老生常谈的商城系统（Asp.Net+uniapp）
真正的大师,永远都怀着一颗学徒的心！ 最近几天合肥是真热
这时候就应该宅在家里
吃着西瓜 啃着鸭脖 喝着啤酒 刷着剧
想想也太美好了吧
哈哈
我得醒醒 写完这篇推荐
吃吃喝喝去了 一、项目简介 今天推荐一款商城系统，虽然比较老生常谈了࿰…
1：uniapp路由跳转
1：在当前页面 跳转 到其他页面。
<navigator url"../middle/middle" hover-class"navigator-hover"><button type"default">跳转到middle新页面</button>
</navigator>注意 跳转 得话左上角会有一个返回得箭…
uni-app实现 app 小程序 手机端H5扫码功能
首先 扫码这个功能小程序和App都是有现成的方法 但是H5是不行的 我们可以看这样一段代码
<template><view><!-- #ifdef MP-WEIXIN --><button click"scan">扫描</button><view v-if"result">{{result}}</view>…
uni-app生命周期有哪些？怎么理解？
uni-app生命周期有哪些？怎么理解？
uni-app生命周期有哪些？怎么理解？ 文章目录 uni-app生命周期有哪些？怎么理解？前言一、什么是生命周期函数？二、uni-app生命周期分类总结 前言
UNI-APP学习系…
生命周期 uni-app随笔【uni-app】【vue】【浅谈自学】
文章目录 1、uni-app 生命周期1.1、应用生命周期1.2、页面生命周期1.3、组件生命周期 2、浅谈自学 1、uni-app 生命周期
1.1、应用生命周期
这部分内容在app.vue中，
常用：onLaunch |onShow|onHide
<script>export default {//应用 初始化完成触…
uni-app之使用movable-view组件的详细教程
UniApp是一个基于Vue.js的跨平台开发框架，它可以让开发者使用Vue的语法编写一次代码，然后同时生成多个平台的应用程序，如小程序、H5、App等。在UniApp中，我们可以使用movable-view组件实现视图元素的拖动和移动功能。本文将详细介…
母婴健康老人护理医护上门陪诊产后恢复预约上门小程序源码
母婴健康老人护理医护上门陪诊产后恢复预约上门小程序
在线预约
上门打针
产后恢复
会员卡
余额充值
优惠券
分销商
unippthinkphp <template> <view class"container" :style"{background:pagebase.base.bc}"> <Pengp…
uni-app之用cover-image组件创建全屏背景图的教程
在UniApp中，cover-image组件可以用于创建全屏背景图，为应用程序添加更加吸引人的视觉效果。本教程将详细介绍如何在UniApp中使用cover-image组件，并提供示例代码，帮助您快速上手。
步骤1: 创建新的UniApp项目 首先，您…
uni-app App权限配置参数详情
权限 名称 描述 android.permission.ACCESS_CHECKIN_PROPERTIES 访问登记属性 读取或写入登记check-in数据库属性表的权限 android.permission.ACCESS_COARSE_LOCATION 获取错略位置 通过WiFi或移动基站的方式获取用户错略的经纬度信息,定位精度大概误差在30~1500米 android.pe…
miniprogram-to-uniapp使用指南（各种小程序项目转换为uni-app项目）
小程序分类：uni-app qq小程序 支付宝小程序 百度小程序 钉钉小程序 微信小程序 小程序转成uni_app 小程序转为uni_app 小程序转uni_app 小程序转换 工具现在支持npm全局库、HBuilderX插件两种方式使用，任君选择，HBuilderX插件地址：…
UNI-APP_使用vue3组件通讯,父组件调用子组件方法等
一: 创建child.vue 组件
<script setup>import {defineProps,defineEmits} from vue;// 接受父组件传值const props {info: {type: Object,default () {return {okInfo: {}}}}}console.log(props.info)// 定义返回给父组件的方法const emit defineEmits([change])cons…
uni-app路由拦截
新建一个auth.js /** * description 权限存储函数 */ const authorizationKey Authorization export function getAuthorization() { return uni.getStorageSync(authorizationKey) } export function setAuthorization(authorization) { return uni.setStorageSync(aut…
uniapp系列-报错或常见问题处理集锦
问题一：执行完命令，就不动了，或者是uniapp 遇到编译很慢，无法正常运行的情况
情况1：执行run dev命令后，一直就不动了，输出如下
PS C:\XXXXXXXX> npx yarn run dev:h5
yarn run v1.22.19
wa…
uni-app框架基础知识
uni-app框架基础知识
uniapp就是vue开发，可以使用vue2和vue3的语法，另外编译和运行都最好在HBuilderX中进行生命周期可以使用vue或者小程序的生命周期不同： 最好不要使用vue的路由，直接使用uniapp的路由（它和小程序一…
uniapp：仿微信列表长按弹窗菜单
1.创建子组件wxpup.vue <template><view class"wxpup"><view class"shade" v-show"showPup" click"hidePop"><view class"pop" :style"popStyle" :class"{show:showClass}">&l…
uni-app面试题2023
1.uniapp优缺点 优点: a. 一套代码可以生成多端 b. 学习成本低,语法是vue的,组件是小程序的 c. 拓展能力强 d. 使用HBuilderX开发,支持vue语法 e. 突破了系统对H5调用原生能力的限制 缺点: a. 问世时间短,很多地方不完善 b. 社区不大 c. 官…
微信小程序uniapp基于Android的大学生社交论坛交流app系统
实现一个基于Android的社交APP小程序,一共3个身份，包括老师、学生和管理员，其中老师和学生在手机端注册登录，管理员在web端后台登录。学生和老师登录后可以查询通知新闻信息，收藏信息，查看好友推荐，论坛发帖…
【uni-app】【01】底部导航栏与页面切换
1.(配置文件在哪)uni-app 路由控制是在 pages.json文件中的。 2.(基本配置项有哪些)初学的时候主要有三个配置项，①pages ② globalStyle ③ tabbar [!TOC] 接下来主要是对这三个配置项做一个简单介绍。 pages 负责页面管理。不需要自己写的，你在项目的p…
【翻译一下官方文档】之uniapp的数据缓存
uni.setStorage(OBJECT) setstorage | uni-app官网
uni.setStorage(OBJECT) 将数据存储在本地缓存中指定的 key 中，会覆盖掉原来该 key 对应的内容，这是一个异步接口。 参数名类型必填说明keyString是本地缓存中的指定的 keydataAny是需要存储的内容&am…
uniapp开发微信小程序，路由跳转传参多种方式
方式一：//在起始页面跳转到test.vue页面并传递参数
uni.navigateTo({url: test?id1&nameuniapp
});// 在test.vue页面接受参数
export default {onLoad: function (option) { //option为object类型，会序列化上个页面传递的参数console.log(option.i…
支付宝小程序打包成APP
发行——原生App-云打包——填写安卓包的信息（安卓证书可在香蕉云编下载）——打包——下载APK 第一步：点击菜单栏发行 第二步：选择远程APP-云打包 第三步：在香蕉云编（https://www.yunedit.com/࿰…
【微信小程序】-- uni-app 项目创建 目录结构讲解（四十九）
💌 所属专栏：【微信小程序开发教程】 😀 作 者：我是夜阑的狗🐶 🚀 个人简介：一个正在努力学技术的CV工程师，专注基础和实战分享 ，欢迎咨询！ &…
uni-app带笔锋的电子签名功能
前言
随着时代的反战，以前的手写签名，逐渐衍生出了电子签名，比如钉钉等系统中等电子签名，电子签名和纸质手写签名一样具有法律效应。
作为前端等我们如何实现电子签名呢？其实在html5中已经出现了一个重要等辅助标签—…
uniapp根据经纬度绘制地图定位（APP端）
本篇文章用来为大家提供一个制作简单地图的思路
先来看一眼效果图 步骤： 1.首先一定要仔细阅读uni官网获取位置文档，否则会踩大坑 2.其次配置manifest.json文件，获取当前用户的地理位置经纬度信息。 3.然后进行map方法绘制地图信息。 4.滑动…
uniapp项目打包apk相关（androidStudio，Hbuildx，dCloud）
1、先注册和登陆dCloud平台，管理应用信息。 需要准备的参数(3个) APP_ID（如：__UNI__123ABCD） 包名（如：com.hx.mhoa） 应用签名（应用sha1，应用md5，应用sha256&…
UniApp + SpringBoot 实现接入支付宝支付功能和退款功能
一、支付宝开放平台设置 注册支付宝支付功能需要个体工商户或企业才可以！需要有营业执照才能去申请哦！ 1、登录到控制台
进入支付宝开放平台 控制台 2、开发设置 3、产品绑定APP支付
如果没有绑定APP支付就会报商家订单参数异常，请重新发起…
基于JavaSpringBoot+Vue+uniapp实现微信小程序新闻资讯平台
博主介绍：✌全网粉丝20W,csdn特邀作者、博客专家、CSDN新星计划导师、java领域优质创作者,博客之星、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和毕业项目实战✌ 🍅文末获取源码联系🍅 👇🏻 精彩专…
uniapp实现微信小程序的电子签名
签名页的效果如图下所示： 封装的组件代码如下所示：
<template><view><view class"wrapper"><view class"handBtn"><button click"handleReset" class"delBtn">清除</button&…
uni-app开发小程序使用uni.chooseMedia选择图片，安卓手机无法选择图片
uni-app开发小程序时，使用uni.chooseMedia选择图片，苹果手机是正常的，安卓手机无法打开手机选择图片 问题复现解决方法！！我的反思与总结 问题复现
一、在小程序中，选择图片并上传，是一个很常见…
uniapp和springboot微信小程序开发实战：后端架构搭建之封装WEB接口返回对象
文章目录 前言本节所需依赖工具类实现测试代码运行结果总结前言
作为开发者，开发的接口请求返回数据类型有很多种。比如返回字符串，返回对象，返回集合数组等情况，每个人开发者都有自己喜欢的方式或风格。所以在一个项目开发的时候架构师会定义好返回对象，给前端返回数据格…
前端vue地图定位并测算当前定位离目标位置距离
前端vue地图定位并测算当前定位离目标位置距离, 下载完整代码请访问uni-app插件市场地址: https://ext.dcloud.net.cn/plugin?id12974
效果图如下: #
#### 使用方法
使用方法
<!--
// 腾讯地图key注册地址（针对H5端，manifest.json中web配置&…
uniapp实现app检查更新与升级-uni-upgrade-center详解
app检查更新与升级
参考链接： 升级中心uni-upgrade-center - App uni-admin h5 api App资源在线升级更新 uni-app使用plus注意事项 关于在线升级（WGT）的几个疑问 什么是升级中心uni-upgrade-center uniapp官方开发的App版本更新的插件&#…
uni-app 消息推送功能UniPush
uni-app 消息推送功能UniPush,这里用的是uni-app自带的UniPush1.0（个推服务），所以只针对UniPush1.0介绍实现步骤。 建议查阅的文章： UniPush 1.0 使用指南[2] Unipush 常见问题[3] 当然现在已经出了UniPush2.0（HBuilde…
【样式】input 输入框 和 选择框，增加，删除
效果图 uview
<template><view class"addbox"><view class"order bgf u-m-b-200"><view class"common_title u-p-b-30"><text></text> 商品清单</view><view class"shangpinbox u-m-b-20&qu…
(小程序)基于uniapp+vite4+vue3搭建跨端项目|uni-app+uview-plus模板
(小程序)基于uniappvite4vue3搭建跨端项目|uni-appuview-plus模板 版本信息：
HBuilderX: 3.8.4
Vite: 4.2.1
uView-Plus: 3.1.31一、创建uniappvue3项目： 点击编辑器的文件 > 新建 > 项目（快捷键CtrlN） 2.选择uni-app项目&…
uniapp微信小程序，根据用户当前位置计算用户到附近机构/商店的距离
1、首先要弄清楚后端传过来的经纬度是属于哪一类，一共有三大类，分别是：WGS84，GCJ02，BD09 WGS84：为一种大地坐标系，也是目前广泛使用的GPS全球卫星定位系统使用的坐标系。 GCJ02：又称…
vue和uniapp的网络请求封装
目录
一、vue请求封装
二、uniapp请求封装
一、vue请求封装
在项目的src文件夹下新建一个request文件夹，里面的request.js就是放封装代码的地方。api.js里面引入,然后去写对应的请求。 import axios from "axios"
const instance axios.create({base…
【uni-app】【基于jQuery Ajax】[sd.js]最新原生完整版for凯哥API版本
import $g from "./sg";//常用路径________________________________________________________________________________const API_ROOT_URL "https://www.shuzhiqiang.com/api"; //生产的IP//一些前提条件和方法_______________________________________…
【uni-app教程】九、运行环境判断与跨端兼容
（1）开发环境和生产环境 uni-app 可通过 process.env.NODE_ENV 判断当前环境是开发环境还是生产环境，一般用于连接测试服务器或生产服务器的动态切换。 在HBuilderX 中，点击「运行」编译出来的代码是开发环境，点击「发行…
如何使用uni-app开发微信小程序
web前端-基于uniapp的微信小程序项目 起步uni-app简介开发工具下载 HBuilderX安装 HBuilderX安装 scss/sass 编译快捷键方案切换修改编辑器的基本设置新建uni-app项目把项目运行到微信开发者工具 scss语法学习安装相关插件和配置基础格式选择器的嵌套父选择器后面添加内容 &…
uniapp + vue3 + uviewPlus 搭建多端项目框架
随着vite.js越来越受开发者青睐，很多大厂的项目都偏向于vue3开发，想着uniapp搭配vite4.x搭建多端项目效果会怎么样？经过一番实践发现果然不错！ 版本信息
HBuilderX: 3.8.4
Vite: 4.2.1
uView-Plus: 3.1.31初始化uniappvue3项目
…
uni-app - - - - - 小程序使用background-image无效？
小程序使用background-image无效1. 用image标签代替样式背景图2. 将图片转换为base64编码3. 直接在标签上写入4. 将路径改成可以直接访问的绝对路径如题目所说，在开发小程序时，遇到该问题，该如何解决呢？？？ …
uniapp - 全平台兼容的 “多图上传“ 功能，搭配 uview 组件库中的 upload 上传组件（附带详细的示例源码及注释，可直接复制使用或简单修改）
效果图
使用 uniapp 开发，多平台全端兼容的多图上传功能，支持限制个数及移除等。
组件库使用的是 uview 框架，上传组件基于 Upload组件，功能完美无bug。<
3，uniapp功能之—蓝牙秤，连接蓝牙秤获取重量实时显示在页面上（坤宏的蓝牙秤）
1，在component里面新建一个blueTooth.vue组件
<template><view><view v-for"(item,index) in devices" :key"index" class"boxs" click"BlueIds(item)"><view>设备名称：{{item.name}}…
10 - 热播模块实现
热播模块实现
10-1：开篇
在本章节中我们将要完成【慕课热搜】中的最后一个模块【热播】。
【热播模块】分为两个页面：
热播列表热播详情
对于【热播列表】而言，包含：
下拉刷新 上拉加载更多视频播放（video 组件…
前端Vue分享菜单按钮弹框、微博分享、QQ分享、微信好友、朋友圈
前端Vue分享菜单按钮弹框、微博分享、QQ分享、微信好友、朋友圈 ， 下载完整代码请访问uni-app插件市场址:https://ext.dcloud.net.cn/plugin?id13085
效果图如下： #### 使用方法
使用方法
<!-- 分享 ref: 设置一个唯一ref contentHeightÿ…
springboot+uniapp医院挂号系统源码
开发环境及工具：
大等于jdk1.8，大于mysql5.5，idea（eclipse），HBuilder X
技术说明：
springboot mybatis uniapp
代码注释齐全，没有多余代码，适合学习(毕设)࿰…
uni-app uni-file-picker文件上传实现拍摄从相册选择获取图片上传文档服务器
前言 最近在使用uni-app写H5移动端，有一个从手机拍摄从相册选择获取图片上传到文档服务器功能。 查阅uni-app发现关于上传图片，uni-file-picker文件上传，uni.chooseImage，uni.uni.uploadFile 它和pc端原理差不多，都是…
学习笔记（2）项目结构描述 - manifest.json和pages.json
目录 1，manifest.json2，pages.json2.1，pages2.2，globalStyle2.3，tabBar 1，manifest.json
官方详情 uni-app 的 appid 由 DCloud 云端分配，主要用于 DCloud 相关的云服务，请勿自行修…
学习笔记（4）页面开发
目录 1，页面开发1.1，标签类1.2，资源引用1.3，页面跳转 2，开发规范2.1，应用生命周期2.2，页面生命周期：2.3，条件编译 3，注意事项 1，页面开发
1.1&am…
uni-app的生命周期
1.应用生命周期
函数名说明onLaunch当uni-app 初始化完成时触发（全局只触发一次）onShow当 uni-app 启动，或从后台进入前台显示onHide当 uni-app 从前台进入后台onError当 uni-app 报错时触发onUniNViewMessage对 nvue 页面发送的数据进行监听…
UNIAPP实战项目笔记66 当前用户更改购物车商品数量的前端和后端交互
UNIAPP实战项目笔记66 当前用户更改购物车商品数量的前端和后端交互
思路 前端改变数量的时候将数据发送到后端 后端接收到数据后更改数据库中的数据 案例截图 代码
前端代码 cart.js
export default{state:{list:[/* {id:1,name:"332经济法能聚聚会技能大赛 经济法能聚…
uniapp学习日记之request自定义请求头
uniapp学习日记之request自定义请求头
在学习uniapp的过程中，由于笔者是从Vue项目转来学习uniapp，在使用uni.request时，发现在浏览器调试时，无法在请求头header中添加token字段，愤而弃之，便开始使用axios组…
uniApp通过javascript渲染组件、js、JS、appendChild、removeChild、map、require、extend、mount
文章目录 前言1、组件2、实现js调用挂在组件3、使用 前言 项目开发中基本都会用到组件库，但是设计稿样式和功能不一定和组件库相同，尤其像是消息提示弹窗、确认弹窗，各个项目各个设计师都有自己的一套风格。虽然我们可以使用组件库中的组件对…
UniApp之使用manifest.json应用配置的详细教学
manifest.json 文件是 UniApp 开发中用来配置应用信息的重要文件。通过修改 manifest.json 文件，开发者可以配置应用的名称、图标、启动页面、权限等信息。本文将为您提供详细的教学，介绍如何使用 manifest.json 文件进行应用配置，并提供示例…
前端Vue自定义滚动卡片，可以用于商品海报生成
前端Vue自定义滚动卡片，可以用于商品海报生成， 下载完整代码请访问uni-app插件市场地址：https://ext.dcloud.net.cn/plugin?id13189 实现代码如下：
# cc-scroolCard
#### 使用方法
使用方法
<!-- dataInfo：滚动…
将h5项目转成uniapp小程序
打开微信开发者工具，新建项目；pages下index文件中index.wxml文件打开内容全删除；写入<web-view srchttp://域名.com/></web-view>；编译，成功在小程序中展示；其后，正常按照小程序流程…
uniapp在IOS系统上无法横屏问题
问题:在安卓或者系统系统上调用横屏plus.screen.lockOrientation(‘landscape-primary’);失效。 解决方案:在manifest.json配置 代码如下: “flexible” : true, “screenOrientation” : [ “portrait-primary”, “landscape-primary” ],
/* 5App特有相关 */"app-plu…
前端Vue自定义发送短信验证码弹框popup 实现剩余秒数计数 重发短信验证码
前端Vue自定义发送短信验证码弹框popup 实现剩余秒数计数 重发短信验证码， 请访问uni-app插件市场地址：https://ext.dcloud.net.cn/plugin?id13207
效果图如下： 实现代码如下:
# cc-codeDialog
#### 使用方法
使用方法
<!-- show:是…
5分钟使用UNI-APP框架创建你的第一个项目
UNI-APP学习系列
5分钟使用UNI-APP框架创建你的第一个项目 文章目录 UNI-APP学习系列前言uni-app框架创建项目一、HBuilderX可视化方式二、 vue-cli命令行方式 总结 前言
UNI-APP学习系列之5分钟创建自己的第一个uni-app项目。 uni-app框架创建项目
创建方式 一、HBuilderX可…
uni-app--》uView组件库：提升您的uni-app开发体验
🏍️作者简介：大家好，我是亦世凡华、渴望知识储备自己的一名在校大学生 🛵个人主页：亦世凡华、 🛺系列专栏：uni-app 🚲座右铭：人生亦可燃烧，亦可腐败…
2023年试用uniapp、vue2、vue3、typescript、vite、nvue
1. 前言
试用了一下 uniapp、vue2、vue3、typescript、vite、nvue 等技术，写了两个页面，两个页面加起来不到400行代码。
尝试使用了四种组合：
组合1：uniapp vue2 JavaScript nvue文件 非fast模式
组合2：uniapp…
uni-app打包ios的步骤
注意：下面的操作必须同时满足三个条件，且这三个条件都是必须得： 1.有一个苹果开发者账号(要收费) 2.有一台苹果笔记本(在笔记本上生成证书和文件) 3.有一部苹果手机(用于测试app的功能) 使用uniapp发布ios的应用的步骤如下： 点击发…
uni-app uni.switchTab和uni.reLaunch跳转tabbar页面
uni.switchTab： 跳转列表不会刷新 跳转到 tabBar 页面，并关闭其他所有非 tabBar 页面。
uni.reLaunch： 跳转列表会刷新 关闭所有页面，打开到应用内的某个页面。（可以跳转到tabBar 页面） 但如果是列表的自定…
uniapp 使用组件 uni-list 实现聊天列表功能
如何使用 uniapp 的组件实现聊天列表的功能呢，翻阅了半天文档，终于找到一个实用的方法，下面是具体的步骤 1、首先需要下载对应的插件
去uniapp的官方文档进行下载（uni-ui - DCloud 插件市场），这里直接下载…
用VScode搭建uni-app项目（较全）
cli工程全局安装vue-cli
npm install -g vue/cli通过cli创建uni-app项目 vue create -p dcloudio/uni-preset-vue uni-app选择项目模板，可自由选择如下图： 创建uni-项目 使用vscode打开创建的项目 安装vue语法提示插件
cli工程自带uni-app&5app…
uniapp 页面滚动获取元素高度
onPageScroll() {let _this this;let info uni.createSelectorQuery().select(".entity-box");info.boundingClientRect(function(data) { //data - 各种参数// console.log(data) // 获取元素宽度// 下面的容器露出相应的结算栏就置于底部if (data.top < 0) {_…
uniapp开发小程序-swiper点击预览大图（商品详情页轮播图）
1.实现效果： 2.具体代码：
<view class"swiper_box"><!--轮播图--><swiper class"ms_swiper" :autoplay"true" circular"true" change"swiperChange"><swiper-item v-for"…
uniapp微信小程序 map地图markers图标不显示，markers图标真机调试不显示
uniapp微信小程序 map地图markers图标不显示，markers图标真机调试不显示
举例：
预期效果如下，蓝色为用户位置，红色为店铺位置均为自定义图标 实际发布后手机上的效果 （此处忽略位置先只关注图标问题）可以…
uniapp 开发小程序之实现不同身份展示不同的 tabbar（底部导航栏），附带相关问题解答
效果展示： 引言
在开发过程中逐渐意识到uniapp原生的tabbar可能不能满足开发要求，通过浏览博客才选择使用uView的Tabbar 底部导航栏来实现，我选择用的是2X版本
安装
我是使用Hbuilder插件的方式引入的组件库，安装配置可以看这篇…
uni-app配置微信小程序上传代码时自动压缩wxml文件
在项目根目录的manifest.json中的源码视图配置**“minifyWXML” : true**
"mp-weixin" : {"appid" : "wx04a9b04109548e48","setting" : {"urlCheck" : false,"es6" : true,"minified" : true,"p…
【uniapp-内置组件editor富文本编辑器】
在b站跟着咸虾米老师学的
editor组件
<template><view class"edit"><view class"title"><input type"text" v-model"artObj.title" placeholder"请输入完整的标题" placeholder-class"placehol…
uni-app将rpx转px
sizeDeal(size) {const info uni.getSystemInfoSync()this.scale 750 / info.windowWidth;// 分离字体大小和单位,rpx 转 pxlet s Number.isNaN(parseFloat(size)) ? 0 : parseFloat(size)let u size.toString().replace(/[0-9]/g, ).replace(-,)if (u rpx) {s / this.sc…
uniapp获取手机号（前端部分，仅供参考~）
html部分 <template><view><view>手机号：{{phone || 请获取手机号}}</view><button open-type"getPhoneNumber" getphonenumber"getPhoneNumber">获取用户手机号</button> </view>
</template>…
uniapp 图片预览
一、图片预览
此有两个知识点：array.map( )方法 和 uni.previewImage()
HTML部分
<view class"rightPic" v-for"(item,index) in picsList" :keyindex><!-- 给图片一个框 --><image class"img" click"preview…
uniapp —回调函数callBack
什么是回调函数（callBack）？
当程序跑起来时，一般情况下，应用程序（application program）会时常通过API调用库里所预先备好的函数。但是有些库函数（library function）却要…
uni-app-微信小程序打开问题
今天在HBuilder创建了新的项目，运行到微信小程序的时候，发现没有直接打开，而是显示以下，不能直接打开我要看的页面，然后点击加号添加，选中我要打开的目录文件也不行，于是我打开之前的项目&#…
uniapp中uni-popup的用法——实例讲解
uni-pop弹出层组件，在应用中弹出一个消息提示窗口、提示框等,可以设置弹出层的位置，是中间、底部、还是顶部。
如下图效果所示：白色区域则为弹出的pop层。 一、 创建一个自定义组件：
1.项目中安装下载uni-pop插件。
2.把pop内容…
【uniapp开发小程序】实现粘贴一段文字后，自动识别到姓名/手机号/收货地址
一、需求
在uni-app中开发小程序，实现粘贴一段文字后自动识别到手机号，并将手机号前面的内容作为姓名，手机号后面的内容作为收货地址，并去除其中的特殊字符和前缀标识。
实现效果：
二、实现方式：
<…
【uniapp开发小程序】点击获取手机号（使用@getphonenumber）
一、实现效果 二、代码实现：
<template><view><view class"shopadd" v-if"info.mobile">{{info.mobile}}</view><button class"getNumber" v-else open-type"getPhoneNumber" getphonenumber…
uni.navigateBack() 返回上级页面并传参
一、需求 在A页面中通过跳转到B页面，在B页面中处理的数据，需要跳转回A页面供其使用 二、代码实现：
B页面： // 返回A页goToA(index){// 1. 获取当前页面栈实例（此时最后一个元素为当前页）let pages getCur…
split()方法详解
split（）方法详解 1.split()主要是用于对一个字符串进行分割成多个字符串数组。标准形式为String [] strings str.split(“”); 2.split()方法中括号中的参数可以为一个也可以为多个，每个参数之间用|隔开。并且每个参数之间要紧挨着|。 如&am…
小程序（uniapp）页面的跳转方式有哪些，他们之间的区别是什么？
1、uni.navigateTo: 保留当前页面，跳转到应用的某个页面，使用 uni.navigateBack 可以返回原页面。这种方式类似于网页的超链接跳转。
2、uni.redirectTo: 关闭当前页面，跳转大应用内的某个页面。这种方式类似于网页的重定向。
3、uni.switc…
uniapp radio如何实现取消选中
uniapp 内置radio组件明确表示，不能取消选中，那如果要实现取消选中呢？ 只要在外层加上label或者其他标签包裹，或者直接加入click事件然后加入事件控制radio的值改变即可
<label class"radio" click"changeAll&…
前端Vue自定义简单通用省市区选择器picker地区选择器picker 收获地址界面模版
前端Vue自定义简单通用省市区选择器picker地区选择器picker 收获地址界面模版，下载完整代码请访问uni-app插件市场地址：https://ext.dcloud.net.cn/plugin?id13266
效果图如下: 代码实现如下：
# cc-selectDity
#### 使用方法
使用方法
…
uniapp导航栏点击切换特效 下边框跟随动态变化
前言
本人几率代码方便以后使用，导航栏下边框跟随特效
<template><view class"video"><view class"topbar"><scroll-view scroll-x"true"class"scroll-view"><view class"rel">…
uniapp uni-icons 组件为例 带着大家使用并熟悉一次文档
首先 要在应用市场中导入 这是个前提 https://ext.dcloud.net.cn/plugin?id28
uni的组件都可以直接进入官网 https://uniapp.dcloud.net.cn/ 然后点击右上角的搜索 直接在输入框中 搜索 uni-icons 下面内容就都出来了 先看下面的 API 看看每个字段都是干什么的 这里 我们…
【uniapp】app端压窗屏设计
一、前言
众所周知，在app端中，普通的组件是无法覆盖原生组件，即使是官方提供的cover-view也只是在实体内容中覆盖一些原生的如地图。但是无法覆盖底部的tabbar。
二、了解层级关系
实际上app端每点击一次的层级是这样的，我们可…
【uni-app从入门到实战】商品列表
文章目录导航改造商品列表上拉加载更多下拉刷新导航改造
现在把导航的数据放入 data，通过 v-for 循环展示，然后给导航增加 click 事件，点击跳转对应页面（要跳转的页面暂时没有，后边会新增）
<template&…
【uni-app从入门到实战】组件学习
文章目录创建组件组件生命周期组件之间的通讯方式父给子组件传值子给父组件传值兄弟组件传值uni-ui组件库的介绍和使用日历组件使用uni_modules处理外部应用请求未能完成创建组件
在 uni-app 中，可以通过创建一个后缀名为vue的文件，即创建一个组件成功&…
uni-app 中如何实现触底加载功能
👨🏻💻 热爱摄影的程序员 👨🏻🎨 喜欢编码的设计师 🧕🏻 擅长设计的剪辑师 🧑🏻🏫 一位高冷无情的编码爱好者 大家好，我是全栈 …
【uniapp微信小程序】如何将uni目录下static里的txt文件内容展示在页面上？
实现uni目录下static里的txt文件内容展示在页面上 一、需求：二、实现原理：三、实现步骤及相关代码：1. 首先在static文件夹下，创建一个txt文件，比如说文件名为content.txt。2. 在页面的 script 标签中使用 uni.request …
【uniapp】踩坑日记核心重点
一、scroll-view内部使用弹出层问题 在uniapp中使用scroll-view标签，其内部如果调用了poup等类似全局的弹出层，弹窗后引发相关的问题（弹出层始终仅在scroll-view内部），难以察觉找到问题所在。（h5端一般是正…
uni-app学习笔记(4)：api
文章目录1、设备相关2、加速度计3、拨打电话4、扫码5、剪切板6、屏幕亮度7、震动1、设备相关
系统信息
uni.getSystemInfo({success: function(res) {console.log(res.model);console.log(res.pixelRatio);console.log(res.windowWidth);console.log(res.windowHeight);conso…
uni-app组件通信
uni-app的通信方式和vue小程序是一样的 但语法上采用了vue的 主要分为 父传子 : props 子传父 通过 v-on 简写 兄弟组件通信 uni.$on 首先是父传子 父组件
<template><view class"content"><assembly :name"name"></assembly>&l…
uni-app组件生命周期
其实学过vue和小程序的人再来看uni-app真的会非常简单 其实他就是两种语法的融合 uni-app新增了整个应用程序的生命周期 延用了小程序组件和单页面都有自己不同的生命周期的做法 但有延用了 vue 单个vue文件即为一个组件 也可以是单独页面的特性 页面生命周期更像是小程序的生命…
uniapp的navigator页面跳转遇到的问题
文章目录 先看路由index组件login组件最后再从index转到login（问题） 先看路由
主页默认加载的index "pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages{"path"…
uni-app跨端兼容之条件注释
跨端兼容对uni来说确实是挺有必要的，因为uni-app本身就是一个多端开发的技术，可以用于多种应用但也难免存在不同应用的兼容问题 例如 一个功能在网页端能正常执行 但放到小程序或APP应用中就没用了 确实我觉得多端兼容实现的并不完全算是兼容 叫条件注释…
uniapp和springboot微信小程序开发实战：前端架构之微信小程序开发表单提交功能
文章目录 前言前端代码后端代码controller层service层总结前言
基本上很多项目都有类似于意见反馈、留言等形式的表单提交功能，今天给大家介绍的是使用uniapp和vue组件实现的表单提交功能。其效果如下：
前端代码
<template><view class="body"><…
【uniapp开发H5】对接阿里云滑动验证
大家好！！！在一次项目里由于接口一直被刷，所以用了阿里云验证，实现功能：签名校验成功后才可发送验证码，每次滑动生成的签名只能使用一次，从而防刷。
一、页面vue内容，这里…
uni-app通过canvas将两张图片合成一张图片
uni-app通过canvas将两张图片合成一张图片
如果出现在开发工具工具中可以合成并查看，在真机预览时只有打开调试面板才能看到合成的图片，极大可能线上图片的地址中包含的域名，在微信呢后台没有配置，这时要检验一下微信后台配置的d…
uni-app图片上传和图片预览功能实现
图片上传用到的是 uni.chooseImage 演示代码如下 uni.chooseImage({//可上传的最大数量count:5,//上传成功后的回调success: res >{//答应返沪信息 res.tempFilePaths返回的是你上传的所以图片的路径数组console.log(res.tempFilePaths)}})实现图片预览用到了uni.previewIm…
小程序中base64格式和图片互转
小程序中base64格式转成图片
base64转图片
//base64转图片
base64src(base64data, cb) {const fsm wx.getFileSystemManager();const FILE_BASE_NAME code; //自定义文件名const [, format, bodyData] /data:image\/(\w);base64,(.*)/.exec(base64data) || [];if (!format…
display:inline-block属性的标签出现的问题及解决方法
我是在用uni-app的scroll-view组件出现的问题，这个办法顺利解决 https://blog.csdn.net/wyyandyou_6/article/details/81193601
uniapp分享到微信好友和朋友圈
uniapp分享到微信好友和朋友圈
首先目前的微信小程序只支持页面中右上角三个点触发分享功能，页面按钮只能触发分享至微信好友的功能
<template><view class"share"><button open-type"share"> //open-type"share"…
uni-app配置请求头信息，发送网络请求
之前写过小程序封装一个请求类的方法，其实uni.-app的请求方法和小程序的写法基本是一样的
uni.request({//api地址url: 接口地址,//设置请求类型等于外部传入类型method: get,//设置参数为外部传入值data: {},//配置请求头信息header: {//返回数据类型"conten…
uni-app应用生命周期
uni-app除了页面自己的生命周期外，也有整个应用的生命周期 写在App.vue文件中
onLaunch :当应用启动时触发的生命周期，H5页面运行应用时 刷新页面同样可以触发这个生命周期
onShow : 应用被显示时触发，网页运行时，你可以切换到…
uni-app 生命周期
uni-app 生命周期分为应用生命周期、页面声明周期、组件生命周期，详细请参考uniapp官方API
应用生命周期
uni-app 支持 onLaunch、onShow、onHide 等应用生命周期函数。
函数名说明onLaunch当uni-app 初始化完成时触发（全局只触发一次）onS…
安装sass报错解决方案
最近跟着B站视频学习前端开发：https://www.bilibili.com/video/BV1Sc41187nZ?p7 按照老师给的指令，在cmd里安装sass，一直报错。 在网上各种找资料，webpack fibers sass-loader node-sass，挨个装了个遍，不停…
uniapp中@tap和@click的区别
uniapp中tap和click的区别
在HbuilderX中，两者都是点击时触发事件；不同的是：
click是组件被点击时触发，会有约300ms的延迟（内置处理优化了）；tap是手指触摸离开时触发，没有300ms的延…
关于uniapp中navigateTo跳转不生效的解决办法
前言：如果你无论怎么弄都不生效，而且调试不报错！那这个可能会帮到你，因为我自己就是这样的，特此记录一下。
解决办法： 查看自己项目中的pages.json配置文件中是否配置了你所要跳转的目标页面的路径&#x…
记录---app中 使用openlayers 地图添加图标不显示问题
在app中 openlayers 添加图标，图标一直不能显示： 如图所示 原因是，路径前面不能加斜杠 image: new Icon({src: /static/dingwei.png,scale: 0.2})
正确写法如下：改完就可以显示了
const myLocationLayer new VectorLayer({map:…
uniapp使用Vuex mapGetters全局变量
详细讲解前言定义comm.js文件定义getters.js文件定义index.js文件使用监听值的变化前言
现在需要满足这样一个场景： 很多页面都要共用一个变量的值，同时要监听变量值的变化，随之做相应的操作，如果用页面传参之类的方法就太费劲了…
uni-app swiper自定义指示点 和 数字胶囊指示点
使用swiper时，需求要把轮播图上的指示点要做成自定义和数字的，做个笔记记录下。
自定义指示点 <template name"swiperBox"><view class"swiperUnit"><swiper change"swiperChange" :interval"4000&…
uni-app ios跳转京东
uni-app的ios跳转京东领劵功能
需要在manifest.json文件中配置白名单，主要是用作打开其他app "ios" : {"urlschemewhitelist" : "jdlogin,openapp.jdmobile"}废话不多说 上重点， 传参需要经过encodeURL进行转义才行&…
uniapp scroll-view 回到顶部
点击tab切换时，我们希望列表从顶部开始scroll-view 提供了scroll-top属性
scroll-top设置
只是设置scroll-top时不好使的，这里需要注意scroll 方法
//template
<scroll-view :scroll-top"scrollTop" scroll-y"true" class&qu…
uniapp监听手机侧滑返回事件。
这篇文章是应一个粉丝的需求更新的！你们看我多宠粉！ 若在App首页，点击手机物理返回键，此时无返回页面可关闭，uni-app默认会提示“再按一次退出应用”；若想自定义退出信息，如修改为：…
前端Vue基于腾讯地图Api实现的选择位置组件 返回地址名称详细地址经纬度信息
前端Vue基于腾讯地图Api实现的选择位置组件 返回地址名称详细地址经纬度信息， 下载完整代码请访问uni-app插件市场地址：https://ext.dcloud.net.cn/plugin?id13310
效果图如下： #### 使用方法
使用方法
<!-- leftTitle:左边标题 name&…
我的第一个uniapp
展示一下我学习uniapp第一个完成的小东西，主要是跟着某站的视频学习的，接口也是可以使用，所以就无须自己写了，这个小项目里很多逻辑是自己写的，没有照搬老师的思路，运用的ui库是2.0的uview，视频…
uniapp 封装 navbar tabbar
最近换了一家公司工作
因为上家公司老板给的钱不多 还特别会压榨员工
好了好了，不扯皮了
1、封装navbar：
首先需要在pages.json中将对应页面的原生navbar给取消
举例：
{"pages": [{"path" : "pages/home/inde…
基于workerman 即时通讯聊天（uniapp + pc）
laychat workerman 实现 webIM即时通讯系统
下载 laychat-master.zip
https://github.com/hszyh/laychat 实现了功能: 1、通过snake后台实现对聊天成员的增删改查，动态推送给在线的用户 2、实现了群组的查找 3、实现了创建我的群组,删除我的群组,添加群组成员…
如何在uniapp的onshow 接受参数？
在日常使用uniapp开发，我们正常接受参数的方式如下： 正常页面 onLoad 可以接收上个页面的参数
onLoad(options) {const data options.data;if (data) {this.formData JSON.parse(data);}},但是 onLoad() 页面只会加载一次。
现在有这么一个应用场景&…
uniapp 详细封装缓存定时过期方法，详细使用过程
最近在开发一个uniapp的项目，中间我们需要给缓存定时，为了解决这个问题，封装了一个方法用来解决这个问题，当时遇到这个问题是因为在项目中要给阿里的OSS上传文件，上传之间先要向服务端请求获取授权，授权我们…
uniapp 对接萤石，兼容所有端
1.对接萤石的方式有很多种，我们常用的是官方的sdk **
2.实行的技术方案
2.1 webview
通过在hybrid/html和创建的页面的确可以支持官方sdk，但是这会造成页面的卡顿，消耗大，且页面直接互相通信麻烦(官方有提供通信方式案例)
2.2…
【uni-app从入门到实战】组件和样式学习
文章目录Text组件view组件button组件image组件样式学习rpximport字体图标scss使用组件使用入门教程Text组件
Text 是文本组件，用于包裹文本内容。相当于 html 中的 span 标签。text组件官方文档
<view><text>宇宙山河烂漫，生活点滴温暖<…
uniapp小视频项目：底部菜单栏编写、导航栏编写
文章目录1、新建 uni-app 项目2、增加底部导航组件3、使用iconfont4、导航栏编写1、新建 uni-app 项目
①新建 uni-app 项目 uniapp-video ②新建 follow.vue ③设置 tabbar pages.json 增加代码
"tabBar": {"list": [{"pagePath": "pag…
uni-app学习笔记(5)：api
文章目录1、界面交互2、设置导航条3、设置tabbar4、下拉刷新5、页面间传值6、跨端兼容7、分享8、原生子窗体1、界面交互
消息提示框显示与隐藏
//显示
uni.showToast({title: 标题,duration: 10000
});
//隐藏
uni.hideToast()2s后显示的 loading 提示框消失
uni.showLoad…
uni-app学习笔记(1)：模板语法
文章目录下载uni-app开发工具HBuilderX学习 uni-app 教程笔记1、显示 hello word 的几种方式2、绑定样式的写法3、事件绑定4、条件渲染5、列表渲染6、v-model下载uni-app开发工具HBuilderX
1、HBuilderX下载地址: 下载地址 2、下载后解压，双击解压后的 HBuilderX.e…
uniapp横向滑动完整代码
效果：横向滑动
<template><view class"content"><scroll-view scroll-x"true" class"scroll"><view class"box"><image src"http://b-ssl.duitang.com/uploads/item/201703/01/20170301…
uniapp中popup组件中的使用以及坑
实现效果：点击实现弹出层 根据插件市场的来 但是在引入的时候因为我位置不对，所以我引入的时候没按照图上面顺序引入 就报错click is not a function 什么的 百度半天也没找到什么原因 ，就在准备放弃的时候 准备删除引入的时候发现自己引入的…
在 uniapp 中引入 阿里矢量图
废话不多说，，直接上 ( 详细 ) 步骤： 这样就完成了在 uniapp 中引用 阿里矢量图 路见不平一声吼，
uniapp开发，app手机状态栏问题挡住问题、小程序关闭过滤无依赖文件
问题：在使用uniapp开发手机App时，因为HBuildX创建的应用默认是沉浸式样式，如果去除自带的导航栏之后，页面会直通手机顶部状态栏，解决办法如下：
方法1：使用uniapp官方文档提供的解决方案https:/…
uniAPP-web2App 侧滑 | h5打包后的app侧滑解决方案及使用方法
1.h5打包后的app侧滑解决方案
我是看到很多这种解决方案，对于第一次遇到这种需求（或者bug问题）的人，只知道这样可以用，但不知道怎么用，为了避免浪费大家时间，我找了更多博主的博文对比之后发现…
uni-app购物车-全选、反选、逐个选中
这里要实现的需求是： 1，点击全选，则全选，再次点击，则取反 2，全选状态下，取消某一个商品，则全选状态消失 3，有些选中，有些没选的状态下，勾选上所有…
uni-app吸顶+带动画滑动的tabs导航栏
需求就是两点： 1，页面滚动到该导航位置吸顶 2，导航tabs切换带动画，包括下划线
效果如下：
首先是可滑动，用scroll-view实现，然后吸顶效果是在Dcloud是在市场找的，下划线滑动动画是…
uni-app小程序--授权登录、分享页面
uni-app框架写小程序如何微信授权、分享页面首先明确思路：1.将判断用户是否授权逻辑放在App.vue里，每次用户进入mounted， 判断用户是否已经授权过，将授权状态存在vuex里，(我测试时先存在了storge里)
setting(){const …
UNI-APP_subNVue原生子窗口使用，web-view层级问题解决
subNVues文档 app-subnvues文档 subNVues开发指南
需求：在pages/cloud_control/index页面使用subNVue原生子窗口
1.pages文件配置
"app-plus": {"bounce": "none","subNVues":[{"id": "control_popup&qu…
uniapp+HbuilderX配置打包发布
一个用uniapp开发的跨平台老项目，需要修改点内容然后发布一个新版本。 研究了下配置证书、打包、发布等。
首先修改项目需求，修改版本和build 期间遇到一些问题，无法识别*.vue，需要安装node，此处不简述了，…
面向初学者的物联网全栈开发指南 - 5 - uniCloud对接
在上一章中，我们从IOT云平台向下发展，完成了硬件侧到IOT平台的对接，从这一章开始我们从IOT云平台向自己的服务侧发展。我们采用基于Javascript的uniCloud作为服务侧。
1. 准备工具
HBuilderX (HBuilderX-高效极客技巧 (dcloud.io))
2. IOT…
uniapp使用空格占位符无效
uniapp文档： 错误写法：
<text>筛 选</text> 正确写法：
<text decode>{{ 筛 选 }}</text> //要加decode属性，且内容必须包裹在{{}}
uni-app带你看一个不一样的view之hover-class
最近在uni-app发现它的view组件太好玩了 用法很平常
<view>你好
</view>但它的标签属性很有趣 首先是 hover-class 设置原生被点击时展现的class属性 例如 我们设置
<style>.bdo {background-color: #007AFF;}.bdo1 {background-color: #4CD964;}
</sty…
uniapp使用vue语法注意事项,有vue基础学uniapp要多久
uniapp和vue有什么区别？
vue和uni-app的区别如下：1、uni-app可以通过打包实现一套代码多端运行，而vue不行。2、uni-app有自动的框架预载，加载页面的速度更快，vue没有。
3、uniapp使用小程序的标签，vue使用…
uniapp 实现滑动视图切换 顶部滚动导航栏
无论小程序的时候一般有这个功能,在页面处于首页时候,滑动视图,切换视图顶部滚动导航也跟着切换 1.想要实现这个功能就需要实现顶部导航栏,首先实现顶部滚导航栏 点击高亮颜色显示 模板代码
<scroll-view scroll-x"true" class"scroll-content" >
…
uni-app 运行时报错“本应用使用HBuilderX x.x.x 或对应的cli版本编译，而手机端SDK版本是x.x.x。不匹配的版本可能造成应用异常”
uni-app 运行时报错“本应用使用HBuilderX x.x.x 或对应的cli版本编译，而手机端SDK版本是x.x.x。不匹配的版本可能造成应用异常”
出现原因
手机端SDK版本和HBuilderX版本不一致。
解决办法
方法一 项目根目录下找到 manifest.json 配置文件，选择源码…
uni-app使用AntV f2图表
我这里是使用 HbuildX 直接导入插件
点击下载 antv f2 插件
蚂蚁图表 antv f2 - DCloud 插件市场
在使用页面引入相关
import F2 from /uni_modules/lime-f2/components/l-f2/f2.min.js;
页面使用
<view class"data-board"><l-f2 ref"chart&quo…
uniapp小程序进入横屏页面后竖屏页面样式错乱放大
问题描述：进入横屏页面后退出再进入一个竖屏页面，样式会错乱放大 解决方法
1.新增一个空白页，blank.vue
<template>
</template><script>export default {data() {return {}},onLoad(options) {uni.navigateBack({delta…
【uniapp】uniapp打包H5（网页端）：
文章目录 一、设置appid：二、设置router：三、打包：【1】[CLI 发行uni-app到H5：https://hx.dcloud.net.cn/cli/publish-h5](https://hx.dcloud.net.cn/cli/publish-h5)【2】HBuilderX 四、最终效果： 一、设置appid&…
uni-app去掉右侧滚动条
uni-app去掉右侧滚动条 1、APP端1.1 全局配置：1.2 局部配置： 2、微信小程序端2.1 方法一、将滚动条的属性 show-scrollbar 设置为 false 即可2.2 方法二、通过CSS设置滚动条隐藏 1、APP端
参考文档：uni-app官网
1.1 全局配置：
…
uni-app使用vue语法进行开发注意事项
目录
uni-app 项目目录结构
生命周期
路由
路由跳转
页面栈
条件编译
文本渲染
样式渲染
条件渲染
遍历渲染
事件处理
事件修饰符 uni-app 项目目录结构 组件/标签 使用（类似）小程序 语法/结构 使用vue
具体项目目录如下： 生命…
uniapp开发父组件调用子组件方法报错“this.$refs.xxxx“，检查是否组件用了v-if，如果是改为v-show试试
在父类组件中
<template> <view> <MemberLogged ref"isLogged" toLogIn"gotoLogging" v-if"proposItem.active1"></MemberLogged> </view> </template> 子类组件中有
methods: { …
uni-app之地图（Map）组件详细使用教程
UniApp 是一款基于 Vue.js 开发的跨平台应用框架，它提供了丰富的组件库，其中包含了地图（Map）组件。该组件允许开发者在 UniApp 应用中集成地图功能，实现地图的显示、标记、定位等功能。本教程将详细介绍 UniApp 地图&a…
【uniapp】uniapp设置安全区域：
文章目录 一、效果图:二、实现代码: 一、效果图: 二、实现代码:
{"path": "pages/index/index","style": {"navigationStyle": "custom","navigationBarTextStyle": "white","navigationBarTitle…
【uniapp】滚动相关
1、滚动到一定区域，顶部内容置换并置顶 功能： 当我向下滚动时，当关注那一行快到顶部的时候，把左侧区域的内容切换成右侧区域的内容，并置顶 原先我使用v-if来显示隐藏，发现会出现闪屏的现象，后来…
uni-app七种不同的弹框
uni-app七种不同的弹框
1. 纯文本弹框
代码
uni.showToast({title: 只有文字弹窗,icon: none, //如果要纯文本，不要icon，将值设为noneduration: 2000 //持续时间为 2秒}) 效果
2. 图标加文字弹框
代码
uni.showToast({title: 成功提示弹窗…
uniapp 常用提示弹框整理
一. 加载提示弹框
在执行数据查询、页面数据渲染等过程中弹出提示。以页面渲染为例：
//前端数据请求时，显示加载提示弹框
uni.showLoading({title: 加载中...
});
// 数据从后端接口返回后，提示弹框关闭
uni.hideLoading();效果如下&#x…
uniapp uni.requet()二次封装ts版
uni-app网络请求 uni-app题拱了uni.requet()方法，发起网络请求 uni.request({url: https://wwww.xxxx.cn/api/home/list, //仅为示例，并非真实接口地址。data: {text: uni.request},header: {custom-header: header //自定义请求头信息},success: (res) …
vue + uniapp实现手机横屏弹幕
小程序，手持弹幕，输入文字之后，弹幕从右往左匀速划过，再次循环。 实现这个功能，首先建一个uniapp项目，建一个vue页面 <template><view class"danmu_bg"><view class"barrage…
基于JavaSpringBoot+Vue+uniapp微信小程序实现鲜花商城购物系统
博主介绍：✌全网粉丝30W,csdn特邀作者、博客专家、CSDN新星计划导师、Java领域优质创作者,博客之星、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和毕业项目实战✌ 🍅文末获取源码联系🍅 👇🏻 精彩专…
踩坑---uni-app中@input 事件不生效
在开发的时候遇到这么一种情况，我们希望input输入框的值是范围是0-100或者保留两位小数之类的，当你输入时处理后的结果却不生效，但是试过很多办法发现都实现不了，最后是按照以下方法解决的,问题原因是uni-app会延时,导致输入的结果…
【uniapp】中 微信小程序实现echarts图表组件的封装
插件地址：echarts-for-uniapp - DCloud 插件市场
图例： 一、uniapp 安装
npm i uniapp-echarts --save 二、文件夹操作
将 node_modules 下的 uniapp-echarts 文件夹复制到 components 文件夹下 当前不操作此步骤的话，运行 -> 运行到小…
uni-app 集成推送
研究了几天，终于是打通了uni-app的推送，本文主要针对的是App端的推送开发过程，分为在线推送和离线推送。我们使用uni-app官方推荐的uni-push2.0。官方文档
准备工作：开通uni-push功能 勾选uniPush2.0点击"配置"填写表单…
uniapp app 实现右上角回首页；点homeButton返回上一页；onNavigationBarButtonTap不生效问题
场景： app，Android移动端 实现点击右上角图标，回首页。 问题：用了官网的 homeButton，图标正常展示了，也可点击，但每次点击后是会返回上一页而非首页。 后来查到说，要结合onNavigatio…
uniapp tabbar 浏览器调试显示 真机不显示
解决方案，把tabBar里面的单位全改为px，rpx是不会显示的！
注意了，改完一定要重新运行，不然无效，坑爹
"tabBar": {"borderStyle": "black","selectedColor": &quo…
uniapp 顶部头部样式
<u-navbartitle"商城":safeAreaInsetTop"true"><view slot"left"><image src"/static/logo.png" mode"" class"u-w-50 u-h-50"></image></view></u-navbar>
HBuilder X自定义代码块的方法
原文链接：https://blog.csdn.net/zhengzizhi/article/details/105020140 如何在HBuilderX开发工具中实现自定义生成代码块的功能 因为uListMedia不是内置组件，所以在你敲ulistmedia时看不到uListMedia的提示信息 在学习uni-app官网视频教程中，…
uniapp开发微信小程序使用painter将页面转换为图片并保存到本地相册
引言
我使用到painter的原因是，在uniapp开发微信小程序时，需要将一个页面的内容转换成图片保存到本地相册。 起初在网上找到很多都是在uniapp中使用 html2canvas 将网页转换成图片再jspdf将图片转换为pdf，但是这种方式在小程序环境不支持&am…
uniapp 小兔鲜儿 - 首页模块（2）
目录
热门推荐
首页 – 热门推荐组件
首页 – 获取热门推荐数据
首页 – 热门推荐数据类型并渲染
猜你喜欢
首页 – 猜你喜欢组件
首页 – 获取猜你喜欢数据
首页 – 猜你喜欢数据类型和渲染
首页 – 猜你喜欢分页准备
首页 – 猜你喜欢分页加载 首页 – 猜你喜欢分…
uniapp 数组操作
字符串转数组
let string "12345,56789" string.split(,) // [12345,56789]
数组转字符串
let array ["123","456"] array.join(",") // "123,456"
数组元素删除
let array [123,456] // 删除起始下标为1࿰…
面向初学者的物联网全栈开发指南 - 6 - uni-app起步
最后，我们要构建一个uni-app，并调用云函数建立起属于自己的全平台客户端，这里只对uni-app做一个简单的介绍，Html，CSS，JS上手比较快，而uni-app在Vue.js的基础上封装了大量的函数，用起…
uniapp小程序实现上传图片功能，并显示上传进度
效果图： 实现方法：
一、通过uni.chooseMedia(OBJECT)方法，拍摄或从手机相册中选择图片或视频。
官方文档链接: https://uniapp.dcloud.net.cn/api/media/video.html#choosemedia
uni.chooseMedia({count: 9,mediaType: [image,video],so…
UniApp 制作高德地图插件
1、下载Uni插件项目
在Uni官网下载Uni插件项目，并参考官网插件项目创建插件项目.
开发者须知 | uni小程序SDK
如果下载下来项目运行不了可以参考下面链接进行处理
UniApp原生插件制作_wangdaoyin2010的博客-CSDN博客
2、引入高德SDK
2.1 在高德官网下载对应SD…
小程序中display:flex和v-show，v-show不生效,uni-app
小程序中display:flex和v-show，v-show不生效、、
解决方案： display：flex样式的优先级高于了v-show ，v-show其实就是display：none，display：flex优先级高于display：none。
使用
:s…
前端vue自定义柱形图 选中更改柱形图颜色及文字标注颜色
随着技术的发展，开发的复杂度也越来越高，传统开发方式将一个系统做成了整块应用，经常出现的情况就是一个小小的改动或者一个小功能的增加可能会引起整体逻辑的修改，造成牵一发而动全身。
通过组件化开发，可以有效实现…
uniapp编写微信小程序和H5遇到的坑总结
uniapp编写微信小程序和H5遇到的坑总结 1、阻止事件冒泡2、二维码生成3、H5跨域配置4、H5时，地址栏上添加版本号5、H5时，tabBar遮挡部分内容6、uniapp使用webview通信6.1、uniapp编写的小程序嵌入h5之间的通信6.1.1、小程序向h5发送消息6.1.2、h5向小程序…
前端js,uniapp使用printease连接打印机打印，打印命令生成
接下来我们将使用printease实现前端js，uniapp打印。
此外，连接打印机的方式有很多种，这里并不会涉及到，该库只是提供了一种打印机指令的生成方式，你可以将生成的指令发送到打印机，打印机会执行一次印刷过程…
uni-app项目运行在安卓真机调试
uni-app项目运行在安卓真机调试
手机开启开发者模式
在系统设置——关于手机——连续点击系统版本号5-7次，直到提示“您已处于开发者模式”。具体如下图：
手机开启USB调试
在系统和更新——开发人员选项——打开USB调试。具体如下图所示：…
uniapp国际化npm install vue-i18n报错
npm install vue-i18n //npmyarn add vue-i18n //yarn在vue2环境下，默认安装 npm install vue-i18n 的版本是 vue-i18n9.1.9，所以报错。
npm view vue-i18n versions --json
用以上命令查看版本： vue2建议5.0版本
npm install vue-i1…
uni-app中学习笔记记录（1）
常用生命周期函数
onLoad 页面加载时触发，用onLoad可以接受路由传参；onReady 页面组件渲染完毕时触发，类似于vue2中的mounted生命周期函数；onShow 页面出现在屏幕上时触发，由于在h5或者小程序中，页面初始化…
uniapp写公众号h5开发 附件上传 下载功能
一。 uni-app实现文件上传功能
目前，找到一款第三方插件 文件上传插件地址 https://ext.dcloud.net.cn/plugin?id=1015 将插件下载并导入项目中直接拿来使用，插件市场也有对改插件用法的描述。 用法： 1. 以下代码写于根目录下第一个view顶部或跟在自定义导航栏后面
// 以…
uniapp 官方扩展组件 uni-combox 实现：只能选择不能手写（输入中支持过滤显示下拉列表）
uniapp 官方扩展组件 uni-combox 实现：只能选择不能手写（输入中支持过滤显示下拉列表） uni-comboxuni-combox 原本支持：问题： 改造源码参考资料 uni-combox uni-combox 原本支持：
下拉选择。输入关键字&am…
uni-app的nvue文件国际化不翻译问题解决办法
官网上的nvue国际化方式介绍的实在是太简单了，记得要引入下message文件，还要用uni.setLocale()设置下，但是不管我怎么引入都会报错。 所以我直接把文件拿过来了，通过对象的方式去取。
<!-- index.nvue 文件 -->
<view&g…
java版数字藏品浅色UI仿鲸探数藏盲盒合成短视频卡牌模式支持高并发
java版数字藏品浅色UI仿鲸探数藏盲盒合成短视频卡牌模式支持高并发
此版本为JAVA开发的版本 系统稳定 数据库MYSQL 前端uniapp
支持百万级用户，急速搭建
主要功能介绍
艺术品发售
藏品发售用户可以购买
后台藏品可设置不同稀有度
二级市场
用户的藏品可以直…
Uniapp或者微信小程序如何动态的计算Scrollview的高度
当一个小程序页面，顶部有搜索栏，或者分类查询时，我们想要保证它们能固定到顶部，就需要使用到Scrollview，那么如何确定Scrollview就是一个问题，这时我们可以使用以下代码来实现
setScrollHeight(view #scr…
uniapp 自定义手机顶部状态栏不生效问题
想要的效果想淘宝一样，底色覆盖到手机顶部，找了两天都没找到原因，过程很艰苦，直接上结果吧 项目是后来接手的，最终原因出在这， "immersed" : false>设置为 true 就可以了，沉浸式样…
【uniapp】uniapp自动导入自定义组件和设置分包：
文章目录 一、自动导入自定义组件：二、设置分包和预加载： 一、自动导入自定义组件：
【Volar 官网】https://github.com/vuejs/language-tools
二、设置分包和预加载：
【官方文档】https://uniapp.dcloud.net.cn/collocation…
uniapp日期选择组件优化
<uni-forms-item label="出生年月" name="birthDate"><view style="display: flex;flex-direction: row;align-items: center;height: 100%;"><view class="" v-
uniapp 用 hbuilderx下载 uview
uView2.0重磅发布，利剑出鞘，一统江湖 - DCloud 插件市场
1.uniapp官网下载资源 2按下载 3.官网安装文档 要按 这个红色圈错了 然后看他的配置步骤
第四easycom 就可以 不用配了
uniapp，使用canvas制作一个签名版
先看效果图 我把这个做成了页面，没有做成组件，因为之前我是配合uview-plus的popup弹出层使用的，这种组件好像是没有生命周期的，第一次打开弹出层可以正常写字，但是关闭之后再打开就不会显示绘制的线条了，还…
uniapp 小兔鲜儿 - 首页模块（1）
目录
自定义导航栏
静态结构
安全区域
通用轮播组件
静态结构
自动导入全局组件
全局组件类型声明 .d.ts文件 注册组件 vue/runtime-core
首页 – 轮播图指示点
首页 – 获取轮播图数据
首页 – 轮播图数据类型并渲染
首页 – 轮播图总结
首页分类
首页 – 前…
uniapp 配置网络请求并使用请求轮播图
由于平台的限制，小程序项目中不支持 axios，而且原生的 wx.request() API 功能较为简单，不支持拦截器等全局定制的功能。因此，建议在 uni-app 项目中使用 escook/request-miniprogram 第三方包发起网络数据请求。 官方文档…
uni-app开启gzip配置
指令：npm install webpack4.46.0 --save-dev
指令：npm install compression-webpack-plugin6.1.1 --save-dev vue.config.js
const CompressionWebpackPlugin require(compression-webpack-plugin);module.exports {configureWebpack: config > {…
Java Vue Uniapp MES生产执行管理系统
本MES系统是一款B/S结构、通用的生产执行管理系统，功能强大！
系统基于多年离散智造行业的业务经验组建，主要目的是为国内离散制造业的中小企业提供一个专业化、通用性、低成本的MES系统解决方案。 联系作者获取
uni-app 面容、指纹识别插件(uni-face-login)
面容、指纹识别插件(uni-face-login)
介绍
人脸指纹登录授权，可以使用手机自带的人脸、指纹进行生物识别，进而判断是否机主本人，从而进行授权验证，适配安卓、iOS、鸿蒙设备
猛戳这里去插件市场看看
使用
该插件支持鸿蒙、安卓…
uniapp的uview-plus组件库的导入
uniapp的vue3中使用uview-plus组件库。在插件市场中找到该组件并点击如下所示绿色按钮，弹出弹窗选择要导入的项目后，就会在uni_modules文件中生成如下文件内容
关于插件的下载区别，可参考：https://uniapp.dcloud.net.cn/compone…
uniapp封装组件，选中后右上角显示对号√样式（通过css实现）
效果： 一、组件封装
1、在项目根目录下创建components文件夹，自定义组件名称，我定义的是xc-button 2、封装组件代码
<template><view class"handle-btn"><view :class"handleIdCode 1 ? select : unSelec…
uniApp引入vant2
uniApp引入vant2
1、cnpm 下载：cnpm i vantlatest-v2 -S2、main.js文件引入
import Vant from ./node_modules/vant/lib/vant;Vue.use(Vant);3.app.vue中引入vant 样式文件
import /node_modules/vant/lib/index.css;
uniapp条形码实现
条形码在实际应用场景是经常可见的。
这里教大家如何集成uniapp条形码。条形码依赖类库JsBarcode.
下载JsBarcode源码，对CanvasRenderer进行了改进兼容uniapp。
import merge from "../help/merge.js";
import {calculateEncodingAttributes, getTotal…
uniapp视频video
需求
播放暂停视频不允许快进，可以后退视频后退不会影响最高观看时长，例如看了10分钟，后退5分钟，观看时长依然是600秒监听退出记录观看时间，下次进来接着看视频看完积分
<template><view><!-- id:唯一…
【总结】uniapp以及wx小程序 相关写法集合
一、css 二、方法
uniApp
1、动态修改头部标题
uni.setNavigationBarTitle({title: this.dynamicTitle,success: () > {console.log(修改标题成功)},fail: () > {console.log(修改标题失败)},complete: () > {console.log(修改标题结束)}
})
2、预览图片单张/多张…
【uni-app报错】获取用户收货地址uni.chooseAddress()报错问题
chooseAddress:fail the api need to be declared in …e requiredPrivateInf 原因：
小程序配置 / 全局配置 (qq.com) 解决：
登录小程序后台申请接口 按照流程申请即可 在项目根目录中找到 manifest.json 文件，在左侧导航栏选择源码视图&a…
uni-app在app端设置下拉刷新不生效
下拉刷新这个问题，查了老半天。 我这只小菜鸡，完全不知道view和scroll-view是不一样的！
问题现象：
按照官网的方式， 1. 在 pages.json 里，找到的当前页面的pages节点，并在 style 选项中开启 e…
uniapp使用uni.chooseLocation()打开地图选择位置
使用uni.chooseLocation()打开地址选择位置： 在Uniapp源码视图进行设置 添加这个属性："requiredPrivateInfos":["chooseLocation"]
</template><view class"location_box"><view class"locatio…
【vue+uniapp】切换本页面（点击导航按钮）就刷新接口
查阅资料：uni-app官网 点击导航中图标，就执行的方法（和methods同级）：
onTabItemTap(e) {this.getTaskTotal();
},
vue uniapp 防止按钮多次点击（类似于防抖节流）
common文件并创建anti-shake.js文件
// 防止处理多次点击
function noMultipleClicks(methods, info) {// methods是需要点击后需要执行的函数， info是点击需要传的参数let that this;if (that.noClick) {// 第一次点击that.noClick false;if(info && inf…
【uni-app】压缩图片并添加水印
总体思路 dom 结点
这里的 cvHeight 和 cvWidth 初始时要设置为你后续需要压缩后的最大宽高。假设我们在图片上传后图片最大为 350 * 350
<u-upload :fileList"baseInfoFormData.entrustFileList" afterRead"afterFileRead" multiple></u-uploa…
uniapp离线打包apk - Android Studio
uniapp 离线打包 基于uni-app的andiord 离线打包 开发工具及所需要的jar包1.将下载的App离线SDK解压打开，找到HBuilder-Integrate-AS ，在Android Studio打开2.打开HBuilder X，发行->原生app本地打包->生成本地打包app资源3.在“HBuil…
uniapp 实现切换tab锚点定位到指定位置
1.主要使用uniapp scroll-view 组件的scroll-into-view属性实现功能 2.代码如下 <scroll-view:scroll-into-view"intoView"><u-tabsclass"tabs-list"change"tabChange":list"tabList"></u-tabs><view id"1&…
vue uniapp 同意验证码滑块验证
前言 （vue-puzzle-vcode）
发送验证码以及登录的时候会做验证，防止机刷等 效果图
一、安装依赖
npm install vue-puzzle-vcode --save二、使用步骤
1.html使用
<Vcode :show"isShow" success"onSuccess"/>2.j…
UNIAPP调用API接口
API：开发者可以通过这些接口与其它程序进行交互，获取所需数据或者执行指定操作。
网络请求 API:
UniApp 中内置了网络请求 API，方便调用 uni.request uni.uploadFile uni.request 接口主要用于实现网络请求。GET 和 POST 是使用最普遍的两种…
uniapp评论列表插件获取
从评论列表，回复，点赞，删除，留言板 - DCloud 插件市场里导入，并使用。
代码样式优化及接入如下：
<template><view class"hb-comment"><!-- 阅读数-start --><view v-if&q…
![[uni-app] uview封装Popup组件,处理props及v-model的传值问题](https://img-blog.csdnimg.cn/1e79f9e7cbc14a4e935c3ef6345738e1.png)
[uni-app] uview封装Popup组件,处理props及v-model的传值问题
文章目录 需求及效果遇到的问题解决的办法偷懒的写法 需求及效果
uView(1.x版本)中, 有Pop弹出层的组件, 现在有个需求是,进行简单封装,有些通用的设置不想每次都写(比如 :mask-custom-style"{background: rgba(0, 0, 0, 0.7)}"这种) 然后内部内容交给插槽去自己随…
关于uniapp微信小程序scroll-view组件使用show-scrollbar隐藏不了滚动条
这里关于使用 scroll-view组件 时候有滚动条 想要隐藏滚动条但是使用show-scrollbar没有效果 这时候又使用类名隐藏滚动条 使用id隐藏滚动条都不行 解决方法：在使用 scroll-view组件 的页面或者app 页面加上以下代码就可以了
::-webkit-scrollbar {displa…
uniapp 微信小程序 绘制海报，长按图片分享，保存海报
uView UI 2.0 dcloud 插件市场地址
弹窗海报源码
<template><!-- 推荐商品弹窗 --><u-popup :show"haibaoShow" mode"center" round26rpx z-index10076 bgColortransparent safeAreaInsetTop close"goodsclose"><image …
域名子目录发布问题（nginx、vue-element-admin、uni-app）
域名子目录发布问题（nginx、vue-element-admin、uni-app） 说明Vue-Element-Admin 代码打包nginx配置：uni-app打包 说明
使用一个域名下子目录进行打包：
比如： http://www.xxx.com/merchant 商户端代码 http://www.xx…
uni-app的Vue.js实现微信小程序的紧急事件登记页面功能
主要功能实现 完成发生时间选择功能，用户可以通过日期选择器选择事件发生的时间。实现事件类型选择功能，用户可以通过下拉选择框选择事件的类型。添加子养殖场编号输入框，用户可以输入与事件相关的子养殖场编号。完成事件描述输入功能&#…
uniapp隐藏底部导航栏（非自定义底部导航栏）
uniapp隐藏底部导航栏 看什么看，要多看uni官方文档，里面啥都有 看什么看，要多看uni官方文档，里面啥都有
uniapp官方网址：uni设置TabBar
// 展示
uni.showTabBar({animation:true,success() {console.debug(隐藏成功)…
前端Vue自定义等分底部菜单导航按钮 自适应文字宽度 可更改组件位置
随着技术的发展，开发的复杂度也越来越高，传统开发方式将一个系统做成了整块应用，经常出现的情况就是一个小小的改动或者一个小功能的增加可能会引起整体逻辑的修改，造成牵一发而动全身。
通过组件化开发，可以有效实现…
Webstorm 入门级玩转uni-app 项目-微信小程序+移动端项目方案
1. Webstorm uni-app语法插件 ： Uniapp Support
Uniapp Support - IntelliJ IDEs Plugin | Marketplace
第一个是不收费，第二个收费 我选择了第二个Uniapp Support ，有试用30天，安装重启webstorm之后，可以提高生产率…
uniapp接入广告的问题总结
Uniapp官方解决方案 uni-app 支持接入uni-ad广告联盟，开发者可实现一次开发，多端变现。
uni-ad 支持开屏、信息流、激励视频、视频流、悬浮红包、推送等丰富的广告形式；
uni-ad 聚合了全网所有主流广告源，包括腾讯优量汇、字节…
快速学会创建uni-app项目并了解pages.json文件
(创作不易，感谢有你，你的支持，就是我前行的最大动力，如果看完对你有帮助，请留下您的足迹） 目录
前言
创建 uni-app 项目
通过 HBuilderX 创建
pages.json
pages
style
globalStyle
tabBar 前言…
uniapp项目-配置pages.json
1.配置tabBar
说明：selectedcolor是选中的颜色；lists底部导航栏的每个导航项的列表，
"pagePath"：导航项关联的页面路径。"text"：导航项显示的文本内容。"iconPath"：导航项…
【uniapp 上传图片示例】
以下是 uniapp 上传图片的详细步骤示例：
定义一个方法，用于选择图片并上传：
methods: {chooseImage() {uni.chooseImage({count: 1, // 最多选择的图片数量sizeType: [original, compressed], // 可以指定原图或压缩图sourceType: [album, …
个人首次使用UniAPP使用注意事项以及踩坑
个人首次使用UniAPP
使用注意事项以及踩坑 自我记录 持续更新
1.vscode 插件
uni-create-view 快速nui-app页面的
uni-helper uni-app代码提示的
uniapp小程序扩展 鼠标悬停查文档
Error Lens 行内提示报错
"types": ["dcloudio/types", "mini…
探讨uniapp的页面问题
1 新建页面
uni-app中的页面，默认保存在工程根目录下的pages目录下。
每次新建页面，均需在pages.json中配置pages列表；
未在pages.json -> pages 中注册的页面，uni-app会在编译阶段进行忽略。pages.json的完整配置参考&am…
探讨uniapp的路由与页面栈及参数传递问题
1首先引入页面栈
框架以栈的形式管理当前所有页面， 当发生路由切换的时候，页面栈的表现如下： 页面的路由操作无非：初始化、打开新页面、页面重定向、页面返回、tab切换、重加载。
2页面路由
uni-app 有两种页面路由跳转方式&am…
分享一种针对uni-app相对通用的抓包方案
PART1，前言
近年来混合开发APP逐渐成为主流的开发模式，与传统的开发模式相比混合开发极大的提升了开发效率，同时跨平台的特性也降低了开发成本，一直以来混合开发被诟病的性能问题随着技术的发展也得到改善。技术的发展往往是一把…
Uniapp笔记（六）uniapp基础
一、腾讯地图
1、uniapp地图渲染
<template><view><map class"map" :longitude"longitude" :latitude"latitude"></map></view>
</template>
<script>export default {data() {return {longitude:1…
Uniapp笔记（五）uniapp语法4
本章目标 授权登录【难点、重点】 条件编译【理解】 小程序分包【理解】
一、授权登录
我的模块其实是两个组件，一个是登录组件，一个是用户信息组件，根据用户的登录状态判断是否要显示那个组件
1、登录的基本布局
<template><…
Uniapp笔记（四）uniapp语法3
一、商品详情
1、从商品列表页跳转到商品详情页 在商品列表的项中绑定单击事件，并传递商品id值
<view class"goods-item" v-for"(item,index) in goodsList" :key"index" click"goGoodsDetail(item.goods_id)">
&…
Uniapp笔记（二）uniapp语法1
一、本节项目预备知识
1、效果演示
2、常见组件
1、view组件
视图容器，它类似于传统html中的div，用于包裹各种元素内容。
2、swiper组件
swiper是滑动视图容器，经常看到的轮播图就是通过它来完成的
swiper-item是swiper子组件…
【App端】uni-app使用echarts和百度地图api
目录 前言获取百度地图AK选择并使用合适的echarts示例完整使用代码 前言
近期的app项目中想加一个功能，展示全国各地的某一数据统计情况，想来想去，用echarts做地图数据可视化直观且美观。于是就去研究了如何使用，其实在移动端使用…
uniapp 项目实践总结(一)uniapp 框架知识总结
导语：最近开发了一个基于 uniapp 框架的项目，有一些感触和体会，所以想记录以下一些技术和经验，在这里做一个系列总结，算是对自己做一个交代吧。 目录
简介全局文件全局组件常用 API条件编译插件开发
简介
uniapp 是…
关于uniapp报警告Extraneous non-props attributes (info) were passed to component
Extraneous non-props attributes (info) were passed to component but could not be automatically inherited because component renders fragment or text root nodes. 在开发uniapp的过程中，遇到了这咩一个问题，如上面所述，也是感觉哪哪…
服务器端使用django websocket,客户端使用uniapp 请问服务端和客户端群组互发消息的代码怎么写
在服务器端使用Django WebSocket和客户端使用Uniapp的情况下，以下是代码示例来实现服务器端和客户端之间的群组互发消息。
服务器端代码（使用Django Channels库）： 首先，在Django的settings.py文件中配置Channels&…
uni-app开发小程序，radio单选按钮，点击可以选中，再次点击可以取消
一、实现效果： 二、代码实现： 不适用官方的change方法，自己定义点击方法。 动态判断定义的值是否等于遍历的值进行回显，如果和上一次点击的值一样，就把定义的值改为null <template><view><radio-group&…
uniapp 回退到指定页面 保存页面状态
uniapp 历史页面回退到指定页面。 getCurrentPages() 内容如下 let delta getCurrentPages().reverse().findIndex(item > item.route "pages/popularScience/daodi")
if(delta-1){uni.navigateTo({url: /pages/popularScience/daodi,success: res > {},fa…
【App端】uni-app使用百度地图api和echarts省市地图下钻
目录 前言方案一：echarts百度地图获取百度地图AK安装echarts和引入百度地图api完整使用代码 方案二：echarts地图和柱状图变形动画实现思路完整使用代码 方案三：中国地图和各省市地图下钻实现思路完整使用代码 前言
近期的app项目中想加一个功…
服务器端使用django websocket,客户端使用uniapp 请问服务端和客户端群组互发消息的代码怎么写的参考笔记
2023/8/29 19:21:11
服务器端使用django websocket,客户端使用uniapp 请问服务端和客户端群组互发消息的代码怎么写
2023/8/29 19:22:25
在服务器端使用Django WebSocket和客户端使用Uniapp的情况下，以下是代码示例来实现服务器端和客户端之间的群组互发消息。
…
uniapp如何应用onNeedPrivacyAuthorization实现微信小程序隐私政策
前言
微信小程序要求9.15日前实现隐私政策弹窗，但是uniapp文档一直没有更新，尝试直接使用wx.onNeedPrivacyAuthorization ，是可以生效的
步骤
在 微信小程序后台 的 设置--服务内容与声明 ，设置好小程序所需要的隐私政策在 uni…
uview ui 1.x ActonSheet项太多，设置滚动(亲测有效）
问题：ActionSheet滚动不了。
使用uview ui ：u-action-sheet, 但是item太多，超出屏幕了， 查了一下文档，并没有设置滚动的地方。
官方文档：ActionSheet 操作菜单 | uView - 多平台快速开发的UI框架 - uni-a…
uni-app 报错 navigateTo:fail page “/pages/.../...“ is not found
这个错误的意思是：识别不到该页面
错误可能一：没有在 pages.json【微信小程序是 app.json】中定义该页面的路径
如：
pages.json
"pages": [{"path": "pages/index/index"
}, {"path": "pag…
Uniapp新版本打包后覆盖安装，新增的页面无法跳转，需退出重新启动才可以打开的解决方案
最近写uniapp项目，发现一个坑，在新版本覆盖安装后直接打开APP，新增的页面竟然无法跳转，需要重新启动才可以正常打开，在网上查了很多方法，最终总结下来有以下几点：
1.看打的是debug包还是releas…
uniapp onLoad生命周期 uni.$on接受参数无法改变data数据解决办法
问题阐述：
a: uni.$emit(name,data)uni.navigateTo({url:b})b:onload(){
uni.$on(name,(res)>{
this.nameres
console.log(this.name)
})}用以上写法来跨页面传参会发现在b页面，虽然能够接受到参数但是赋值到data时候没生效，虽然控制台能…
uni-app：监听数据变化（watch监听、@input事件）
方法一：文本框监听,使用input事件
<template><view><input type"text" v-model"wip_entity_name" input"handleInputChange" /></view>
</template><script>
export default {data() {return {…
uniapp项目实践总结(五)自定义底部导航栏
在底部导航栏这个模块，很多时候默认的样式不符合我们的设计规范和需求，因此需要自定义底部导航栏，这样可以满足我们的需求，也可以更加个性化，增加用户体验，下面就介绍如何自定义底部导航栏。 目录 准备导航素材配置页面导航自定义导航栏准备导航素材
要自定义底部导航栏…
如何高效地应对即时通讯开发应用的高并发访问？
作为即时通讯开发领域的专家，我要向您介绍如何在面对高并发访问时，有效地应对即时通讯开发应用的挑战。随着即时通讯应用的普及，用户对实时性和无延迟的需求越来越高，这使得开发者需要采取一系列措施来应对高并发带来的压力。
2.…
uni-app项目由hbuilder项目转化为cli项目
1.背景
原uni-app项目是通过hbuilder创建的，运行以及打包都要依赖于hbuilder运行；一般在vscode开发，在hbuilder运行比较怪异；后续希望脱离hbuilder运行并能通过构建平台进行打包，因此将hbuilder项目转化为cli项目
2.…
uniapp使用wx.requirePrivacyAuthorize实现微信小程序隐私政策
一、前言
微信小程序官方出了一个公告《关于小程序隐私保护指引设置的公告》。不整的话，后果很多授权无法使用，详见《小程序用户隐私保护指引内容介绍》 。 二、操作流程
1、在 微信小程序后台的【设置】- 【服务内容与声明】 ，设置好用户隐…
uniapp 微信小程序仿抖音评论区功能，支持展开收起
最近需要写一个评论区功能，所以打算仿照抖音做一个评论功能，支持展开和收起， 首先我们需要对功能做一个拆解，评论区功能，两个模块，一个是发表评论模块，一个是评论展示区。接下来对这两个模块进行…
【使用uniapp开发APP的框架思路】
uniapp开发 使用uniapp开发的详细框架思路1. 项目准备：2. 页面设计：3. 组件编写：4. 路由配置：5. 接口调用：6.数据处理：7.全局状态管理：8.本地存储：9.第三方插件集成：10.打…
uniapp 微信小程序webview 踩坑
uniapp 微信小程序的存在许多功能上的限制和约束，有些情况不得不去使用webview进行开发实现需求，比如 原生无法满足（例如某团队维护SDK 只提供了WEB端jsSDK，且不维护小程序SDK） H5可以同时适用多端（适用范围…
uniapp微信小程序用户隐私保护
使用wx.requirePrivacyAuthorize实现微信小程序用户隐私保护。
一、前言
微信小程序官方出了一个公告《关于小程序隐私保护指引设置的公告》。不整的话，后果很多授权无法使用，详见《小程序用户隐私保护指引内容介绍》 。 二、隐私相关设置
1、在 微信…
vue、uniapp中动态添加绑定style、class 9种方法实现
9种方法介绍 直接使用静态class和style属性： 使用场景：当class和style属性是固定不变的时候，可以直接在模板中写死。优点：简单直接，没有额外的计算和逻辑。缺点：无法根据条件动态修改class和style。 使用v…
vue3+ts+uniapp小程序端自定义日期选择器基于内置组件picker-view + 扩展组件 Popup 实现自定义日期选择及其他单列选择
vue3ts 基于内置组件picker-view 扩展组件 Popup 实现自定义日期选择及单列选择 vue3tsuniapp小程序端自定义日期选择器 1.先上效果图2.代码展示2.1 组件2.2 公共方法处理日期2.3 使用组件(全局自动导入的情况) 3.注意事项3.1refSelectDialog3.1 backgroundColor"#fff&q…
探索UniApp分包
目录
什么是UniApp分包？
UniApp分包的原理
优势
如何使用UniApp分包
1.manifest.json文件配置
2.静态图片资源分包注意事项 3.pages.json配置
结论 探索UniApp分包：优化移动应用性能与用户体验
在移动应用开发领域，性能和用户体验是至…
uni-app 客服按钮可上下拖动动
项目需求： 因为悬浮客服有时候会遮挡住界面内容，故需要对悬浮的气泡弹窗做可拖动操作 movable-area：可拖动区域 movable-view：可移动的视图容器，在页面中可以拖拽滑动或双指缩放。
属性说明
属性名类型默认值说…
uniapp 配置并使用 VueX
Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。
uni-app 内置了 VueX 1、创建需要的文件 右键点击 根目录【我的是 uni-shop】，然后新建 目录&a…
【项目源码】一套基于springboot+Uniapp框架开发的智慧医院3D人体导诊系统源码
智慧医院3D人体导诊系统源码
开发语言：java
开发工具：IDEA
前端框架：Uniapp
后端框架：springboot
数 据 库：mysql
移 动 端：微信小程序、H5 “智慧导诊”以人工智能手段为依托，为…
使用 v-for 指令和数组来实现在 Uni-app 中动态增减表单项并渲染多个数据
在 data 中定义一个数组，用于存储表单项的数据： data() {return {formItems: []}
}
在模板中使用 v-for 指令渲染表单项：
<template><div><div v-for"(item, index) in formItems" :key"index"><…
uniapp授权小程序隐私弹窗效果demo（整理）
<template>
<view class"dealBox"><view class"txtBox padding10"><!-- 查看协议 -->在您使用施工现场五星计划小程序之前，请仔细阅读<text class"goToPrivacy" click"handleOpenPrivacyContract&qu…
解决uniapp下拉框 内容被覆盖的问题
1. 下拉框 内容被覆盖的问题
场景: 现在是下拉框被表格覆盖了 解决办法: 在表格上添加css 样式来解决这个问题 .add-table{display: static;overflow: visible; }
display: static: 将元素会按照默认的布局方式进行显示，不会分为块状或行内元素。
overflow: vi…
uniapp 微信小程序添加隐私保护指引
隐私弹窗： <uni-popup ref"popup"><view class"popupWrap"><view class"popupTxt">在你使用【最美万年历】之前，请仔细阅读<text class"blueColor" click"handleOpenPrivacyContract…
uniapp中UView中 u-form表单在v-for循环下如何进行表单校验
1、数据data格式 注：rule绑定的tableFromRule中要和表单tableFrom下面放置一个同名数组，确保u-form能找到
tableFrom: {tableData: [//数据详情列表]},tableFromRule: {//校验tableData: [//数据详情列表]},formRules:{localation:[{required: true,mes…
小兔鲜儿 - 地址模块
目录 小兔鲜儿 - 地址模块
准备工作
静态结构
地址管理页
地址表单页
动态设置标题
新建地址页
接口封装
参考代码
地址管理页
接口调用
参考代码
修改地址页
数据回显
更新地址
表单校验
操作步骤
删除地址
侧滑组件用法…
解决uView2 SwipeAction滑动单元格，点击按钮不关闭的问题
1、首先找到安装SwipeAction插件的位置，我的安装在一下位置 2.在 u-swipe-action-item.vue 文件内找到buttonClickHandler方法 3.在buttonClickHandler方法内添加代码
this.status close
前端Vue仿企查查 天眼查知识产权标准信息列表组件
引入Vue仿企查查天眼查知识产权标准信息列表组件
随着技术的不断发展，传统的开发方式使得系统的复杂度越来越高。在传统开发过程中，一个小小的改动或者一个小功能的增加可能会导致整体逻辑的修改，造成牵一发而动全身的情况。为了解决这个问题…
【易售小程序项目】修改“我的”界面前端实现；查看、重新编辑、下架自己发布的商品【后端基于若依管理系统开发】
文章目录 “我的”界面修改效果界面实现界面整体代码 查看已发布商品界面效果商品数据表后端上架、下架商品ControllerMapper 界面整体代码back方法 编辑商品、商品发布、保存草稿后端商品校验方法Controller 页面整体代码 “我的”界面修改
效果 界面实现
界面的实现使用了一…
uniapp 实现滑动元素删除效果
官网地址：uni-app官网 (dcloud.net.cn) 最终效果如下图： 滑动删除需要用到 uni-ui 的 uni-swipe-action 组件和 uni-swipe-action-item 属性名类型可选值默认值是否必填说明left-optionsArray/Object--否左侧选项内容及样式right-optionsArray/Object--…
前端Vue自定义得分构成水平柱形图组件 可用于系统专业门类得分评估分析
引入Vue自定义得分构成水平柱形图组件：cc-horBarChart
随着技术的发展，传统的开发方式使得系统的复杂度越来越高，一个小小的改动或小功能的增加可能会导致整体逻辑的修改，造成牵一发而动全身的情况。为了解决这个问题，…
uni-app之android离线打包
一 AndroidStudio创建项目
1.1，上一节演示了uni-app云打包，下面演示怎样androidStudio离线打包。在AndroidStudio里面新建空项目 1.2，下载uni-app离线SDK，离线SDK主要用于App本地离线打包及扩展原生能力，SDK下载链接h…
uniapp 集成蓝牙打印功能（个人测试佳博打印机）
uniapp 集成蓝牙打印功能（个人测试京博打印机） uniapp 集成蓝牙打印功能集成佳博内置的接口 uniapp 集成蓝牙打印功能 大家好今天分析的是uniapp 集成蓝牙打印功能，个人开发是app,应该是支持H5(没试过) 集成佳博内置的接口 下载dome地址&…
uni-app 之 v-on:click点击事件
uni-app 之 v-on:click点击事件 image.png
<template><!-- vue2的<template>里必须要有一个盒子，不能有两个，这里的盒子就是 view--><view>--- v-on:click点击事件 ---<view v-on:click"onclick">{{title}}<…
uni-app 之 目录结构
目录结构：
工程简介 | uni-app官网 (dcloud.net.cn)
pages/index/index.vue 页面元素等 static 静态文件，图片 字体文件等 App.vue 应用配置，用来配置App全局样式以及监听 应用生命周期
index.html 项目运行最终生成的文件
main.js 引用的…
uniapp 开发App 网络异常如何处理
我对该问题思考的不是很清楚，目前只想到了基本的解决方案 第一、客户端的网络异常（断网）
1. 断网情况
一定要弹出信息提示，目前最好的解决方式就是在uni.request封装的统一方法中写提示
//1. 封装的网络请求
async function se…
uniapp从零到一的学习商城实战
涵盖的功能： 安装开发工具HBuilder：HBuilderX-高效极客技巧 创建项目步骤： 1.右键-项目： 2.选择vue2和默认模板： 3.完整的项目目录： 微信开发者工具调试： 1.安装微信开发者工具 2.打开…
uni-app 中 swiper 轮播图高度自适应
方法一
1、首先 swiper 标签的宽度是 width: 100%
2、swiper 标签存在默认高度是 height: 150px ；高度无法实现由内容撑开，在默认情况下，图片的高度显示总是 150px
swiper 宽度 / swiper 高度 原图宽度 / 原图高度
swiper 高度 swiper …
uni-app 之 vue语法
uni-app 之 vue语法 image.png
--- v-html 字符 --- image.png <template><view><view>{{title}}</view>--- v-html 字符 ---<view>{{title2}}</view><view v-html"title2"></view><view>{{arr}}</view&g…
uniapp集成windicss的流程
一、背景介绍 Windicss是一个基于Tailwind CSS 灵感的库，它更快、更兼容，使用 TypeScript 构建。Windicss的目标是为了解决与Tailwind CSS 类似的问题，提供一个可以快速上手开发的组件库，让开发者不再需要繁琐地编写 CSS 样式。Windicss包含了几乎所有的 CSS 样式，因此开发…
uni-app 之 图片
uni-app 之 图片
获取图片 v-bind 动态绑定 image.png <template><view><view>--- 获取图片1 ---<image src"../../static/img/tabbar_home1.png"></image></view><view>--- 获取图片2 v-bind 动态绑定---<image v-bi…
uni-app:实现右侧弹窗
效果： 代码：
<template><view class"container"><button click"showModal true">点击按钮</button><view class"modal-overlay" v-if"showModal" click"closeModal">…
uniapp - 倒计时组件-优化循环时间倒计时
使用定时器的规避方法 为了避免定时器误差导致倒计时计算错误，可以采用一些规避方法，比如将倒计时被中断时的剩余时间记录下来，重新开启定时器时再将这个剩余时间加到新的计算中。同时，为了避免定时器延迟，可以在每次执…
uniapp 配置小程序分包
分包可以减少小程序首次启动时的加载时间 分包页面（例如：商品详情页、商品列表页）。在 uni-app 项目中，配置分包的步骤如下：
1、右键点击根目录，新建，点击创建分包的根目录，命名为 …
uniapp实现：点击拨打电话，弹出电话号码列表，可以选择其中一个进行拨打
一、实现效果： 二、代码实现：
在uni-app中，使用uni.showActionSheet方法实现点击拨打电话的功能，并弹出相关的电话列表供用户选择。 当用户选择了其中一个电话后，会触发success回调函数，并通过res.tapInde…
uniapp的小程序中使用web-view进行相互传参，并监听web-view的返回键
uniapp的小程序中使用web-view进行相互传参，并监听web-view的返回键
一、unaipp给webview传参
//uniapp页面中
<web-view :src"src" message"getMessage" onPostMessage"getPostMessage"></web-view>data() {return …
UNI-APP 框架中解决打包后index.html文件中没有引号问题
问题
打包后index.html文件中src属性没有引号。打包后修改默认相对路径为“./”，比如index.xxxx.js中的a.p属性值希望为“./”，默认为“/”。
问题一
在项目根目录下添加文件vue.config.js。在文件中添加如下内容：
module.exports {chai…
uniapp 手机 真机测试 云打包 要是没申请 可以使用云打包 然后采用 测试权限即可
uniapp 手机 真机测试
打开手机 找到手机的 版本号 点击 知道提示 （启动开发者模式） 然后 在进行usb的连接打开 运行uniapp 到手机基台 手机确认 即可 四， 云打包 要是没申请 可以使用云打包 然后采用 测试权限即可
Vue3---uni-app--高德地图引用BUG
先给报错信息：module libs/map//libs/map_min.js is not defined, require args is /libs/map_min.js
查看我引用方法： 本人查阅资料发现 是 require 使用的是 commonJS方式引用说这个适配Vue2可我项目是Vue3应该使用ES6语法糖 然后我有跑了项目发现BU…
uni-app 可视化创建的项目 移动端安装调试插件vconsole
可视化创建的项目，在插件市场找不到vconsole插件了。
又不好npm install vconsole 换个思路，先创建一个cli脚手架脚手架的uni-app项目，然后再此项目上安装vconsole cli脚手架创建uni-app项目 安装插件
项目Terminal运行命令：npm…
Uniapp学习之从零开始写一个简单的小程序demo（新建页面，通过导航切换页面，发送请求）
先把官网文档摆在这，后面会用到的 [uniapp官网文档]: https://uniapp.dcloud.net.cn/vernacular.html# 一、开发工具准备
1-1 安装HBuilder
按照官方推荐，先装一个HBuilder
下载地址：
https://www.dcloud.io/hbuilderx.html1-2 安装微信开…
uniapp微信小程序隐私保护引导新规
1.components中新建组件PrivacyPop.vue
<template><view class"privacy" v-if"showPrivacy"><view class"content"><view class"title">隐私保护指引</view><view class"des">在使用当…
基于java SpringBoot和Vue uniapp的影楼摄影预约小程序
摘要 今天信息技术的发展很快，其足迹在我们的生活中随处可见。它影响着我们的衣食住行等各种需求。影响也在逐渐增加，逐渐渗透到各行各业，在这种背景下，经过实地考察后，为了让婚纱照管理更加高效方便，我决定…
【RuoYi移动端】uni-app中通过vuex的store来实现全局变量的修改和读取
一、在store文件中新建csjVar.js文件
const csjVar {csjMess: [{aaa:"ok"},{bbb:"no"}]
}
export default csjVar
二、修改store文件中新建index.js文件 import Vue from vue
import Vuex from vuex
import user from /store/modules/user
import gette…
uni-app 的条件编译（APP-PLUS 、H5、MP-WEIXIN ）
条件编译是用特殊的注释作为标记，在编译时根据这些特殊的注释，将注释里面的代码编译到不同平台。
写法：以 #ifdef 或 #ifndef 加 %PLATFORM% 开头，以 #endif 结尾。
1 #ifdef：if defined 仅在某平台存在 2 #ifndef&a…
uniapp项目实践总结(十一)自定义网络检测组件
导语：很多时候手机设备会突然没网,这时候就需要一个网络检测组件,在没网的时候显示提示用户,提供用户体验。 目录
准备工作原理分析组件实现实战演练案例展示
准备工作
在components新建一个q-online文件夹，并新建一个q-online.vue的组件；…
uniapp 路由不要显示#
在Uniapp中，路由默认使用的是hash模式，即在URL中添加#符号。如果你不想在URL中显示#，可以切换为使用history模式。
要在Uniapp中使用history模式，可以按照以下步骤进行操作：
打开manifest.json文件。在"app&qu…
uniapp对接支付宝出现的问题
支付逻辑没问题却出现商家订单参数异常，请重新发起付款 检查发现后端传回来根本没什么问题，检查很久发现需要下载证书放在服务器上
小程序文档 - 支付宝文档中心
使用 uni-app 开发app时 中使用的 @longpress 含义及使用方法
学习目标：
目标：
了解 longpress 事件的含义及使用方法 学习内容：
内容：
longtap, longpress 都代表长按事件在浏览器上，longtap 事件会覆盖longpress；在手机端的时候，2个事件都存在&#x…
在 uni-app 中选中奇偶子元素
问题描述：
在 uni-app 中,使用 :nth-child() 选择器选择奇偶子元素不像预期那样生效。
原代码： - :nth-child(2n) 选择偶数个子元素 - :nth-child(2n1) 选择奇数个子元素
/* 奇数子元素 */
.issueData_item:nth-child(2n1) {transfo…
h5 uniapp如何保存照片【saveImageToPhotosAlbum不支持h5端】
报错：chunk-vendors.7e18ac5d.js:1 [system] API saveImageToPhotosAlbum is not yet h5 uniapp如何保存照片 //调用预览图片的方法uni.previewImage({urls: [img],current: 0, //点击图片传过来的下标success: (res) > {console.log(预览图片成功);// uni.showT…
uniapp 地图跳转到第三方导航软件 直接打包成apk
// 判断是否存在导航软件judgeHasExistNavignation() {let navAppParam [{pname: com.baidu.BaiduMap,action: baidumap://}, // 百度{pname: com.autonavi.minimap,action: iosamap://}, // 高德{pname: com.tencent.map,action: tencentmap://}, // 腾讯];return navAppPara…
即时通讯开发应用中的实时消息推送技术
即时通讯开发领域正以前所未有的速度蓬勃发展，实时消息推送技术成为促进即时通讯应用体验的关键要素。本文将深入探讨即时通讯应用中的实时消息推送技术，为读者呈现这一领域的全貌。
2. 实时消息推送的重要性
在当今数字化时代，人们日益需要…
【uniapp 微信小程序】可视区域的高度
onLoad(option) {let that this;uni.getSystemInfo({success: function (res) {that.height (res.windowHeight - 150) * 2; // 单位 px}});},
uniapp项目实践总结(十二)封装通用请求上传以及下载方法
导语：在日常开发过程中，前端经常要和后端进行接口联调，获取并且渲染数据到页面中，接下来就总结一下 uniapp 中获取请求、文件下载和上传的一些方法。 目录
原理分析方法实现实战演练案例展示
原理分析
主要是使用uni.request方…
uniapp的两个跳转方式
uniapp内置多种跳转方式，我这里介绍两个最常用的跳转，uni.navigateTo和uni.switchTab，前者为跳转到非TabBar页面，后者为跳转到TabBar页面，所谓TabBar就是底部导航栏配置的页面，例如下方的index.vue。
在pa…
uniapp里textarea多行文本输入限制数量
uniapp里textarea多行文本域实现输入计数
<template><view class"inputs"><textarea class"text1" maxlength50 placeholder请输入... input"sumfontnum"></textarea><text class"text2">{{fontNum}}/…
uniapp 下拉框数据回显的问题
问题 : 现在是下拉框数据回显不了, 绑定的v-model 原因 : uniui 下拉框数据绑定要是 value text 这种格式的
解决办法: 将获取到的后端数据 转换为 需要的格式 ,再进行绑定 下拉框的数据 遍历
uni-app 自定义导航栏-解决适配问题
前言 在实际开发中我们是根据需求，原型图，功能配色来开发，并不是考虑这个组件是不是能实现 首页我们不需要跳转时，会出现标题左移，渐变色，输入框，等等布局，原生导航栏就不满足需求 …
uni-app 使用uCharts-进行图表展示（折线图带单位）
前言 在uni-app经常是需要进行数据展示，针对这个情况也是有人开发好了第三方包，来兼容不同平台展示 uCharts和pc端的Echarts使用差不多，甚至会感觉在uni-app使用uCharts更轻便，更舒服 但是这个第三方包有优点就会有缺点…
小程序实现摄像头拍照 + 水印绘制
文章标题 01 功能说明02 使用方式 & 效果图2.1 基础用法2.2 拍照 底部定点水印 预览2.3 拍照 整体背景水印 预览 03 全部代码3.1 页面布局 html3.2 业务核心 js3.3 基础样式 css 01 功能说明
需求：小程序端需要调用前置摄像头进行拍照，并且将拍…
uniapp 上传静态资源-- 微信小程序跟QQ小程序上传静态资源到阿里的对象存储 OSS
概述
这两天有个需求，要微信小程序跟QQ小程序通过阿里的OSS储存，存放静态资源，遇到了挺多问题，记录一下~~~
文档：此处
服务器签名 其实这个是被误导了，也怪自己没有仔细看文档，不该有这一步&…
uni-app开发的微信小程序-打回登录页时会在左上角出现一个房子图标（返回首页）- 怎么回事-怎么解决
前言 发现项目，在首次进入时打回登录页，原生导航栏左边会出现一个房子按钮可以直接返回首页 最后查了一圈发现这个微信版本更新之后，当我们进入不是首页，或者tabbar页面时就会出现 微信针对这个也是有解决方案的，可以…
uniapp 悬浮窗-任意界面 Ba-FloatWinWeb
简介（下载地址）
Ba-FloatWinWeb 是一款支持自定义任意界面的悬浮窗插件。采用webview方式，同时支持本地、网络地址；自带几种界面，可直接使用。
支持显示、更新、隐藏支持记录显示位置支持拖动支持监听点击事件支持自…
uniApp常见面试题-附详细答案
uniApp中如何进行页面跳转？ 答案：可以使用uni.navigateTo、uni.redirectTo和uni.reLaunch等方法进行页面跳转。其中，uni.navigateTo可以实现页面的普通跳转，uni.redirectTo可以实现页面的重定向跳转，uni.reLaunch可以实…
uniapp 微信小程序 获取用户头像和昵称
一、背景
自2022年10月25日后，小程序 wx.getUserProfile 接口 被收回，通过 wx.getUserInfo 接口获取用户头像将统一返回默认灰色头像，昵称将统一返回 “微信用户”。如需获取用户头像昵称，可以手动获取，具体步骤&…
wap2app 隐藏系统状态栏
一、首先创建wap2App项目
1、文件》新建》项目 2、选择Wap2App项目：输入项目名称、网站首页地址（如果是本地localhost的话改为你的IP地址即可），点击创建 二、创建完wap2App项目后
隐藏系统状态栏只要修改1、2选项即可
1、找到根…
uni-app之android原生插件开发
一 插件简介
1.1 当HBuilderX中提供的能力无法满足App功能需求，需要通过使用Andorid/iOS原生开发实现时，可使用App离线SDK开发原生插件来扩展原生能力。
1.2 插件类型有两种，Module模式和Component模式 Module模式：能力扩展&…
uniapp 微信小程序最新隐私弹窗更新方案，更新后无法登录问题解决方案
1，在manifest.json文件中的mp-weixin 节点下，添加："__usePrivacyCheck__": true 2，在需要的页面配置隐私保护弹窗，或者直接写到首页也可以
<uni-popup ref"popusAuthorization" type"cen…
uniapp新版微信小程序用户隐私协议授权
新版微信小程序用户隐私协议授权,基础库版本必须大于等于2.32.3manifest.json文件中进行配置
"mp-weixin" : {"__usePrivacyCheck__" : true
},App.vue中配置 判断用户有没有进行过隐私授权 // #ifdef MPwx.getPrivacySetting({success(res) {//console.l…
![[uni-app] 海报图片分享方案 -canvas绘制](https://img-blog.csdnimg.cn/71f0bc27fe5f47ad9bf9aca5cdf0b053.png)
[uni-app] 海报图片分享方案 -canvas绘制
文章目录 canvas使用记录先看下实际效果图绘制流程及思路1. 绘制头像, 通过drawImage来绘制2.绘制文字部分 具体代码 分享海报图片的方式,以前再RN端采用的是截图方案, 我记得组件好像是 react-native-view-shot 现在要处理uni-app的海报图片分享, 一般也有 html2canvas的相关插…
uni-app 前面项目（vue）部署到本地win系统Nginx上
若依移动端的项目：整合了uview开源ui框架，
配置后端请求接口基本路径地址： 打包复现到nginx下： 安装个稳定版本的：nginx-1.24.0
部署配置：
增加了网站：8083端口的， 网站目录在ngi…
uniapp-小程序登录授权框
微信官方文档
不弹出授权框原因
因为版本问题，目前的最新的版本是不支持 wx.getUserInfo 去主动弹出授权框 只能引导用户去点击 butten 去授权 解决方法 我的思路是参考了其他的微信微信小程序, 就是跳转到我的页面的时候 在钩子函数内去触发一个封装的模态框,状…
uni-app(微信小程序)图片旋转放缩，文字绘制、海报绘制
总结一下：
要进行海报绘制离不开canvas，我们是先进行图片，文字的拖拽、旋转等操作 最后再对canvas进行绘制，完成海报绘制。
背景区域设置为 position: relative，方便图片在当前区域中拖动等处理。添加图片࿰…
uniapp-历史搜索记录
应用场景
很多搜索场景内都能用到这个功能
大概就是用户搜索了某个关键字 然后搜索的关键字可以持久的保存下来
下次打开搜索的时候可以达到快速点击搜索的效果
实现步骤
1. 先给输入框双向绑定数据和事件
<input v-model"keyWord">
2. 给搜索按钮绑定点…
uniapp打包安卓apk的隐私政策配置
uniapp打包安卓端app的隐私政策配置
1、隐私政策配置位置 2、uniapp项目配置文件代码
androidPrivacy.json
{"version" : "1","prompt" : "template","title" : "用户服务协议和隐私政协议","message&quo…
基于java SpringBoot和Vue uniapp的汽车充电桩微信小程序
摘要 随着电池性能的不断提高，电动汽车得到了广泛的应用，未来车辆发展的主要趋势将是电动汽车数量逐年增加，部分取代内燃机车，与此同时，随着电动汽车技术的日益成熟，电动汽车的管理和服务也更加规范。电动汽…
uniapp 选择地址
uni.getLocation(OBJECT) | uni-app官网
wx.getSetting({success: (res) > {if (!res.authSetting[scope.userLocation]) {wx.authorize({scope: scope.userLocation,success: (res) > {},fail: (res) > {wx.showModal({title: 提示,content: 位置信息未授权…
uni-app 之 下拉刷新，上拉加载，获取网络列表数据
uni-app 之 下拉刷新，上拉加载，获取网络列表数据 image.png
<template><view><!-- 车源模块 -->--- uni.request 网络请求API接口 ---<view v-for"(item) in newsArr" :key"item.id" style"display: fle…
【uniapp】使用canvas组件编译到微信小程序兼容出错问题
使用uniapp编译跨平台项目会遇到不少兼容问题，这里主要讲canvas组件的，编译到微信小程序会有兼容出错问题，这里给讲一下解决方案，希望有帮助。
常见问题
draw无法绘制图形
如果使用CanvasContext绘制，以下代码&…
【uniapp】小程序开发：2 安装uni-ui组件库、使用pinia状态管理、自定义http请求
一、安装uni-ui组件库
1、安装
pnpm i -D sass
pnpm i dcloudio/uni-ui2、配置组件自动导入 使用 npm 安装好 uni-ui 之后，需要配置 easycom 规则，让 npm 安装的组件支持 easycom
打开项目根目录下的 pages.json 并添加 easycom 节点：
//…
uniapp 实现当前页面分享至微信好友或朋友圈功能（带参数和无参数）
文章目录 uniapp 实现分享至微信好友或朋友圈功能无参数跳转带参数跳转结束语 大家好！匆匆忙忙又到了周三，今天是2023年9月13日|农历七月二十九，今天这篇文章主要是微信小程序实现分享当前页面到朋友圈或微信好友，下面来看下具体实…
uniapp——实现聊天室功能——技能提升
这里写目录标题 效果图聊天室功能代码——html部分代码——js部分代码——其他部分 首先声明一点：下面的内容是从一个uniapp的程序中摘录的，并非本人所写，先做记录，以免后续遇到相似需求抓耳挠腮。
效果图 聊天室功能
发送图片 …
酒水供应商订购商城配送系统客户管理系统 微信小程序uniapp
酒水供应商客户管理系统主要是为了提高用户的工作效率和更方便快捷的满足用户，更好存储所有数据信息及快速方便的检索功能，对酒水供应商客户管理系统的各个模块是通过许多今天的发达酒水供应商客户管理系统做出合理的分析来确定考虑用户的可操作性&#…
交友盲盒完整版——详细源码分享
现在目前比较火热的一款app交友盲盒是通过uniappspringboot技术来制作的，原理其实很简单，大家一看便知。 大家自行下载到手机里面去使用即可，不支持ios手机
演示地址：https://share.weiyun.com/l3ovztce 下面就是给大家分享源码了…
【uniapp关联unicloud，阿里云云服务空间】unicloud本地调试服务启动失败:当前项目未关联unicloud服务空间,请调整后重新运行，已解决
最近开发app项目，很多都是第一次上手
1、在Hbuider中运行项目，出现如下提示 2、项目根目录下已有uniCloud文件夹 3、如果云开发环境未创建，可以右击项目，选择创建uniCloud云开发环境 4、创建好的目录如下，index.js中…
uniapp代码混淆ios上架43问题
参考文章：uniapp打包ios apk，混淆代码_uniapp 混淆_酸奶自由竟然重名了的博客-CSDN博客
uniapp打包ios，上传到ios应用市场时，会因为 4.3(代码重复率过高) 无法通过审核，此时可通过混淆代码来通过审核
1. 项目终端 安…
uni-app:单页面的页面切换
效果 代码
<template><view><view class"tab-bar"><text class"tab" :class"{ active: activeTab 0 }" click"changeTab(0)">页面1</text><text class"tab" :class"{ active: acti…
uni-app vuex全局计时
功能需求，在A页面进入时候开始计时中间会去到B页面查看数据，但是并没有销毁当前页面，所以计时一直在，直到在B页面提交数据，才结束计时
在根文件夹创建 store文件夹，同时创建index.js文件import Vue from v…
uni-app:标签中对数据进行判断，看数据前中后是否含有需要的字符startsWith()，endsWith()，includes()
效果图 核心代码
判断数据是否存在并且此数据是否以‘-’开头
<image v-if"line && line.startsWith(-)" :src"img1" alt""></image>
判断数据是否存在并且此数据是不是以‘ing’结尾
<image v-if"line &&…
uniapp掉完接口后刷新当前页面方法
uniapp掉完接口后刷新当前页面方法 掉完接口，里面加下面这个方法uni.redirectTo({}) setTimeout(() > {uni.redirectTo({// 当前页面路由url: /pages/property/mutualrotation/mutualrotation);}, 500)实例
mutualRotationSubmit() {let self this;uni.showMod…
uniapp开发h5，解决项目启动时，Network: unavailable问题
网上搜了很多，发现都说是要禁用掉电脑多余的网卡，这方法我试了没有好，不晓得为啥子，之后在网上看，uniapp的devServer vue2的话对标的就是webpack4的devserver（除了复杂的函数配置项），…
uniapp微信小程序地图实现周边
官方说明：小程序JavascriptSDK使用指南 - 微信小程序解决方案 | 腾讯位置服务https://lbs.qq.com/product/miniapp/jssdk/ 先申请腾讯地图的开发者密钥，申请地址：腾讯位置服务 - 立足生态，连接未来 申请密钥时，需要勾…
uni-app轮播图制作
Uni-app是一种跨平台开发框架，可以用来开发多个平台的应用程序。在Uni-app中，可以使用uni-swiper组件制作轮播图。
制作轮播图的步骤如下： 在pages文件夹中创建一个新页面，例如index.vue。 在index.vue中添加uni-swiper组件&…
uniapp运行到IOS真机提示 错误:请查看是否设备未加入到证书列表或者确认证书类型是否匹配
参考文章：请查看是否设备未加入到证书列表或者确认证书类型是否匹配
ios开发描述文件必须绑定调试设备，只有授权的设备才可以直接安装基座，所以在申请开发描述文件之前，先添加调试的IOS设备。
前往网站https://developer.apple.…
基于Java+SpringBoot+Vue的图书借还小程序的设计与实现（亮点：多角色、点赞评论、借书还书、在线支付）
图书借还管理小程序 一、前言二、我的优势2.1 自己的网站2.2 自己的小程序（小蔡coding）2.3 有保障的售后2.4 福利 三、开发环境与技术3.1 MySQL数据库3.2 Vue前端技术3.3 Spring Boot框架3.4 微信小程序 四、功能设计4.1 主要功能描述 五、系统实现5.1 小…
uni-app实现点击复制按钮 复制内容
注意:uni.setClipboardData({})里面的data参数必须是字符串类型这个是大坑 第一种
<view>{{orderId}}</view> //复制的内容
<button click"copy(orderId)">复制</button>copy(value) {uni.setClipboardData({data: value , // 这里是个坑接…
uniapp-时间格式和距离格式的转换
时间格式的转换
第一种是把 YYYY-MM-DD hh:mm:ss 转换成 MM月DD日
第二种是把 hh:mm:ss 转换成 hh:mm /*** 格式化时间 1* 把传入的完整时间分为 MM月DD日 的格式* returns*/
export function formatDate(timeStr) {const date new Date(timeStr);const month (date.ge…
基于uniapp开发 软盒APP系统源码 软件库系统源码 全开源
软盒APP前端-基于uniapp，一个开源的软件库系统 前端开源地址：软盒APP前端-基于uniapp: 软盒APP前端-基于uniapp (gitee.com)
更新说明
更新日期：2023.07.24 v1.0.8.23724
1.修复部分接口
2.删除根据标签获取软件列表接口，整合…
uniapp 使用subNVue原生子窗体显示弹框或悬浮框
效果展示
在uniapp中，我们可以使用subNVue原生子窗体来解决web-view等原生页面中弹框无法显示的问题。
subNVue原生子窗体是uniapp提供的一种原生组件，可以在uniapp中嵌入原生页面，并且可以与uniapp页面进行通信。我们可以在原生页面中使用…
uniapp 点击事件-防重复点击
uniapp 点击事件-防重复点击
1、common文件并创建anti-shake.js文件
// 防止处理多次点击
function noMoreClicks(methods, info) {// methods是需要点击后需要执行的函数， info是点击需要传的参数let that this;if (that.noClick) {// 第一次点击that.noClick f…
uniapp存值和取值，获取登录凭证 code方法
Uniapp 的存值和取值
Uniapp 的存值和取值方法可以使用Vue.js的数据绑定方式，也可以使用uni.setStorageSync() 和 uni.getStorageSync() 方法。
使用Vue.js的数据绑定方式：
在Vue组件中定义一个data属性，然后将需要存储的值赋给该属性。例…
uni-app打包iOS ipa文件后不上架App store为用户提供下载解决过程记录
写在前面，itms-services协议是什么
itms-services协议是苹果提供的一种让iOS应用在用户设备上无线安装或升级的协议。 具体来说:
itms-services表示iOS应用无线安装服务的URL方案,格式为:itms-services://?actiondownload-manifest&urlMANIFEST_URL其中MANIF…
【uniapp+vue3+u-picker】获取中国省市区数据结构，省市区数据三级联动json文件完整版，已实现三级联动效果
前言： 这个功能的实现，中间耽误了几天，在大佬的帮助下终于实现效果，匿名感谢xx大佬 要实现的效果如下： 1、首先需要获取省市区的数据，不考虑后端返数据，自己使用json文件的话，需要获取到完整的中国省市区数据 有个很不错的github源码可供参考，Administrative-divisio…
uniapp自定义播放器
问题描述：我是真无语啊，就是有一个目录切换的地方，然后切换音频，结果你猜怎么着，嘿，音频他不播放了。也就是下面这个方法都不进去了打印的时候，音频播放都播放不了了，我尝试了销毁在…
uniapp——实现二维码生成+保存二维码图片——基础积累
最近在做二维码推广功能，自从2020年下半年到今天，大概有三年没有用过uniapp了，而且我之前用uniapp开发的程序还比较少，因此很多功能都浪费了很多时间去查资料，现在把功能记录一下。 这里写目录标题 效果图1.根据接口返…
uniapp确认提示框；uniapp判断输入框值是否符合正常手机号，身份证号
确认提示框
UniApp 中，你可以使用 uni.showModal 方法来创建确认提示框。以下是一个示例：
<template><view class"container"><button click"showAuthModal">显示确认提示框</button></view>
</…
uni-app混合开发 navigateTo、reLaunch、redirectTo、switchTab区别
1.navigateTo
保留当前页面，跳转到应用内的某个页面，使用uni.navigateBack可以返回到原页面。
要注意的是navigateTo只能跳转的应用内非 tabBar 的页面的路径 , 路径后可以带参数；如果跳转url参数为tabBar的路径则无法进行跳转
2.redir…
uniapp 路由模式 history
亲测、比如 uniapp 的 H5 配置：
nginx 配置如下，只影响网站下某个目录：
location ^~ /test {try_files $uri $uri/ /test/index.html;
}
uniapp-引入模块失效的问题
在前段时间的开发中，我遇到了一个bug
就是引入了一个模块但是却没有生效，由于静态页面不是我完成的，所以我花了一些时间才发现问题所在
1. 查看是否忘记添加components
components: {addCart,myCart,
},
2. 查看是否引入路径有误 Compone…
unipush2.0实现APP消息推送（2）云函数多个方法的创建与使用
问题：上篇文章我们已经介绍到了unipush2.0消息推送的实现思路，但是遇到一个问题就是如何在一个云函数里写多个方法供传统服务端调用？
这样做的目的：这样传统服务端就可以调用一个云函数url路径传递不同的参数标识走不同的方法了 …
uniApp监听左右滑动事件
监听左右滑动事件的步骤
1. 添加需要监听滑动事件的元素
在你的页面中，添加需要监听滑动事件的元素。这可以是一个 view、swiper 或其他组件，取决于你的需求。例如：
<template><view class"body" touchstart"touc…
webstorm HbuilderX工具未配置
问题：调试动迁uni app h5项目，报错
webstorm是换了电脑新安装，
HBuilerx是从旧电脑拷贝过来的解压的文件 解决：
把uniapp插件，卸载
再重启webstorm,重装安装uniapp Tool， 安装第一个，免费。…
出行类APP商业化路径解决方案
当下市场主流的商业化路径和方法相比于之前区别不大，开发者们都是在现有商业化体系下，制定更加详细、优质的策略，以期获得更高利益。
出行类App用户结构分析
年龄层次：出行类App用户的年龄分布比较广泛，主要集中在20…
uniapp h5 微信缓存，解决版本更新还是旧版本
文章目录 一、微信缓存是什么？二、如何解决1.打包入口文件解决2.给请求url加时间戳3.给打包的js文件添加时间戳并修改打包后的css文件夹 总结 一、微信缓存是什么？
微信缓存是指微信客户端为了提高用户的使用体验，会在用户使用微信过程中将一…
uniapp 小程序 全局弹窗 每个需要使用的页面都不用再引用
文章目录 创建组件在项目的根目录下的vue.config.vue中配置页面中使用 使用全局组件，先声明全局组件 与普通的组件声明不同之处在于 1：目录形式 2：声明引用方式 创建组件
在components目录中创建组件目录/组件vue，如下 注意需要同…
uniapp 小程序 父组件调用子组件方法
答案：配合小程序API > this.selectComponent("")，来选择组件，再使用$vm选择组件实例，再调用方法，或者data
1 设置组件的id,如果你的多端，请跟据情况设置ref,class,id，以便通过小…
uniapp之uni-forms表单组件封装的双向数据绑定
前言 在uniapp中, 封装组件的props单向数据流更为严格, 不允许改变子组件的props属性, 所以记录下uniapp下的form表单的组件是如何封装的, 双向数据是如何绑定的. 版本: "dcloudio/uni-ui": "^1.4.27", "vue": "> 2.6.14 < 2.7&quo…
uniapp微信小程序《隐私协议》弹窗处理流程
背景 《关于小程序隐私保护指引设置的公告》 《小程序隐私协议开发指南》
流程
1.第一步 必须设置且审核通过！！！ 2.第二步
uniapp在manifest.json中添加！！！
/*
在 2023年9月15号之前，在 ap…
uniapp-一些实用的api接口
唤起导航
调用后可以跳转到地图页
uni.openLocation({latitude: res.data.data.latitude, //到达的纬度longitude: res.data.data.longitude, //到达的经度name: res.data.data.address, // 到达的名字scale: 12, // 缩放倍数success() { // 成功回调console.log(success) }…
uniapp瀑布流布局写法
首先我们要清楚瀑布流是什么？ 瀑布流布局（Waterfall Flow Layout），也称为瀑布流式布局，是一种常见的网页或移动应用布局方式，特点是元素以不规则的方式排列，就像瀑布中的流水一样，每…
uni-app 框架中使用 vuex（store）
Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。
uni-app 内置了 Vuex，不需要额外安装。
使用步骤如下：
1、项目根目录下新建 store/…
uni-app 之 去掉顶部导航
uni-app 之 去掉顶部导航 uniapp怎么样去掉顶部导航 uniapp去掉顶部导航的方法： 1、去掉所有导航栏； 2、单一页面去掉顶部导航栏。 image.png
uniapp去掉顶部导航的方法：
1、去掉所有导航栏 "globalStyle": {"navigationBar…
uni-app:实现等待加载功能
例子
下例是实现蓝牙连接的部分代码，先进行加载连接显示，在进行连接，连接成功/失败，都自动关闭加载效果
效果 核心
开始的加载效果：
uni.showLoading({title: 正在连接，请稍候...,mask: true,
});
关闭…
uniapp——实现base64格式二维码图片生成+保存二维码图片——基础积累
最近在做二维码推广功能，自从2020年下半年到今天，大概有三年没有用过uniapp了，而且我之前用uniapp开发的程序还比较少，因此很多功能都浪费了很多时间去查资料，现在把功能记录一下。 这里写目录标题 效果图1.base64生成…
uni-app进行表单效验
Uni-app内置了一些表单验证方法，可以帮助我们对表单进行有效的验证。以下是一些常用的验证方法：
非空验证：
if(!this.formData.name){uni.showToast({title: 请输入姓名,icon: none});return false;
}手机号码验证：
const phon…
uniapp项目实践总结(二十)URLScheme 协议知识总结
导语：在日常开发过程中，我们经常可以碰到很多的调起某个应用，打开唤醒某个 APP，链式启动 App 等场景，背后就涉及到了 URLScheme 协议的相关知识，下面就简单介绍一下。 目录
简介常见 URL Scheme跳转方法实…
uni-app使用vue3，在元素或组件实例上添加ref，用this.$refs显示undefined
项目中引用了一个UI组件库，在表单上添加了ref属性，方便提交时验证。触发提交方法时显示不存在这个方法或this.$refs为undefined。
解决方法：
import { getCurrentInstance } from vue// 获取当前组件实例
const { ctx } getCurrentInstanc…
Uts阿里百川旗舰版插件UniApp-X
简介：
此插件为Uts插件，1.0版暂只支持安卓
插件地址：https://ext.dcloud.net.cn/plugin?id14771
接入阿里百川安卓旗舰版最新版5.0.1.9！支持淘宝授权登录，获取登录用户信息，拉起淘宝，打开商…
uni-app, 实现 scroll-view 自动滚动到底部，并控制触发频率
实现思路
通过 scroll-view 组件的 scroll-top 属性可以设置容器竖向滚动条位置
属性名Valuescroll-y允许纵向滚动scroll-top设置竖向滚动条位置
想要实现 scroll-view 滚动到底部，只需要让
scroll-top scroll-view 内容高度 - scroll-view 容器本身高度&#…
基于Java+SpringBoot+Vue+Uniapp祛痘打卡小程序设计与实现(源码+lw+部署文档+讲解等)
文章目录 前言用户微信端的主要功能有：管理员的主要功能有：具体实现截图详细视频演示为什么选择我自己的网站自己的小程序（小蔡coding）有保障的售后福利 代码参考论文参考源码获取 前言 💗博主介绍：✌全网粉…
uniapp存值和取值方法
在UniApp中，可以使用全局变量、本地缓存和Vuex状态管理等方式来进行存值和取值。
全局变量：可以在App.vue文件的data中定义一个全局变量，在其他页面或组件中通过uni.$emit方法修改其值，并通过uni.$on方法监听值的变化。
// App.…
uniapp如何判断是哪个（微信/APP）平台
其实大家在开发uniapp项目的时候长长会遇到这样一个问题，就是针对某些小程序，没发去适配相关的功能，所以要针对不同的平台，进行不同的处理。
#ifdef ： if defined 仅在某个平台编译
#ifndef ： …
前端uniapp如何转base64使用uniapp插件市场
插件市场
网址
使用 可以下载，也可以引用，我是下载下来的引用 代码
正常使用
pathToBase64(img).then(path > {img pathresolve(path)}).catch(error > {console.error(error)reject(error)})使用出现[object Promise]错误 解决方法 let img …
【uniapp】开发app运行到手机预览（运行到安卓app基座）
1、先安装App真机运行插件 2、手机打开调试模式（开发者模式）/打开usb安装，因为运行到手机需要下载安装手机端HBuilder调试基座…
3、运行到安卓app基座 4、等待安装好应用基座后便可以预览项目
uniapp、vue实现滑动拼图验证码
uniapp、vue实现滑动拼图验证码 实际开发工作中，在登陆的时候需要短信验证码，但容易引起爬虫行为，需要用到反爬虫验证码，今天介绍一下拼图验证码，解决验证码反爬虫中的滑动验证码反爬虫。滑动拼图验证码是在滑块验证码…
uniapp 内容展开组件
uni-collapse折叠面板并不符合需求，需要自己写一个。
效果展示： 代码： （vue3版本）
<template><view class"collapse-view"><view class"collapse-content"><swiper:autopl…
uniapp 引入并使用外部字体
1.下载(.ttf)并放入项目中 1.1网站搜索下载字体对应ttf文件 附一个下载字体网站:
字体天下-提供各类字体的免费下载和在线预览服务 1.2 把下载好的文件放入static/font目录中 2.在app.vue中引用 font-face {
font-family: zitiming;
src: url(/static/font/YouSheBiaoTiHei-…
uni-app使用HBuilder X编辑器本地打包apk步骤说明
1.下载安装Android Studio
下载地址官方地址：Android Studio 下载文件归档 | Android 开发者 | Android Developers
安装Android SDK和Google USB Driver即可，后者主要是为了后期使用USB设置的，如果不需要可以不点。
2.下载uni-app提供…
安卓主动发数据到uniapp界面
业务场景： 安卓原生混合app（uniapp），当安卓的sdk有数据回调的时候，uniapp那边怎么实时获取到呢？不是只能通过调用函数的方式获取回调结果的，还有另一种方法，就是使用监听。 在uniapp…
uni-app：实现picker下拉列表
效果 代码
<template><view class"container"><picker name"info" change"bindPickerChange9" :value"index9" :range"selectDatas9"><view class"right"><view class"right_l…
uniapp实现点击按钮分享给好友
<button class"share" open-type"share">分享</button>import {onLoad,onShareAppMessage,onShareTimeline} from dcloudio/uni-app
onLoad(() > {//设置Menus菜单，使 发送给朋友/分享到朋友圈 两个按钮可以使用wx.showShareMen…
uni-app问题记录
一、启动问题记录
1. 报错1 解决办法: 开启微信开发者工具服务端口
2. 报错2:调用getLocation获取位置信息时报错以下内容
{errMsg: “getLocation:fail the api need to be declared in the requiredPrivateInfos field in app.json/ext.json”} 解决办法: manifest.json文…
uni-app：多方法实现两个view在同一行展示
效果 方法一：flex 布局
使用 display: flex 后，默认的 flex-direction 值就是 row，即水平排列。
<template><view class"container"><view class"left-view">123</view><view class"r…
前端uniapp图片select联动文本切换
图片 代码
<template><!-- 这个是uniapp的下拉框 --><uni-data-select v-model"pay_type" :localdata"range" change"handleSelectChange"></uni-data-select><!-- 图片 --><image :src"dynamicImage&qu…
uniapp h5实现微信公众号登录
官方说明文档：https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/Wechat_webpage_authorization.html 下面就直接写登录过程了 <!-- #ifdef H5 --><tn-button click"goToLoginH5" shape"round" backgroundColor"#FF…
uni-app：canvas-绘制图形2
效果 代码 <template><view><!-- 创建了一个宽度为300像素，高度为200像素的canvas元素。canvas-id属性被设置为"firstCanvas"，可以用来在JavaScript中获取该canvas元素的上下文对象。 --><canvas style"width:200px…
uni-app 之 Toast 消息提示
uni-app 之 Toast 消息提示 image.png
<template> <view class"content"> <u-button click"showToast">Toast 消息提示 </u-button><u-toast ref"uToast"></u-toast></view></template>
<…
uni-app：官方文档中的canvas实例剖析
效果 代码
<template><view><!-- 创建了一个宽度为300像素，高度为200像素的canvas元素。canvas-id属性被设置为"firstCanvas"，可以用来在JavaScript中获取该canvas元素的上下文对象。 --><canvas style"width: 30…
uniapp 事件委托失败 获取不到dataset
问题：
v-for 多个span ,绑定点击事件
代码:view里包着一个span,
<view class"status-list" tap"search"><span class"status-item" v-for"(key,index) in statusList" :key"index" :data-key"k…
【uniApp新模式: 使用Vue3 + Vite4 + Pinia + Axios技术栈构建】
目录 1，背景2，版本号3，项目目录结构4，开发流程4.1，安装4.2，使用axios4.3，配置vue自动导入 1，背景
使用Vue3 Vite4 Pinia Axios Vscode模式开发之后，感叹真香&#x…
uniapp app 导出excel 表格
直接复制运行
<template><view><button click"tableToExcel">导出一个表来看</button><view>{{ successTip }}</view></view>
</template><script>export default {data() {return {successTip: }},metho…
uniapp：如何修改路由加载条的样式
路由加载条默认是绿色，通过元素选择工具我们可以知道元素的类名是#router-loadding .loadding，具体设置在h5-dom.js文件里。 我们直接在App.vue里对加载样式进行修改即可，如下图：
!important一定记得要加，否则不生效&…
uni-app：实现元素在屏幕中的居中（绝对定位absolute）
一、实现水平居中
效果 代码
<template><view><view class"center">我需要居中</view></view>
</template><style>.center {position: absolute;left:50%;transform: translateX(-50%);border:1px solid black;}
</s…
uniapp navigateTo url路由传参(传递对象)
uniapp navigateTo url路由传参(传递对象)
1、跳转页面
// 详情
myInInfoClick(obj) { uni.navigateTo({ url:./components/addIn?dataItemencodeURIComponent(JSON.stringify(obj))});
},2. 跳转到的页面
onLoad(option) { let str decodeURIComponent(option.dataItem)i…
uniapp 实现下拉筛选框 二次开发定制
前言
最近又收到了一个需求，需要在uniapp 小程序上做一个下拉筛选框，然后找了一下插件市场，确实有找到，但不过他不支持搜索，于是乎，我就自动动手，进行了二开定制，站在巨人的肩膀上&…
uniapp h5中疯狂报错Invalid Host/Origin header
结果把端口号从8080改成跟别的项目都不一样的端口8090就好了！！！真的被气炸
uniapp快速入门系列（1）- 概述与基础知识
章节三：抖音小程序页面开发 第1章：概述与基础知识1.1 uniapp简介1.1.1 什么是uniapp？1.1.2 为什么选择uniapp？1.1.3 uniapp与微信小程序的关系 1.2 HBuilderX介绍与安装1.2.1 什么是HBuilderX？1.2.2 HBuilderX的安装1.…
踩坑日记 uniapp 底部 tabber遮挡住购物车结算
tabbar 被购物车结算遮挡 在小程序上tabbar没有将固定栏遮挡，如果直接调高，浏览器H5页面是对了，但在小程序上面离底部的定位就太高了 原代码
// 底部结算样式.shop-foot {border-top: 2rpx solid #F7F7F7;background-color: #FFF;position: …
uniapp部分知识总结
uniapp进行条件编译的两种方法？小程序端和H5的代表值是什么？ 在 UniApp 中，可以使用条件编译来根据不同的平台（小程序端、H5 等）或编译条件（如开发环境等）进行代码的选择性编译。UniApp 提供了两…
Uniapp 新手专用 抖音登录 获取用户头像、名称、openid、unionid、anonymous_openid、session_key
TC-dylogin 一定请选择 源码授权版 教程
第一步
将代码拷贝至您所需要的页面 该代码位置：pages/index.vue 第二步
修改appid和secret 第三步 获取appid和secret
获取appid和secret链接 注意事项
为了安全，我将默认的自己的appid和secret在云函数中删…
uniapp微信小程序蓝牙连接与设备数据对接
蓝牙连接并通信方法封装大致步骤。
初始化蓝牙并搜索；获取并启用service服务；数据读取和监听设备返回数据
需要使用uniapp官方提供api：
// 关闭蓝牙
uni.closeBluetoothAdapter({})
// 打开蓝牙
uni.openBluetoothAdapter({})
// 搜索附近…
uniapp\ taro 如何使用 UnoCSS 原子化css
unocss-preset-weapp
相较于 tailwindcss 和 windicss, unocss的性能和可扩展性都优于它们 UnoCSS小程序预设 unocss-preset-weapp
内置 transformer 用于兼容小程序
transformerClass 转换转义类名，解决小程序不支持\\，\:，\[，…
【uniapp】小程序开发5：获取openid、获取手机号
一、获取小程序openid
需要配合后端接口获取授权码（code）
1）调用uni.login()方法获取授权code，并把code传给getOpenid
//使用uni.login的时候可以在任何接口下使用即可，主要看打印出来的code值和openid
let that t…
【uniapp】小程序开发4：微信小程序支付、h5跳转小程序
一、微信小程序支付
// #ifdef MP-WEIXIN
isMpweixintrue
// 调用微信官方支付接口弹出付款界面
wx.requestPayment({appId: payData.appId, timeStamp: payData.timeStamp, //后端返回的时间戳nonceStr: payData.nonceStr, //后端返回的随机字符串package: payData.pa…
uni-app：实现页面效果4（echarts数据可视化）
效果 代码
<template><view><view><view class"title">概况</view><view class"line_position"><view class"line1"><view class"item"><view class"one">今日销售…
uniapp EventChannel 页面跳转参数事件传递navigateBack，navigateTo 成功后通知事件区别
问题：navigateBack（）emit事件在onload()监听不到 从A页面跳转到B页面，在B点击产生数据后，跳转回到A，并告诉A点击的数据是什么，使用：
navigateBack（）。
&…
vue、uniapp实现组件动态切换
在Vue中，通过使用动态组件，我们可以实现组件的动态切换，从而达到页面的动态展示效果。 vue 中 component组件 is属性 功能描述 例如：有多个tabs标签，如：推荐、热点、视频等。用户点击标签就会切换到对应组…
uniapp快速入门系列（3）- CSS技巧与布局
章节二：CSS技巧与布局 1. uniapp中的样式编写2. 常见布局技巧与实例解析2.1 水平居中布局2.2 垂直居中布局2.3 等高布局2.4 响应式布局 3. CSS动画与过渡效果 在uniapp中，我们使用CSS来设置页面的样式和布局。本章将介绍一些在uniapp中常用的CSS技巧和布…
解决video层级过高在app的问题
直接上代码,写一个组件
<template><iframe :onload"inner"></iframe>
</template>
<script>export default {props: {src: {}},data() {return {inner: }},created() {this.inner this.contentWindow.document.body.innerHTML <v…
在uniapp中为自定义组件绑定点击事件点击后没有效果
使用uniapp时，封装了一个Card的组件，为这个Card组件加上点击事件 click"handleClick"事件时，事件没有触发。点开微信小程序生成后的源码，可以看到 click的事件变成bindClick了。正确的点击事件应该是bindtap，…
uniapp 首页制作
uniapp拨打固定的电话 function Hotline() {// 拨打电话uni.makePhoneCall({phoneNumber: 19969547693})}页面跳转 //普通跳转function homepage() {uni.navigateTo({url: /pages/homepage/homepage});}//二、uni.redirectTo关闭当前页面，跳转到应用内的某个页面。…
uniapp 跳转到指定位置
this.$router.push({name: Demo,params: {id: 123}
})这样就实现了页面的跳转，并且将参数id传递给了Demo组件。
如果需要跳转到当前页面的不同位置，我们可以使用锚点来实现。锚点是一个HTML元素的标识符，可以用于定位和跳转到该元素。例如&a…
uniapp：幸运大转盘demo
<template><view class"index"><image src"../../static/img/158.png" mode"" class"banner"></image><view class"title">绿色积分加倍卡拿到手软</view><almost-lottery :lottery…
uni-app的优缺点；uniapp进行条件编译的两种方法；小程序端和H5的代表值
Uni-app 是一个跨平台的开发框架，具有以下优点和缺点：
优点： 跨平台开发：Uni-app 支持一次编写，多端运行，可以同时覆盖小程序、H5、App以及其他平台。这样可以大大减少开发人员的工作量和时间成本。 统一…
uniapp 使用和引入 thorui
1. npm install thorui-uni 2. "easycom": { "autoscan": true, "custom": { "tui-(.*)": "thorui-uni/lib/thorui/tui-$1/tui-$1.vue" } }, 3.
geecg-uniapp 同源策略 数据请求 获取后台数据 进行页面渲染 ui库安装（3）
一，同源策略
（1）首先找到env 要是没有env 需要创建一个替换成后端接口 （2）因为他封装了 先找到 http 请求位置一级一级找 然后进行接口修改 （3）appUpdata 修改接口 运行即可 &#x…
【uniapp】自定义导航栏时，设置安全距离,适配不同机型
1、在pages.json中，给对应的页面设置自定义导航栏样式 {"path": "pages/index/index","style": {"navigationStyle": "custom","navigationBarTextStyle": "white","navigationBarTitl…
uni-app：实现滚动条效果
效果
前（这里使用到了强制不换行white-space: nowrap;） 后 核心代码 overflow: auto; 或 overflow-x: auto; /* 横向滚动条 */ 注：使用 overflow: auto 属性时，如果内容没有超出容器的宽度或高度，则不会显示对应的滚动…
uniapp 小程序生成二维码并转为图片
1、vue文件
<view class"container"><canvas class"code" canvas-id"myQrcode" style"width: 400rpx;height:400rpx;margin: 200rpx 0;" longpress"saveImg()"/><view>长按保存到手机</view>
<…
uniapp 返回上一步携带参数
1. 下一步
// 返回上一页setTimeout(() > {let pages getCurrentPages();let prevPage pages[pages.length - 2];prevPage.$vm.schoolName this.formList;uni.navigateBack({delta: 1});}, 1000)
2. 返回上一步, 携带参数 // 获取下一步返回的数据onShow() {let pages …
uniapp中input的disabled属性
uniapp中input的disabled属性：
小程序中兼容性好；
在H5中兼容性差；
在H5中使用uniapp的input的disabled属性，属性值只能是true或false，如果为0， "都会为true；
<input class"in…
vue3+ts+uniapp（微信小程序）---- 点击按钮保存图片的功能
vue3tsuniapp（微信小程序）---- 点击按钮保存图片的功能 描述：后台会给一张二维码图片，用户点击保存按钮即可保存图片到相册。 注意： 1）图片要是https形式； 2）要在微信公众平台中更新…
uniapp app端使用谷歌地图选点定位
国内需要vpn 和申请谷歌地图的Maps JavaScript API 类型的 key,指引链接这里不详细介绍
一 、我们得通过webview 跳转谷歌地图 ,需要创建一个webview页面,里面跳转承载谷歌地图的html页面,如果是放在本地的话 html文件须遵守规范 放在 “项目根目录下->hybrid->html->…
uniapp h5 MD5加密
文章目录 1.当使用 CryptoJS 进行 MD5 加密时，你需要先引入 CryptoJS 库并确保它已经正确安装。下面是一个更详细的示例代码：2.然后，在需要使用 MD5 加密的地方，引入 CryptoJS 代码库：3.接下来，我们定义一个…
uni-app ： 生成三位随机数、自定义全局变量、自定义全局函数、传参、多参数返回值
核心代码
function generateRandomNumber() {const min 100;const max 999;// 生成 min 到 max 之间的随机整数// Math.random() 函数返回一个大于等于 0 且小于 1 的随机浮点数。通过将其乘以 (max - min 1)，我们得到一个大于等于 0 且小于等于 (max - min 1…
uniapp 微信小程序 vue3.0+TS手写自定义封装步骤条（setup）
uniapp手写自定义步骤条（setup）
话不多说 先上效果图： setup.vue组件代码：
<template><view class"stepBox"><viewclass"stepitem"v-for"(item, index) in stepList":key"i…
geecg-uniapp 同源策略 数据请求 获取后台数据 进行页面渲染 ui库安装 冲突解决（3）
一，同源策略
（1）首先找到env 要是没有env 需要创建一个替换成后端接口 （2）因为他封装了 先找到 http 请求位置一级一级找 然后进行接口修改 （3）appUpdata 修改接口 运行即可 &#x…
uniapp左滑列表删除
目录 效果index.vuedelSlideLeft.vuedelRightIconfont.css参考插件最后 效果 index.vue
使用页面 引入封装的页面delSlideLeft.vue
<template><view class""><view v-for"(item, index) in busOrderList" :key"index" :data-in…
uniapp(uncloud) 使用生态开发接口详情2(使用 schema创建数据, schema2code创建页面, iconfont 引入项目)
上一篇介绍如何创建项目,接下来该是如何使用
在项目中pages 目录下,新建界面 项目运行,浏览器中用账号密码登录, 新建一级和二级页面 2.1 系统管理 > 菜单管理 (新增一级界面) 2.2 找到刚刚创建的菜单, 操作行有 子菜单(点击) 用DB Schema创建页面, 3.1 在uniCloud > d…
uniapp(uncloud) 使用生态开发接口详情(1简单的创建)
开发接口对比时间: 用java开发接口周期太长, 大概5-6个月左右 用php 开发接口周期同样太长, 大概3-4个月左右 用node.js 开发接口周期相对短一点, 大概1-2个月左右 用uniapp 开发接口, 可以不到 1-2周的时间
这里我使用 uniapp 开发接口, 废话不多说了,直接开干 HBuilder官网(…
uniapp中全局页面挂载组件（H5）
前言 我们已经学习了 uniapp中全局页面挂载组件（小程序） 有些小伙伴问在H5怎么做那让我们试一试
直接上代码
//引用组件
import dialog from ./index.vue;
//我这里要把小程序的方法和h5方法写一起所以用了混入
import mixins from ./mixins.js
//使用…
uniapp简单实现搜索--历史记录功能
点击搜索时候，将搜索的值存入本地记录并展示，并且有清空历史记录功能。 代码直接贴上：
<template><view><!-- 搜索框 --><view class"search"><view style"display: flex;align-items: center;&q…
小程序：uniapp解决主包体积过大的问题
已经分包但还是体积过大
运行时勾选“运行时是否压缩代码”进行压缩 在manifest.json配置（开启分包优化）
"mp-weixin" : {"optimization" : {"subPackages" : true}//....
},在app.json配置（设置组件按需注入…
![[uni-app] canvas绘制圆环进度条](https://img-blog.csdnimg.cn/1d2e9493e93246018115ae6dd13dd41a.png)
[uni-app] canvas绘制圆环进度条
文章目录 需求参考链接基本问题的处理1:画布旋转的问题2:注意arc()的起始位置是3点钟方向3: 如果绘制1.9*Matn.PI的圆环, 要保证其实位置在0点方向?4:小线段怎么画, 角度怎么处理? 源码 需求
要绘制一个如此的进度条
参考链接
uni-app使用canvas绘制时间刻度以及不显示问…
uniapp(uncloud) 使用生态开发接口详情3(新增产品分类,产品列表,新闻列表)
我的想法是有产品分类,产品列表,新闻咨询,新闻列表
项目中, uniCloud > database 目录下新建 sy_product_nav.schema.json
// 代码如下
{"bsonType": "object","required": ["classname"],"permission": {"read&…
Uniapp 电子签名 包含 返回 撤回 颜色 线条等功能
请观看 使用教程
第一步 引入图标
在项目中的App.vue内添加下面代码
<style>/*引入图标路径 */import uni_modules/TC-qianming/libs/css/iconfont.css;
</style> 第二步 引入组件即可
<template><view><TC-qianming></TC-qianming>&l…
uniapp小程序中的登录完整代码（兼容小程序和app）
前言 伴随着互联网的快速发展，移动端应用领域也发生了翻天覆地的变化，随之而来的是各式各样的APP应用程序、轻应用、小程序等项目产品，人们的移动生活也变得更加丰富多彩！本文旨在帮助快速构建uniapp登录页面，仅提供参考价值。喜欢帮忙一键三联，谢谢！
正文
效果如下：…
uniapp vue3.0+TS 上传单张或多张图片，并且能删除和预览。
一、uniapp vue3.0TS 上传单张或多张图片，并且能删除和预览。
效果：人菜话不多 先上效果：
二、代码
1.HTML 上传图片相关代码
代码如下：
<template><view class"images_box"><view class"img…
如何使用uview中的loadmore上拉加载
普通用法 HTML
<view><view><!-- 内容 --></view><u-loadmore :status"status" />
</view>
JS，onReachBottom这个是生命周期，和method同级
data() {return {goods:null,status: loadmore,//当前状态p…
uni-app--》基于小程序开发的电商平台项目实战（七）完结篇
🏍️作者简介：大家好，我是亦世凡华、渴望知识储备自己的一名在校大学生 🛵个人主页：亦世凡华、 🛺系列专栏：uni-app 🚲座右铭：人生亦可燃烧，亦可腐败…
uni-app小程序使用DCloud（插件市场）流程
一、DCloud（插件市场）
DCloud 是uni-app官方插件市场，里面有官方、团队、个人发布的众多插件，包括uni-ui、uni-pay 等。而像uni-ui这种大型组件库都有官方文档可参考，但一些团队或个人发布的小型插件没有文档…
华为荣耀手机，开启开发者选项，hbuilder调试依然找不到
我的手机是华为荣耀50，其他华为手机不知道是不是这个问题哦 解决办法：usb配置，选择音频来源 然后就可以了
ifndef是什么，如何使用？
引言
使用HbuilderX uni-ui模板创建的uni-app项目，main.js文件中看到有如下的注释：
// #ifndef VUE3
......
// #endif
// #ifdef VUE3
......
// #endif 相信很多没有uini-app项目开发经验的朋友，初次接触uni-app项目，可…
uniapp 仿喜茶小程序前端模板（支持小程序、网页、app）
uniapp仿喜茶小程序前端模板
兼容：网页、app、小程序
部分截图 部分代码
<template><view class""><uy-swiper :list"slideshowList" :height"275" :isIndicatorLight"false"></uy-swiper><…
办鹿uniapp小程序（一）
一、项目初始化 1. appid 》 公司给你 wxc82730a0fc15e28a 2. 开发者身份 》 公司给你添加 小程序官网：小程序 管理》成员管理》项目成员 1、 uniapp ui组件 （uView） 如果采用npm安装方式在 小程序端不生效
1.1 采用插件的形式安装…
Uniapp软件库源码 全新带勋章功能(包含前后端源码)
Uniapp软件库全新带勋章功能，搭建好后台
在前端找到 util 这个文件 把两个js文件上面的填上自己的域名，
电脑需要下载：HBuilderX 登录账号 没有账号就注册账号，然后上传文件，打包选择 “发行” 可以打包app h5等等。…
【RuoYi移动端】uni-app中的单击和双击事件
1、单击事件： click"enterpriseSelect" 2、双击事件： touchend"userinfo"
uniapp canvas 无法获取 webgl context 的问题解决
uniapp canvas 无法获取 webgl context 的问题解决
一、问题描述
在 uniapp 中做一个查看监控视频的页面，用到的是 JSMpeg 这个库，原理就是前后台通过 websocket 不断推送新画面内容到前端，前端通过这个 JSMpeg 渲染到前端页面中指定的 can…
uniapp水果海鲜生鲜商城系统小程序H5源码APP 同城配送、自提、拼单、多门店商城
外卖多门店小程序开源版开发 能够更好的适用于瑜伽馆、健身房、美容美发店、鲜花店、水果店、宠物店、母婴店、教育培训机构，送奶站、送水站，足疗按摩店、儿童摄影馆、上门服务（如：家政、维修）、无人售货超市、新零售会…
2023 uniapp( vue3)使用canvas生成海报并保存，taro/微信小程序也适用
有段时间没写vue了，有点生疏了......
1、代码有注释，完整代码如下
<template><view class"page"><canvas class"canvas" v-if"isShow" :style"{width:${canvasWidth}px,height:${canvasHeight}px}&…
【uniapp】小程序开发7：自定义组件、自动注册组件
一、自定义轮播图组件、自动注册
以首页轮播图组件为例。
1、创建组件文件src/components/my-swipper.vue
代码如下：
<template><view><view class"uni-margin-wrap"><swiper class"swiper" circular :indicator-dots…
uni-app中tab选项卡的实现效果 @click=“clickTab（‘sell‘）“事件可传参数
一、效果图 二、代码
<template><view><view class"choose-tab"><view class"choose-tab-item" :class"chooseTab 0 ? active : " data-choose"0" click"clickTab">选项1</view><view …
uniapp开发小程序—根据生日日期计算年龄 周岁
0、需求
在UniApp开发小程序中，将接口返回的出生日期转化为年龄；判断接口返回的年龄是否是周岁
可以使用JavaScript的日期处理方法来实现。
一、第一种方式（示例代码）：
//javascript
// 假设接口返回的年龄为生日的…
【uniapp+云函数调用】人脸识别，实人认证，适用于app，具体思路解析，已实现
2023.10.8 需求： uniapp开发的app项目中使用人脸识别 app项目都是第一次搞，更别提人脸识别了。目前已有的就是Dcloud账号已申请，实现需求的时间没那么紧迫 此篇会详细记录从0到1的过程 2023.10.24 今天开始探究实现的过程 可能会记录的有些冗余 效果图如下： uniapp开发指南…
uniapp开发app，在ios真机上出现的css样式问题
比如下面的问题，在iphone 13上出现，在iphone xR上正常。
问题一：border:1rpx造成边框显示不全
在iphone13上border边框有一部分不显示： 在iphone xR上显示正常： 解决办法是：
将border边框设置中的1rpx改…
【uniapp】短信验证码输入框
需求是短信验证码需要格子输入框 如图 网上找了一个案例改吧改吧 直接上代码 结构 <template><view class"verify-code"><!-- 输入框 --><input id"input" :value"code" class"input" :focus"isFocus"…
uniapp app获取keystore等一系列常用数据
https://blog.csdn.net/deepdfhy/article/details/88698492 参考文章
一、获取安卓证书keystore的SHA1和SHA256值 参数上面引用链接 window r :
$ cmd
$ D: 进入D盘
$ keytool -genkey -alias testalias -keyalg RSA -keysize 2048 -validity 36500 -keystore 项目名称.ke…
uniapp 自定义tabbar页面不刷新
最近在做自定义tabbar时，每次切换页面都要刷新，页面渲染很慢，需要实现切换页面不刷新问题。
结局思路，原生的tabbar切换页面时就不选新，用switchTab来跳转
1.pages.json中配置tabbar，如下,设置高度为0&am…
uniapp进行条件编译的两种方法
在UniApp中，进行条件编译有两种方法：使用process.env全局变量和使用条件注释。 1.使用process.env全局变量：UniApp支持根据不同的环境变量来进行条件编译。可以通过在代码中使用process.env来判断当前环境并执行相应的逻辑。
if(process.env…
uni-app：多种方法写入图片路径
一、文件在前端文件夹中 1、相对路径引用
从当前文件所在位置开始寻找图片文件的路径。../../ 表示返回两级目录，即从当前文件所在的 wind.vue 所在的位置开始向上回退两级。接着，进入 static 目录，再进入 look 目录，最后定位到 …
van-uploader上传图片报错Invalid handler for event “load“(在uniapp编译)
van-uploader使用报错
原因：主要原因这里使用的vant版本是2.13.0的，在Hbuild里面运行的项目，vant插件在这里会有部分组件有兼容问题，（van-image，van-uploader等）。
解决：主要是要实…
前端uniapp下载保存到手机相册，注意：下载图片路径必须是接口返回
目录 htmlJS最后 html
<view class"down-image"click"getCodeDownImg"><image src"/static/index/index-drop-down.png" mode"aspectFill"></image>
</view>JS
data(){
//必须是接口返回的路径，…
记录uniapp 高度铺满全屏的小技巧（不用去设置position: fixed定位）
在uniapp中，高度使用heiht:100vh,h5的屏幕会多出一些高度，导致可以上下滑动
解决方案:
步骤一>在app.vue中设置一个公共样式 uni-page-body,html,body{ height: 100%; }步骤二>在需要高度铺满全屏的页面的最外层的view绑定类名page，…
如何在 uniapp 里面使用 pinia 数据持久化 (pinia-plugin-persistedstate)
想要在 uniapp 里面使用 pinia-plugin-persistedstate 会遇到的问题就是 uniapp里面没有浏览器里面的 sessionStorage localStorage 这些 api。 我们只需要替换掉 pinia-plugin-persistedstate 默认的储存 api 就可以了。使用 createPersistedState 重新创建一个实例, 把里面的…
uniapp 运行项目在 Android 模拟器中
在开发App时，无论是使用 Flutter 还是 React native，还是使用uni-app 开发跨端App时，总是需要运行调试。一般调试分为两种。 第一：真机调试 第二：模拟器调试 真机调试的好处是可以看到更好的效果，缺点就是…
uni-app——如何阻止事件冒泡
引言
在开发移动应用程序时，我们经常需要处理用户交互事件。然而，有时候这些事件会冒泡，导致意外的行为和不良用户体验。在本文中，我们将探讨如何使用UniApp框架来阻止事件冒泡，并提供一些示例代码来帮助您理解如何实…
uniapp接口请求api封装，规范化调用
封装规范和vue中的差不多，都是统一封装成一个request对象，然后在api.js里面调用。
先创建一个utils文件夹，然后里面创建一个request.js，代码如下：
export const baseURL 基础url地址const request (options) > …
uni-app打包apk实现自动更新
一、直接复制粘贴就可用(豪横) app.vue文件里写 //app.vue里写
<script>export default {onShow: function() {console.log(App Show)},onHide: function() {console.log(App Hide)},onLaunch: function() {let appVersion uni.getSystemInfo({success: function(e) {ap…
【uniapp】富文本
1、富文本显示，只显示文字，其余html不显示 功能：红框处其实是一个富文本，有图片之类的。但是现在不想根据html显示，只显示文字。 直接上代码
//内容显示
<view>{{item.fhArticleVo.content}}</view>
// …
uniapp新建的vuecli项目启动报错并且打包失败的问题（已解决）
我的项目新建流程如下 运行之后就是如下报错 解决办法：
安装如下依赖： npm i postcss-loader autoprefixer8.0.0 npm run build 编译失败 安装如下依赖： npm install postcss8.2.2 最终package.json文件如下
{"name": "ls…
微信小程序实现同一页面左右滑动无限切换上/下一页结合后端请求数据，带滑动动画
🤵 作者：coderYYY 🧑 个人简介：前端程序媛，目前主攻web前端，后端辅助，其他技术知识也会偶尔分享🍀欢迎和我一起交流！🚀（评论和私信一般会回！！） 👉 个人专栏推荐：《前端项目教程以及代码》 💎 本文摘要：原生微信小程序（uniapp同理）实现详情页左右滑动…
uniapp原生插件之安卓客户端之间wifi文件传输
插件介绍
安卓客户端之间文件传输，支持大文件传输，Wifi/热点文件传输，轻松传送1G文件
插件地址
安卓客户端之间wifi文件传输 - DCloud 插件市场
超级福利
uniapp 插件购买超级福利
使用文档
详细使用文档
示例文件
百度网盘链接&a…
uniapp 编译到模拟器（mumu）
一开始我是用逍遥模拟器，但这个玩意突然不好使了，一直加载卡在这页面
1、下载 官网下载：mumu模拟器12 2、打开mumu多开器，在右上角adb查看端口号 3、打开mumu模拟器
4、打开HBuiderX 工具—设置—运行配置 5、配置电脑的系统…
Uniapp中嵌入H5（ uniapp开发的H5），并且在H5中跳转到APP的指定页面
原生H5跳转uniapp开发的app方式：
1.在APP中使用web-view嵌入H5页面使用web-view组件实现
<template><view><web-view src"https://uniapp.dcloud.net.cn/component/web-view.html"></web-view></view>
</template>…
uniapp 在 Android Studio 模拟器中运行项目
在开发App时，无论是使用 Flutter 还是 React native，还是使用uni-app 开发跨端App时，总是需要运行调试。一般调试分为两种。 第一：真机调试 第二：模拟器调试 真机调试的好处是可以看到更好的效果，缺点就是…
uniapp vue2、vue3 页面模板代码块设置
本文分享 uniapp vue2、vue3 页面模板代码块设置
设置路径
HBuilder X -> 工具 -> 代码块设置 -> vue代码块 -> 自定义代码块
如上图操作后在打开的 vue.json 文件的右侧“自定义代码块”中复制如下代码（可全选替换也可添加到代码中）
示…
uniapp 将流转化为视频并播放 微信小程序
该问题最关键的一步是将后端传回来的流，转化成视频，并播放。
1、从服务器请求数据流到前端
2、新建一个临时文件，将数据流写入这个文件里面，并自定义路径命名。 const fs wx.getFileSystemManager(); //获取全局唯一的文件管理…
uniapp实现公众号微信登录
前端代码
data() {return {openid: "",server: ,code:};
},
mounted() {this.getCode()
},
methods:{getCode() {// 非静默授权，第一次有弹框this.code ;var callback_url 回调地址; // 获取页面urlvar appid APPID;this.code this.getUrlCode().cod…
uniapp表单验证
以下是一个简单的uniapp表单验证示例：
<template><view class"uni-form"><view class"uni-form-item"><view class"uni-form-label">用户名</view><input type"text" v-model"user…
uniapp获取地理位置的API是什么？
UniApp获取地理位置的API是uni.getLocation。它的作用是获取用户的当前地理位置信息，包括经纬度、速度、高度等。通过该API，开发者能够实现基于地理位置的功能，如显示用户所在位置附近的商家、导航服务、天气查询等。
以下是一个示例&#x…
uniapp项目APP端安卓ios权限检测教程
导语：在 APP 的日常开发过程中，权限检测与授权是不可避免的一项重要的功能，下面就简单介绍一下如何检测和授权的方法。 目录 原理方法实战原理
此授权方法主要是依托于 HTML5 产业联盟的HTML5+规范实现的。
HTML5 产业联盟官网
获取当前操作系统名称
可以使用uni.getSys…
uniapp 模仿 Android的Menu菜单栏
下面这张图就是我们要模拟的菜单功能 一、模拟的逻辑 1. 我们使用uni-popup组件（记得要用hbuilder X导入该组件）uni-app官网 2. 将组件内的菜单自定义样式 二、uniapp代码 写法vue3
<template><view><uni-popup ref"showMenu"…
泰州市旅游景点门票预订管理系统 vue+uniapp微信小程序
本文从管理员、用户的功能要求出发，泰州市旅游景点管理小程序中的功能模块主要是实现用户、景点类型、景区信息、门票预定。经过认真细致的研究，精心准备和规划，最后测试成功，系统可以正常使用。分析功能调整与泰州市旅游景点管理…
【uniapp】uniapp实现input输入显示数字键盘：
文章目录 一、官网文档：二、文档：三、效果：【1】number：iPhone原生数字键盘不显示小数点【2】digit：【3】digit和inputmode： 一、官网文档： input | uni-app官网 二、文档： 三、效果…
uniapp组件初始化的销毁（监听隐藏事件）
onHide是监听隐藏事件onHide() {console.log("销毁");this.clearTimer();
},
onShow(){console.log("初始化");this.getOrderInfo()
},
如何完全卸载HbuilderX（全网最详细）
前序 今天本来想发行打包安卓端，结果发现突然就不行了(前天还行)报错 排查 然后我找了各种原因，排查了很久才发现是HbuilderX编辑器的问题，机智如我所以我们需要重新去下载一个HbuilderX，但是问题来了，很多人不知道怎么卸载，我自己网上也百度了很久没有正确简单的方法，直…
uniapp tabBar页面跳转到其他页面时标签栏出现返回按钮但无法返回问题
当tabBar页进入其他页面时返回按钮点击会强制退出小程序
使用uni.reLaunch进行跳转(关闭所有页面，打开到应用内的某个页面)在跳转到页面中使用uni-nav-bar自定义返回方法
uni.reLaunch({url:/pages/home1/home1/home1
})<uni-nav-bar dark :fixed"true&qu…
uniapp如何使用mumu模拟器
模拟器安装 下载地址：MuMu模拟器 模拟器相关设置 1.在设置-显示中选中手机版，设置手机分辨率 2.设置-关于手机-版本号快速点击，将其设置为开发者模式 3.选择多开器 4.打开hbuilderx，找到adb设置 5.配置adb路径及端口号&#x…
在uni-app中使用ECharts - 配置四种不同的图表
👨🦰博主：小猫娃来啦 👨🦰文章核心：在uni-app中使用ECharts - 配置四种不同的图表 文章目录 前言安装ECharts插件引入ECharts库创建Charts实例和图表容器配置和渲染图表配置柱状图配置折线图配置饼图配…
黑马 小兔鲜儿 uniapp 小程序开发- 微信登录用户模块- 06-07
黑马 小兔鲜儿 uniapp 小程序开发- 商品详情模块- day05-CSDN博客
小兔鲜儿 - 微信登录-06
涉及知识点：微信授权登录，文件上传，Store 状态管理等。
微信登录
微信小程序的开放能力，允许开发者获取微信用户的基本信息ÿ…
uniapp 实现一个刷新转圈功能
功能展示
最近在uniapp 上实现了一个刷新的小功能，这个功能在提高人机交互方面有不错的体验，有需要自提。先来看一下效果： 动画效果
一、代码如下 <view styleflex:1 text-align: right; click"refresh()"><img :ani…
uniapp leven系列原生插件（3）
目录 21.安卓友盟消息推送原生插件
插件介绍
插件地址
使用文档
预览图片
22.安卓音频操作原生插件
插件介绍
插件地址
使用文档
预览图片
23.安卓系统操作原生插件
插件介绍
插件地址
使用文档
预览图片
24.安卓虹软人脸识别原生插件
插件介绍
插件地址
使用…
uniapp原生插件之乐橙摄像机播放插件(云台对讲版)
插件介绍
乐橙摄像机播放插件(云台对讲版)，集成视频播放，对讲模式、云台控制
插件地址
乐橙摄像机播放插件(云台对讲版) - DCloud 插件市场
超级福利
uniapp 插件购买超级福利
插件申请权限
麦克风权限（可参考示例项目）网…
uniapp页面间传参的方法
在uniapp中，常见的页面传参方式有以下几种：
URL传参
可以在跳转页面时，在url中添加参数，通过在目标页面的onLoad函数中的options参数获取传递的参数。示例代码如下：
在源页面中：
uni.navigateTo({url: …
uniapp 省市区三级联动选择器
还有半个小时下班，总想着发点光亮照耀他人。IT技术这东西，尤其是UI方面的东西，于用户体验至关重要，想想最近使用uni-data-picker的丑陋页面，自己重构了这个功能，新加实现，效果图如下，…
uni-starter 使用常见问题
1. Invalid uni-id config file 没有找到uni-id文件导致
需要在uniCloud-aliyun/cloudfunctions/common/uni-config-center/uni-id/下新建 config.json
如果没有uni-id 就新建一个。
注意：config.json是一个标准json文件，不支持注释 uni-starter 按照…
【uniapp+vue3】scroll-view实现纵向自动滚动及swiper实现纵向自动滚动
scroll-view本身不支持自动滚动，通过scroll-top属性控制滚动，但是不可以循环滚动 <scroll-view class"notice-bar" scroll-y"true" ref"scrollViewRef" :scroll-top"data.scrollViewTop"scroll-with-animati…
基于Java+SpringBoot+Vue+Uniapp小程序前后端分离租房管理系统设计与实现(支持支付宝支付、有需求解析文档50页、演示视频)
博主介绍：✌全网粉丝5W，全栈开发工程师，从事多年软件开发，在大厂呆过。持有软件中级、六级等证书。可提供微服务项目搭建与毕业项目实战，博主也曾写过优秀论文，查重率极低，在这方面有丰富的经验…
uniapp实现路线规划
UniApp是一个基于Vue.js框架开发的跨平台应用开发框架，可以同时构建iOS、Android、H5等多个平台的应用。它使用了基于前端技术栈的Web开发方式，通过编写一套代码，即可在不同平台上运行和发布应用。
UniApp具有以下特点： 跨平台开…
uniapp 开发微信小程序 v-bind给子组件传递函数，该函数中的this不是父组件的二是子组件的this
解决办法：子组件通过缓存子组件this然后，用bind改写this 这个方法因为定义了全局变量that 那么该变量就只能用一次，不然会有赋值覆盖的情况。
要么就弃用v-bind传入函数,改为emit传入自定义事件 [uniapp] uview(1.x) 二次封装u-navbar 导致…
手写一个uniapp的步骤条组件
在template实现
<template><view class"process_more"><!-- 步骤条 --><view class"set-2" :key"index" v-for"(item,index) in options"><!-- 图片 --><view class"img-border"><…
uniapp 查看安卓第三方插件抛出的异常
0.安装好andriod studio 和hbuilder 1.配置环境变量 鼠标右键此电脑-》设置》关于》高级系统设置》环境变量》系统变量》path中加入 具体的hbuildr adb目录看个人 2.在cmd中输入命令adb version 查看是否配置成功 出现版本号就是配置成功了 3.去hbuilder中，导航栏…
uni-app小程序使用vant
步骤一：安装 Vant Weapp
# 通过 npm 安装
npm i vant/weapp -S --production# 通过 yarn 安装
yarn add vant/weapp --production# 安装 0.x 版本
npm i vant-weapp -S --production步骤二：在根目录下创建“wxcomponents”文件夹
步骤三：找…
uniapp app端选取（上传）多种类型文件
这里仅记录本人一些遇到办法，后台需要file对象，而App端运行在jsCore内，并非浏览器环境，并没有File类，基本返回的都是blob路径，uni-file-picker得app端只支持图片和视频，我这边需求是音视频都要支…
【uniapp】自定义步骤条样式实现
效果图 实现
<!-- 步骤条 -->
<view class"progress-wrap"><view class"progress-box"><view :class"active > 0 ? active-number : normal-number">1</view><view :class"[normal-desc, active >…
uniapp开发小程序接入阿里云TTS语音合成（RESTful API）
流程
首先小程序后台配置白名单 1.1 路径：开发-开发管理-开发设置-服务器域名-request合法域名 1.2 request合法域名参数： https://nls-meta.cn-shanghai.aliyuncs.com https://nls-gateway-cn-shanghai.aliyuncs.com引入alitts.js页面使用…
使用vscode开发uniapp项目常用的辅助插件，提升开发效率
为什么不使用hbuilder开发呢？因为hbuilder对ts和vue3语法支持并不友好，而且代码提示不智能，也不能使用最近很流行的coplit和CodeGeex智能提示，所以就换掉hbulider，使用我们熟悉的vscode开发吧。
第一个：un…
【开题报告】基于uniapp的在线考试小程序的设计与实现
1.研究背景
随着社会的发展和科技的进步，网络技术被广泛应用于教育领域。在线教育已成为当今发展趋势之一，其中在线考试更是具有重要的意义。传统的考试方式不仅耗费大量人力物力，而且存在考试成果的保密问题。而在线考试可以使考试过程更加…
uniapp小程序授权统一处理
1.使用
1.将工具代码引入到utils中
const authorize (scope, isOne false, isMust false) > {if (!scope || !authorizeObj[scope]) {return console.error(请传输需要获取权限的 scope，详见,https://uniapp.dcloud.net.cn/api/other/authorize.html#scope-…
UNI-APP中如何通过配置访问代理，解决跨域问题
主要思路
通过配置manifest.json文件中的h5选项来完成设置h5是一级属性。
修改manifest.json文件
以下两种都能满足要求
"h5" : {"devServer" : {"https" : false,"port" : 8081,//见备注1"disableHostCheck" : true,&q…
UNI-APP_ios自动适应底部安全区背景，修改安全区背景
自动适应（推荐）
将所有 iPhone X（刘海屏) 底部安全区域背景颜色 自动适应，当前页面什么颜色会自动调整。
1.打开 manifest.json ，打开源码视图 2.找到 app-plus 配置项，添加以下代码
"safearea&quo…
uniapp跳转方式
UniApp 是一个基于 Vue.js 的跨平台开发框架，可以同时构建 iOS、Android、H5 和小程序等多个平台的应用。在 UniApp 中，我们可以使用以下几种方式进行页面之间的跳转：
使用 uni.navigateTo 方法：该方法可以在当前页面打开新的页面…
uni-app----图片点击放大功能点击文本进行复制功能【安卓app端】
uni-app----图片点击放大功能&&点击文本进行复制功能【安卓app端】
1. 封装js文件
// 图片点击放大效果
export function getimgPreview(imgList) {uni.previewImage({indicator: "number",loop: true,urls: imgList})
}// 复制文本
export function setCl…
uniapp原生插件之安卓圆角组件原生插件
插件介绍
安卓圆角组件原生插件可以解决nvue下圆角不生效和严重锯齿
插件地址
安卓圆角组件原生插件 - DCloud 插件市场
超级福利
uniapp 插件购买超级福利
详细使用文档
uniapp 安卓圆角组件原生插件
用法
在需要使用插件的页面加载以下代码
<leven-radius ref&q…
❤ Uniapp使用 ( 三 配置和各种使用篇)
❤ Uniapp使用 ( 三 配置和各种使用篇)
1、 uniapp引入 vant
引入方式 1、下载vant源码 方式一：从 Vant 官网首页进入 GitHub下载对应版本的压缩包,将文件解压后备用,确保下载的压缩包里有dist 文件夹
2、创建 uniapp 项目,在根目录下新建 一个文件夹wxcomponent…
jeecg-uniapp 转成小程序的过程 以及报错 uniapp点击事件
uniapp 点击事件
tap: 单击事件
confirm: 回车事件
blur:失去焦点事件
touchstart: 触摸开始事件
touchmove: 触摸移动事件。
touchend: 触摸结束事件。
longpress: 长按事件。
input: 输入框内容变化事件。
change: 表单元素值变化事件。
submit: 表单提交事件。
scroll: 滚动…
uniapp 解决H5跨域的问题
uniapp 解决h5跨域问题 manifest.json
manifest.json文件中，点击“源码视图”,在此对象的最后添加以下代码：
"h5" : {"devServer" : {"port" : 8080, //端口号"disableHostCheck" : true,"proxy" :…
uni-app的tabBar用法(自动、点击刷新页面，loading加载框)
一.先在package.json中配置tabBar（前置条件）
tabBar所跳转的页面应事先在page中创建好！如下配置后app下方会有可点击的tabBar按钮，在list中设置按钮的个数。 图1 tabBar的list属性 text：tabBar按钮的名称 pagePath&am…
基于.NET、Uni-App开发支持多平台的小程序商城系统 - CoreShop
前言
小程序商城系统是当前备受追捧的开发领域，它可以为用户提供一个更加便捷、流畅、直观的购物体验，无需下载和安装，随时随地轻松使用。今天给大家推荐一个基于.NET、Uni-App开发支持多平台的小程序商城系统（该商城系统完整开源…
使用 uni-app 开发项目，日期和时间如何格式化？
功能需求描述
在开发项目时，往往需要对从后端查询到的时间进行格式化，查到的时间格式一般都是时间戳，一堆数字，这时候怎么转化成类似于 2023年8月15日 08:12:10 这样的格式？
在组件显示格式化后的日期
其实 uni-app…
UNI-APP_获取手机品牌
在uni-app中，使用uni.getSystemInfoSync().brand可以获取设备的品牌信息。根据不同设备的品牌，uni.getSystemInfoSync().brand可能返回以下一些常见值 “Apple” - 苹果 “Samsung” - 三星 “Huawei” - 华为 “Xiaomi” - 小米 “OPPO” - OPPO “Vivo…
7.基于SpringBoot3+Security6+JWT实现鉴权机制(一)
1. JWT简介
为什么要说下呢，JWT三部分组成，就要刚刚笔者参加的2023下半年系统架构师考试中考到了，然后我竟然想不起来了。。。
JWT（JSON Web Token）由三个部分组成，它们分别是头部（header）、载荷（payload）和签名（signature）。 头部（Header）：JWT的头部是一个包…
uni-app android picker选择默认月份
微信小程序选中月份后下次再点开是上次的选中的月份，而编译的android应用只默认当前月份
<picker mode"date" ref"picker" :disabled"disabled" :value"date" fields"month" change"bindDateChange&quo…
Uniapp实现多语言切换
前言
之前做项目过程中，也做过一次多语言切换，大致思想都是一样的，想了解的可以看下之前的文章C#WinForm实现多语言切换
使用i18n插件
安装插件
npm install vue-i18n --saveMain.js配置
// 引入 多语言包
import VueI18n from vue-i18n…
uniapp使用技巧及例子
前言 uniapp（Universal Application）是一种基于Vue.js的全端解决方案，允许开发者使用一套代码构建多个平台的应用程序。这些平台包括iOS、Android、H5、微信小程序、支付宝小程序等。uniapp的出现解决了跨平台开发的痛点，大大减少…
uniapp中APP端使用echarts用formatter设置y轴保留2位小数点不生效
uniapp使用echarts，在内置浏览器中，设置保留2位小数能正常显示（代码如下），但是在APP端这个设置不起作用。
yAxis: {type: value,axisLabel: {formatter: function (val) {return val.toFixed(2); //y轴始终保留小数点…
uniapp自定义tab切换css样式、uni-forms中input下拉等标签字体、过宽、溢出样式一系列调整(附加实战举例)
一、uniapp自定义tab切换css样式 <view class="tabs-container"><view class="tabs-list">
uniapp原生插件之安卓虹软人脸识别原生插件
插件介绍
虹软人脸识别支持图片人脸识别（可识别网络图片），活体检测，离线识别，相机预览旋转，相机人脸识别，批量注册（支持网络图片）等，支持保存用户的id和名称…
uniapp 微信小程序 uni-file-picker上传图片报错 chooseAndUploadFile
这个问题真的很搞， 原因是微信开发者工具更新了，导致图片上传问题。
解决方法： 将微信开发者工具的基础库改为2.33.0一下即可。 在微信开发者工具详情 - 本地设置中（记得点击‘推送’按钮）：
【uniapp】swiper组件touch事件和click兼容问题
如果swiper组件加了touch事件和click事件都加了，会触发的很不灵敏，有时候click事件不触发 案例 这种情况click偶尔会失效
<template>
<swiper touchstart"touchStart" touchcancel"touchEnd" touchend"touchEnd"…
【有源码】基于uniapp的农场管理小程序springboot基于微信小程序的农场检测系统（源码 调试 lw 开题报告ppt）
💕💕作者：计算机源码社 💕💕个人简介：本人七年开发经验，擅长Java、Python、PHP、.NET、微信小程序、爬虫、大数据等，大家有这一块的问题可以一起交流！ 💕&…
前端uniapp请求真是案例（带源码）
目录 案例一案例二最后 案例一
<template><view class"box"><!-- <view class"title-back" click"backPrivious"><</view> --><!-- <view class"title-back" click"backPrivious"…
uniapp+uview2.0+vuex实现自定义tabbar组件
效果图
1.在components文件夹中新建MyTabbar组件 2.组件代码
<template><view class"myTabbarBox" :style"{ backgroundColor: backgroundColor }"><u-tabbar :placeholder"true" zIndex"0" :value"MyTabbarS…
【微信小程序】新版获取手机号码实现一键登录（uniapp语法）(完整版附源码)
需求
如图，点击按钮，获取用户手机号实现一键登录，当然，用户也可以自行输入其他手机号进行登录
问题
要想获取用户手机号并不复杂，但由于近几年微信小程序获取手机号的api进行了更新，当前很多帖子使用的…
uni-app 、Spring Boot 、ant Design 打造的一款跨平台包含小说（仿真翻页、段落听书）、短视频、壁纸等功能含完备后台管理的移动应用
简介
咪哩快看，为用户提供优质阅读，短视频，共同记录美好生活的移动应用，并含有一套完备的后台管理体系，助力开发者快速数字化，开启你的财富之门！
官网： https://miliqkdoc.motopa.…
基于UNI-APP实现适配器并保证适配器和实现的调用一致
概述
前端功能的实现是基于不同的环境采用不同的实现方式的。一种是企业微信小程序，需要基于企业微信框架实现。一种是移动APP，需要基于uni-app的中底层实现。为了调用方便，需要将两种实现统一在一种适配器中，调用者只需要指定环…
【uniapp小程序下载】调用uni.uploadfile方法在调试工具里是没有问题的，但是线上版本和体验版就调用不成功，真机调试也没问题
把你的下载地址前缀添加到合法域名就解决了 在调试工具里成功了是因为勾选了下面这项 下面是我的下载并打开函数
methods: {// 下载downloadFileFn(data) {if (this.detailsObj.currentUserBuy) {uni.downloadFile({// data是路径url: https:// data,success(res) {//保存到本…
uniapp u-tabs表单如何默认选中
首先先了解该组件；该组件，是一个tabs标签组件，在标签多的时候，可以配置为左右滑动，标签少的时候，可以禁止滑动。 该组件的一个特点是配置为滚动模式时，激活的tab会自动移动到组件的中间位置。
…
uniapp小程序接入腾讯云【增强版人脸核身接入】
文档地址：https://cloud.tencent.com/document/product/1007/56812 企业申请注册这边就不介绍了，根据官方文档去申请注册。 申请成功后，下载【微信小程序sdk】
一、解压sdk，创建wxcomponents文件夹
sdk解压后发现是原生小程序代…
vue3.2中style使用v-bind
vue3.2中style使用v-bind
自我记录
这个功能真的是 太 NB 了！！！！ 官网地址：https://cn.vuejs.org/api/sfc-css-features.html#v-bind-in-css
Uniapp语言切换动态修改Js文件
前言
续接上面两篇文章，第一篇文章是uniapp实现多语言切换，第二篇文章是i8n在js中的使用，由于我的菜单是在js文件中，所以我切换的时候除了菜单不实现效果，别的页面都可以实现，本篇文章主要是针对于怎么动态…
uni-app：js实现数组中的相关处理-数组复制
一、slice方法-浅拷贝
使用分析 创建一个原数组的浅拷贝，对新数组的修改不会影响到原数组slice() 方法创建了一个原数组的浅拷贝，这意味着新数组和原数组中的对象引用是相同的。因此，当你修改新数组中的对象时，原数组中相应位置的…
在uniapp和微信小程序中onshow和onload的区别
在uni-app框架中，是两个页面级别的生命周期函数
onLoad：页面加载时调用，可以获取参数，通过options，但是只调用一次，onLoad"适合进行页面初始化操作”
onshow： "onShow"生命周期…
uniapp da-tree插件 代码和结构分析
传送门：da-tree 树组件（支持单选、多选、无限级、主题色，Vue3版）
changelog.md 版本号版本更新内容readme.md 概述、使用（导入方式）、demo、传参、事件、实例方法、平台差异化、开发人员信息、注意风险项&…
【uniapp】六格验证码输入框实现
效果图 代码实现
<view><view class"tips">已发送验证码至<text class"tips-phone">{{ phoneNumber }}</text></view><view class"code-input-wrap"><input class"code-input" v-model"…
uni-app学习笔记（二）
目录
一、路由与页面跳转
1、tabar与普通页面跳转例子
2、navigateTo
3、switchTab
二、vue组件
1、传统vue组件的使用
2、easycom
三、uView组件库
1、安装配置
2、引入配置
3、使用
四、Vuex
1、认识
2、state基本使用
3、mapState使用
五、网络请求
1、封装…
uniApp页面通讯
Uniapp 是一款基于 Vue.js 开发的框架，它可以用来开发多端应用，包括微信小程序、H5、APP 等。在 Uniapp 中，页面通讯分为三种方式：事件总线、Vuex 和 uni.$emit。 事件总线（EventBus）：事件总线是…
uniapp+uviewPlus+vue3+ts+pinia+vite+echarts 开发基础模板，开箱即用，非常顺手
github仓库地址：https://github.com/Sjj1024/uniapp-vue3
使用 uniapp vue3 ts pinia vite echarts 开发基础模板，拿来即可使用，不要删除 yarn.lock 文件，否则会启动报错，这个可能和 pinia 的版本有关࿰…
uniapp循环对象列表---点击列表切换选中不同状态
目录 源码图片最后 源码
<template><view><ul><li v-for"(item, index) in list" click"toggleSelection(index)" :class"{selected: selectedIndex index}">{{ item }}<view :class"{selected: selectedInde…
uniapp 子组件内使用定时器无法清除
涉及到的知识点：1.ref绑定在组建上获取组件实例。2.emit逆向传值，不需要点击触发，watch监听即可。
需求：在父页面的子组件定时发送请求，离开父页面就停止，再次进入就开启。
问题：在父页面的子…
uniapp移动端实现上拉加载（分页），下拉刷新
上拉加载
在需要实现该功能的页面写入 onReachBottom（）方法函数，该方法与 onLoad() 方法同级，需在在data中声明 pageNo和pageSize以及总条数，具体代码如下：
html 部分
<-- html部分 引入uview 使用u…
uni-app 应对微信小程序最新隐私协议接口要求的处理方法
这里给大家分享我在网上总结出来的一些知识，希望对大家有所帮助 一，问题起因 最新在开发小程序的时候，调用微信小程序来获取用户信息的时候经常报错一个问题 fail api scope is not declared in the privacy agreement，api更具公告…
uniapp找到数组对象所在下标再删除
数组对象名tool_list
var arrindex_this.tool_list.findIndex((item)>item.url/pagesA/citypartner/bind);
_this.tool_list.splice(arrindex,1);
基于Java+SpringBoot+Vue3+Uniapp+TypeScript(有视频教程)前后端分离健身预约系统设计与实现
博主介绍：✌全网粉丝5W，全栈开发工程师，从事多年软件开发，在大厂呆过。持有软件中级、六级等证书。可提供微服务项目搭建与毕业项目实战，博主也曾写过优秀论文，查重率极低，在这方面有丰富的经验…
移动端路径传参以数字的形式，写死的情况
页面1
async getListTransferAndApprova() {
//把mark值拼接到路径的后面，定义一个变量，使得切换穿的mark都不一样let mark ;if (this.tabsCurrent 0) {mark 2;} else if (this.tabsCurrent 1) {mark 3;}else if (this.tabsCurrent 2) {mark 4;}…
uniapp小程序定位；解决调试可以，发布不行的问题
遇见这个问题；一般情况就两种 1、域名配置问题； 2、隐私协议问题 当然，如果你的微信小程序定位接口没开启；定位也会有问题； 第一种，小程序一般是腾讯地图；所以一般都会用https://apis.map.qq.co…
uniapp的/绝对定位/相对定位/固定定位/粘滞定位
【[html5]你还分不清楚绝对定位和相对定位......】 相对定位一般配合绝对定位使用 <template><view class"content"><view style"background-color: black;width: 100%;height: 300px;position:relative;"><view class"one"…
uniapp forEach终止循环-后续代码不在执行的办法
直接上代码（使用try catch来实现终止循环） try {this.dataList.forEach((item) > {console.log(answerResult, item.answerResult undefined);if (item.answerResult undefined) {this.modelShow truethrow new Error("breakForEach");/…
uniapp 防抖节流封装和使用
防抖(debounce)：定义一个时间，延迟n秒执行，n秒内再次调用，会重新计时，计时结束后才会再次执行
主要运用场景：
输入框实时搜索：在用户输入内容的过程中，使用防抖可以减少频繁的查询…
uniapp、小程序canvas相关
1、圆形or圆形头像
//示例
const ctx uni.createCanvasContext(myCanvas); //canvas
const round uni.upx2px(72) / 2; // 半径
const x uni.upx2px(92); //目标x轴位置
const y uni.upx2px(236); //目标y轴位置//if 图片是不是静态资源
async >
const imgSrc https:/…
uniapp 微信小程序如何实现多个item列表的分享
以下代码是某个循环里面的item <button class"cu-btn" style"background-color: transparent;padding: 0;"open-type"share" :data-tree"item.treeId" :data-project"item.projectId"v-if"typeId1 && userI…
uniapp循环列表单选框实现单选
目录 图片源码参考最后 图片 源码
参考
大佬
最后 感觉文章好的话记得点个心心和关注和收藏，有错的地方麻烦指正一下，如果需要转载,请标明出处，多谢！！！
【Vue】【uni-app】工单管理页面实现
用的是uni-app的uni-ui拓展组件实现的
功能是对工单进行一个展示，并对工单根据一些筛选条件进行搜索 目前是实现了除了日期之外的搜索功能，测试数据是下面这个tableData.js，都是我自己手写的，后端请求也稍微写了一些，…
uniapp原生插件之安卓音频操作原生插件
插件介绍
安卓音频原生插件，支持本地和网络音频播放进度监听，获取音频时长等，支持录音
插件地址
安卓音频操作原生插件，支持本地和网络音频播放进度监听等，支持录音 - DCloud 插件市场
超级福利
uniapp 插件购买超…
uniapp和vue3+ts开发小程序，使用vscode提示声明变量冲突解决办法
在uniapp中，我们可能经常会遇到需要在不用的环境中使用不同变量的场景，例如在VUE3中的小程序环境使用下面的方式导入echarts：
const echarts require(../../static/echarts.min);
如果不是小程序环境则使用下面的方式导入echartsÿ…
uniapp 本身就是一个坑，里面还有无数的小坑
uniapp 本身就是一个坑，里面还有无数的小坑
uniapp 用起来就感觉是个很无章法的框架，并且里面会有无数你意想不到的小坑，坑中套坑。
还不如 Capacitor 好用，至少它没有那么多坑，一次性就能成功。
遇到的那些坑
初始…
案例023:基于微信小程序的童装商城的设计与实现
文末获取源码 开发语言：Java 框架：SSM JDK版本：JDK1.8 数据库：mysql 5.7 开发软件：eclipse/myeclipse/idea Maven包：Maven3.5.4 小程序框架：uniapp 小程序开发软件：HBuilder X 小程序…
uniapp发行web页面在老版本浏览器打开一片空白
uniapp发行的web页面（菜单->发行->网站-PC Web或手机H5），对于一些老的浏览器（或内核），打开一片空白； 而在新版本的浏览器中打开却正常。这是因为那些版本较低的浏览器不支持ES6的语法和新…
uniapp小程序更新逻辑，按实际开发为主
小程序更新: uniapp小程序更新逻辑
uni.getUpdateManager()
方法参数说明onCheckForUpdatecallback当向小程序后台请求完新版本信息，会进行回调onUpdateReadycallback当新版本下载完成，会进行回调onUpdateFailedcallback当新版本下载失败，会…
uniapp vue2 vuex 持久化
1.vuex的使用
一、uniapp中有自带vuex插件，直接引用即可
二、在项目中新建文件夹store,在main.js中导入
在根目录下新建文件夹store,在此目录下新建index.js文件 index.js
import Vue from vueimport Vuex from vuexVue.use(Vuex)const store new Vuex.Store(…
【uniapp】仿微信通讯录列表实现
效果图 代码实现
<view class"main-container"><!-- 成员列表 --><scroll-viewclass"member-list":style"computedHeight":scroll-y"true":enable-back-to-top"true":scroll-with-animation"true"…
uniapp——项目02
分类
创建cate分支 渲染分类页面的基本结构
效果页面,包含左右两个滑动区. 利用提供的api获取当前设备的信息。用来计算窗口高度。可食用高度就是屏幕高度减去上下导航栏的高度。 最终效果:
每一个激活项都特殊背景色，又在尾部加了个红条一样的东西。 export d…
Java+Spring Cloud +UniApp +MySql智慧工地综合管理云平台源码
智慧工地围绕工程现场人、机、料、法、环及施工过程中质量、安全、进度、成本等各项数据满足工地多角色、多视角的有效监管,实现工程建设管理的降本增效. 智慧工地综合管理云平台源码，PC监管端、项目端；APP监管端、项目端、数据可视化大屏端源码…
uniapp 小程序 身份证 和人脸视频拍摄
使用前提： 已经在微信公众平台的用户隐私协议，已经选择配置“摄像头，录像”等权限 开发背景：客户需要使用带有拍摄边框的摄像头 ，微信小程序的方法无法支持，使用camera修改 身份证正反面：
<…
uniapp设置app端设置 useragent 参数，和说明
plus.navigator.setUserAgent(plus.navigator.getUserAgent() cplvfx)
参考：uniapp设置app端设置 useragent 参数-CSDN博客 plus.navigator对象说明 "navigator": {"closeSplashscreen": "function() { [native code] }","…
uni-app的下拉搜索选择组合框
🌈个人主页：前端青山 🔥系列专栏：Vue篇 🔖人终将被年少不可得之物困其一生 依旧青山,本期给大家介绍uni-app中一款可以搜索下拉选择输入框的插件 下拉搜索选择组合框
superwei-combox 组合框
uni-app中可下拉搜索选…
uniapp在IOS手机下解决时间nan-an-nan问题
废话不多说，直接上代码
if (uni.getSystemInfoSync().platform ios) {// 解决ios手机时间格式化NaN问题date date.replace(/-/g, /);}
【开题报告】基于uni-app的高校新生报道APP的设计与实现
1.选题背景和意义
随着高校规模的不断扩大和信息化技术的迅速发展，传统的高校新生报道方式已经无法满足日益增长的新生数量和信息处理的需求。传统的线下报道流程通常存在着信息收集效率低、报到流程繁琐等问题，给学生、教职工和管理人员带来了许多不便…
使用uniapp实现时钟功能
1. 介绍uniapp框架
uniapp是一个基于Vue.js开发跨平台应用的前端框架，可以将同一套代码编译成多个平台的应用程序。其优势在于开发便捷、跨平台性强，适用于开发多种类型的应用程序。
2. 创建时钟组件
在uniapp中创建时钟组件需要使用canvas来绘制时钟…
uniapp 设置重写uni-body-page样式，输入字母转大写
uniapp 设置重写uni-body-page样式，输入字母转大写
一、重写uni-body-page样式
page{
}二、输入字母转大写
input标签设置样式：
style"text-transform: uppercase;"绑定的值通过.toUpperCase()转大写
uni-app报错“本应用使用HBuilderX x.x.x 或对应的cli版本编译，而手机端SDK版本是x.x.x不匹配的版本可能造成应用异常”
uniapp开发的一个跨平台软件，在安卓模拟器上启动的时候报警告：
官方给的解释：uni-app运行环境版本和编译器版本不一致的问题 - DCloud问答 解决办法有两个
方法一：添加忽略警告的配置
项目根目录下找到 manifest.json…
【开题报告】基于SpringBoot的教资考试学习平台的设计与开发
1.选题背景
教资考试是指为了选拔和评价教师专业素质而设立的一系列考试，包括教师资格证考试、教师招聘考试等。这些考试对于教师的职业发展和晋升至关重要。然而，教资考试的内容庞杂且繁琐，学习者需要进行大量的知识积累和复习备考。
当前…
❤ Uniapp使用三( 配置和各种使用篇)
❤ Uniapp使用三( 配置和各种使用篇)
1、 uniapp引入 vant
引入方式 1、下载vant源码 方式一：从 Vant 官网首页进入 GitHub下载对应版本的压缩包,将文件解压后备用,确保下载的压缩包里有dist 文件夹
2、创建 uniapp 项目,在根目录下新建 一个文件夹wxcomponents …
淘宝客APP源码/社交电商自营商城源码/前端基于Uniapp开发
淘宝客APP源码，前端基于Uniapp开发的社交电商自营商城源码。Thinkphp的后台，不是很标准，感兴趣的可以自行研究。
商城功能
1、首页基础装修；2、丰富选品库；3、淘口令解析；4、支持京东；5、支持…
uniapp基础学习笔记01
文章目录 本博客根据黑马教程学习uniapp一、技术架构二、创建项目2.1 Hbuilder创建2.2 插件安装2.3 微信开发者工具配置与运行2.3.1 简单修改基础页面 2.4 pages.json和tabBar2.4.1 pages.json与tabBar配置2.4.2 案例 三、uniapp与原生开发的区别 本博客根据黑马教程学习uniapp…
UniApp中的数据存储与获取指南
目录 介绍
数据存储方案
1. 本地存储
2. 数据库存储
3. 网络存储
实战演练
1. 本地存储实例
2. 数据库存储实例
3. 网络存储实例
注意事项与最佳实践
结语 介绍
在移动应用开发中，数据的存储和获取是至关重要的一部分。UniApp作为一款跨平台应用开发框架…
uniapp跳转H5外部链接
不携带参数的跳转外部链接请求
<view class"yes" click"goh5">{{未完成:已完成}}</view>
this.content.contractUrl为后端传输的url地址 goh5() {if (this.content.signStatus 1) {const url this.content.contractUrluni.navigateTo({url…
uniapp Android如何打开常用系统设置页面？
uniapp Android 如何打开常用系统设置页面？ 在使用App过程时，有时候会对一些权限获取，比如打开蓝牙、打开通知栏通知等设置，我们如何快速跳转到需要的设置页面？ 文章目录 uniapp Android 如何打开常用系统设置页面&…
【uniapp/uview1.x】u-upload 在 v-for 中的使用时， before-upload 如何传参
引入： 是这样一种情况，在接口获取数据之后，是一个数组列表，循环展示后，需要在每条数据中都要有图片上传，互不干扰。 分析： uview 官网中有说明，before-upload 是不加括号的ÿ…
uniapp地图手动控制地图scale
前言
首次使用uniapp开发地图过程中，发现uniapp地图居然没有提供手动控制地图scale的方法，这个也着实没有想到，查了半天资料，也终于找到一个方法能够比较好的控制scale，做个记录。
代码
要定义一个地图mapÿ…
uniapp打包安卓app获取包名
uniapp打包安卓app获取包名的两种方式
1.uniapp云打包 这上面直接可以看到包名，可以修改，也可以在 manifest.json 文件中配置修改 package配置的就是包名，要确保唯一性
2.使用aapt工具获取
1.下载aapt工具，然后添加到环境变量…
uni-app小程序开发使用uView，u-model传入富文本内容过长，真机上无法滚动
uni-app小程序开发使用uView，u-model传入富文本内容过长，真机上无法滚动
找到u-model插件，在slot内容的外层自定义加入一个scroll-view标签，设置scroll-y“true”，指定高度。
<template><view><u-pop…
uniapp android播放本地视频
概述
本文将介绍如何在uniapp开发中实现Android平台播放本地视频的功能。首先我们会梳理整个实现过程的流程，并使用表格列出每个步骤需要做的事情。然后，我们会逐步解释每个步骤需要做的事情，并提供相关的代码示例。
流程概览
下面的表格展示了实现uniapp Android播放本地…
uniapp form表单提交事件手动调用
背景：
UI把提交的按钮弄成了图片，之前的button不能用了。 <button form-type"submit">搜索</button> 实现：
html： 通过 this.$refs.fd 获取到form的vue对象。手动调用里面的_onSubmit()方法。 methods:…
uni-app 使用vscode开发uni-app
安装插件 uni-create-view 用于快速创建页面 配置插件 创建页面 输入页面名称，空格，顶部导航的标题，回车
自动生成页面并在pages.json中注册了路由
pages\login\login.vue
<template><div class"login">login</d…
Uniapp-安装HBuilder调试基座失败解决方案
无法安装原因
有时候我们测试的时候，在手机上插上了线可能因为各种原因没有点击安装或者安装后删除就无法再次安装了，会提示同步资源失败,未得到同步资源的授权,请停止运行后重新运行，而且无论怎么操作都解决不聊这个问题，这是由…
uniapp中使用render.js进行openers、arcgis等地图操作
uniapp中使用render.js进行openers、arcgis等地图操作
一、为啥需要render.js render.js主要作用于APP上，因为Uniapp本质为vuejshtml进行开发，整个技术栈还是H5，对DOM元素进行操作。而APP中没用Dom元素这个概念。因此利用render.js这个视图层…
Uniapp有奖猜歌游戏系统源码 带流量主
有奖猜歌游戏是一款基于uni-app、uniCloud、uniAD 开发的小游戏，通过猜歌曲、观看广告赚取现金奖励。 本游戏基本特征如下： 1、玩家可以通过猜歌、做任务等方式直接获取现金奖励 2、玩家可以通过猜歌、拆红包、做任务等方式获取金币奖励，当金币累积到一定数量可以兑换现金 3…
Unity3D 导出的apk进行混淆加固、保护与优化原理（防止反编译）
Unity3D 导出的apk进行混淆加固、保护与优化原理（防止反编译）
目录 前言：
准备资料：
正文：
1：打包一个带有签名的apk
2：对包进行反编译
3：使用ipaguard来对程序进行加固 前言&…
uniapp popup弹出窗详解以及相关属性
在Uni-app开发移动应用时，弹出窗是一种常见的交互组件，可以用于展示额外的信息、提示消息或用户操作。Uni-app中提供了popup组件来实现弹出窗功能，本文将详细介绍popup组件的相关属性和用法。
基本用法 在开始使用popup组件之前，…
uniapp微信小程序实现地图展示控件
最终实现效果：
地图上展示控件，并可以点击。 目录
一、前言
二、在地图上展示控件信息 点击后可进行绘制面图形
1.使用cover-view将控件在地图上展示
2.设置控件样式，使用好看的图标
3.控件绑定点击事件 一、前言
原本使用的是control…
uniapp 使用web-view外接三方
来源
前阵子有个需求是需要在原有的项目上加入一个电子签名的功能，为了兼容性和复用性后面解决方法是将这个电子签名写在一个新的项目中，然后原有的项目使用web-view接入这个电子签名项目；
最近又有一个需求，是需要接入第三方的…
uni-app下，页面跳转后wacth持续监听的问题处理
uni-app下，页面跳转后wacth持续监听的问题处理
好久没写博客了，最近碰到了一个uni-app（vue2）开发小程序的问题，个人觉得很典型，所以拿出来给各位做个参考。
需求场景：
全局轮询用户权限。简单…
uniapp uview u-input在app(运行在安卓基座上)上不能动态控制type类型(显隐密码)
开发密码显隐功能时，在浏览器h5上功能是没问题的
<view class"login-item-input"><u-input:type"showPassWord ? password : text"style"background: #ecf0f8"placeholder"请输入密码"border"surround&quo…
uni-app 微信小程序 电子签名及签名图片翻转显示功能
文章目录 1. 需求背景2. 开始撸2.1 点击 重写 进入签名页面（上图一）2.2 书写签名，点击确认返回，及图片翻转显示（上图二，三） 3. 图片进行翻转，返回翻转后的图片 1. 需求背景
接的一个…
uniapp运行到安卓基座app/img标签不显示
img是html中的标签，他也是一个单标签
image属于服务器控件，是个双标签
问题：uniapp运行到app安卓基座后图片无法显示
原因：自己使用了img标签，而且输入路径无提示，img标签导致图片不显示
解决ÿ…
uniapp中解决swiper高度自适应内容高度
起因：uniapp中swiper组件swiper 标签存在默认高度是 height: 150px ；高度无法实现由内容撑开，在默认情况下，swiper盒子高度显示总是 150px 解决办法思路： 动态设置swiper盒子的高度，故需要获取swiper-item盒…
uni-app 微信小程序之自定义中间圆形tabbar
文章目录 1. 自定义tabbar效果2. pages新建tabbar页面3. tabbar 页面结构4. tabbar 页面完整代码 1. 自定义tabbar效果 2. pages新建tabbar页面
首先在 pages.json 文件中，新建一个 tabbar 页面
"pages": [ //pages数组中第一项表示应用启动页ÿ…
数字化智慧工地管理云平台源码（人工智能、物联网）
智慧工地优势："智慧工地”将施工企业现场视频管理、建筑起重机械安全监控、现场从业人员管理、物料管理、进度管理、扬尘噪声监测等现场设备有机、高效、科学、规范的结合起来真正实现工程项目业务流与现场各类监控源数据流的有效结合与深度配合，…
Uniapp Vue3 基础到实战 教学视频
每天都在更新
观看学习地址：视频教学地址（点击跳转）
Uniapp的介绍 1
什么是Uniapp？安装及部署 1-1
课程简介： 了解uni-app是什么，它的优势和适用场景，以及它作为一个跨平台框架的基本概念。…
uniapp vue3.2+ts h5端分环境打包
根目录创建 package.json文件
{"name": "项目名称","version": "1.0.0","description": "","main": "main.js","scripts": {"test": "echo \"Error: no test…
uniapp中进行地图定位
目录 一、创建map
二、data中声明变量
三、获取当前位置信息，进行定位
四、在methods中写移动图标获取地名地址的方法
五、最终展示效果 一、创建map <!-- 地图展示 --><view class"mymap"><!-- <view class"mymap__map"…
uniapp和vue3+ts实现自定义头部导航栏左侧胶囊内容
由于某些原因，可能需要我们自己定义头部导航栏的内容，实现各种设计师画的设计稿，所以就需要这个自定义的组件，实现的内容：自定义标题和左侧胶囊图标内容，也可以自定义搜索内容到里面，实现的效果…
uniapp 使用安卓模拟器运行
uniapp 启动方式有很多种,这里介绍使用模拟器启动uniapp
要使用模拟器启动uniapp肯定少不了安装模拟器(废话) 这里选着浏览器推荐的第一个模拟器mumu模拟器
下载好了mumu安装包后就是安装了,这个过于小白,就不介绍了 2. 查看模拟器的adb端口号, mumu的adb查看端口号与众不同…
uniapp连接蓝牙称（接收，发送）
复制即用，看好注释修改
用微信开发者的->真机调试，进行调试
<view>{{ www }}</view> //数据展示<template><view>{{ www }}</view>
</template><script>export default {data() {return {bluetooth: fal…
uniapp 手动调用form表单submit事件
背景：
UI把提交的按钮弄成了图片，之前的button不能用了。 <button form-type"submit">搜索</button> 实现：
html： 通过 this.$refs.fd 获取到form的vue对象。手动调用里面的_onSubmit()方法。 methods:…
解决 uniapp 开发微信小程序 不能使用本地图片作为背景图 问题
参考博文：uniapp微信小程序无法使用本地静态资源图片(背景图在真机不显示)的解决方法_javascript技巧_脚本之家
问题：uniapp 开发微信小程序，当使用本地图片作为 background-image 时，真机无法显示
解决：
方法一&am…
Uniapp中的事件处理：uni.emit和uni.on/uni.once
介绍
在Uniapp项目中，事件处理是一种重要的通信方式。uni.emit和uni.on（以及uni.once）是Uniapp中用于实现组件间通信的两个关键方法。本文将深入介绍这两个方法，探讨它们的优势、劣势，并通过示例代码演示它们的用法。…
uniapp开发小程序-如何判断小程序是在手机端还是pc端打开
官方说明
https://developers.weixin.qq.com/miniprogram/dev/devtools/pc-dev.html
小程序如何判断是 PC 平台？
通过 getSystemInfo 官方接口（platform 是 windows） 通过 UA（PC UA 包含 MiniProgramEnv/Windows）
…
vue3 uniapp h5 安卓和iOS开发适配踩坑记录
font-size适配屏幕大小及iOS和安卓状态栏及安全距离的处理 App.vue
<script setup lang"ts">
import { onLaunch, onShow, onHide } from "dcloudio/uni-app";
import ./main.scss
onLaunch(() > {console.log("App Launch");var wid…
uni-app 使用uni.getLocation获取经纬度配合腾讯地图api获取当前地址
前言 最近在开发中需要根据经纬度获取当前位置信息，传递给后端，用来回显显示当前位置 查阅uni-app文档，发现uni.getLocation () 可以获取到经纬度，但是在小程序环境没有地址信息 思考怎么把经纬度换成地址，如果经纬度…
用uniapp在微信小程序实现画板(电子签名)功能
目录
一、效果展示
二、插件推荐与引入
三、代码具体应用
四、h5端将base64转换为url
一、效果展示 二、插件推荐与引入
手写板、签字板；<zwp-draw-pad /> - DCloud 插件市场
这个在微信小程序引入时内容简单，且涉及的方法很多，…
案例015:Java+SSM+uniapp基于微信小程序的校园防疫系统
文末获取源码 开发语言：Java 框架：SSM JDK版本：JDK1.8 数据库：mysql 5.7 开发软件：eclipse/myeclipse/idea Maven包：Maven3.5.4 小程序框架：uniapp 小程序开发软件：HBuilder X 小程序…
案例012:Java+SSM+uniapp基于微信小程序的科创微应用平台设计与实现
文末获取源码 开发语言：Java 框架：SSM JDK版本：JDK1.8 数据库：mysql 5.7 开发软件：eclipse/myeclipse/idea Maven包：Maven3.5.4 小程序框架：uniapp 小程序开发软件：HBuilder X 小程序…
unaipp引入echarts图表，小程序端能正常显示打包
使用的uniapp插件:l-echart
https://ext.dcloud.net.cn/plugin?id4899
注意事项
1.因为小程序有主包分包大小限制，并且uni_modules中的包也会算在主包体积中，而我项目中的图表是在分包中使用的，所以我移动uni_modules中的l-echart图表组件…
案例018:基于微信小程序的实习记录系统
文末获取源码 开发语言：Java 框架：SSM JDK版本：JDK1.8 数据库：mysql 5.7 开发软件：eclipse/myeclipse/idea Maven包：Maven3.5.4 小程序框架：uniapp 小程序开发软件：HBuilder X 小程序…
uniapp H5、小程序、APP端自定义不同运行环境（开发、测试、生产）、自定义条件编译平台、以及动态修改manifest.json值讲解
文章目录 前言一、自定义条件编译平台是什么？二、新增自定义条件编译平台三、动态设置服务器请求地址四、动态修改manifest.json1.根目录新增文件 modifyManifest.js2.vue.config.js引入modifyManifest.js 总结示例代码 前言
企业项目开发流程上一般都要配置多个运…
微信公众号对接获取用户openid预约项目心路全历程
公众号对接获取openid全历程 一、背景二、选型三、开始修改若依框架四、自己搭后端框架五、前端框架uni-app修改六、对接获取公众号登录用户openId七、总结 一、背景 老板接了朋友的一个公众号需求，要求做一个简单的疫苗预约系统。功能是获取当前登录用户࿰…
uni-app - 去除隐藏页面右侧垂直滚动条
全局配置
"globalStyle": { //全局配置 "scrollIndicator":"none", // 不显示滚动条 "app-plus":{ "scrollIndicator":"none" // 在APP平台都不显示滚动条 }
}局部配置
"path": "pages/ind…
uniapp——项目day03
商品列表
分支创建 定义请求参数对象 获取商品列表数据 渲染商品列表结构
1. 在页面中，通过 v-for 指令，循环渲染出商品的 UI 结构：
<template><view><view class"goods-list"><block v-for"(goods,…
Uniapp Vue3 基础知识点附带实例
包括数据绑定和计算属性、条件渲染和列表渲染、事件处理、表单输入处理、生命周期钩子、自定义指令和过滤器、路由和导航以及状态管理（如Vuex）：
<template><div><!-- 条件渲染 --><div v-if"showMessage">…
带你用uniapp从零开发一个仿小米商场_5. 公共样式编写,
先前引入了公共样式,但公共样式文件里面还没有编写内容
在这里我将一一讲解公共样式内应该有什么样式,和为什么
首先给page添加高度和背景色,当然这个背景色可以在app.vue内添加 page{/* 设置page高,让每个页面的最小高度为整个视窗的高 */min-height: 100vh; /* 统一字体大小…
带你用uniapp从零开发一个仿小米商场_4.uniapp中引入阿里图标库中字体图标
字体图标库介绍
CSS中的字体图标是一种使用字体文件来呈现图标的技巧。与传统的图像图标相比，字体图标具有更多的优点，例如易于定制、可扩展性和跨平台兼容性。在CSS中，字体图标通常通过使用字体文件和CSS的font-face规则来引入，…
uniapp实现多时间段设置
功能说明：
1 点击新增时间，出现一个默认时间段模板，不能提交
2 点击“新增时间文本”，弹出弹窗，选择时间，不允许开始时间和结束时间同时为00:00，
<view class"item_cont"> …
UniApp 中的 u-input 属性讲解
在 UniApp 中，u-input 是一个常用的组件，用于接收用户的输入。它具有多种属性，用于控制输入框的样式和行为。下面我将为您讲解一些常用的 u-input 属性。
基本属性
value：表示输入框的初始值，可以使用 v-model 进行双…
uniapp IOS从打包到上架流程（详细简单）
uniapp IOS从打包到上架流程（详细简单） 原创
1.登入苹果开发者网站，打开App Store Connect 2.新App的创建
点击我的App可以进入App管理界面，在右上角点击➕新建App 即可创建新的App，如下图： 3.…
案例030:基于微信小程序的英语学习交流平台
文末获取源码 开发语言：Java 框架：SSM JDK版本：JDK1.8 数据库：mysql 5.7 开发软件：eclipse/myeclipse/idea Maven包：Maven3.5.4 小程序框架：uniapp 小程序开发软件：HBuilder X 小程序…
带你用uniapp从零开发一个仿小米商场_9. 轮播图组件封装及使用
导航栏有了,接下来就是轮播图了,轮播图如下, 因为uniapp 官方自己有轮播图,所以这里就不自己写了,直接使用uniapp的轮播图二次开发就好
uniapp的轮播图组件叫swiper ,感兴趣的朋友可以点击链接,直接去看官方文档,也可以看我这里实操
用hbuilderX编译uniapp的代码有一个好处…
uniapp——项目day04
购物车页面——商品列表区域
渲染购物车商品列表的标题区域
1. 定义如下的 UI 结构： 2.美化样式 渲染商品列表区域的基本结构
1. 通过 mapState 辅助函数，将 Store 中的 cart 数组映射到当前页面中使用： import badgeMix from /mixins/tab…
智慧工地管理云平台源码，Spring Cloud +Vue+UniApp
智慧工地源码 智慧工地云平台源码 智慧建筑源码支持私有化部署，提供SaaS硬件设备运维全套服务。 互联网建筑工地，是将互联网的理念和技术引入建筑工地，从施工现场源头抓起，最大程度的收集人员、安全、环境、材料等关键业务数据&am…
uniapp插件开发
安装android studio：安装目录下bin下的此文件，是用来修改分配给android studio的占用内存。 Android 11足够用。 创建新项目： 目录结构介绍： UI组件介绍：在设计程序界面时可以使用可视化拖拽的方式，没有必要…
怎么在uni-app中使用Vuex(第一篇)
Vuex简介
vuex的官方网址如下 https://vuex.vuejs.org/zh/ 阅读官网请带着几个问题去阅读：
vuex用于什么场景？vuex能给我们带来什么好处？我们为什么要用vuex?vuex如何实现状态集中管理？
Vuex用于哪些场景？
组件之…
UniApp打包教程：使用HBuilder X和AppUploader完成原生App云打包和上架指南
UniApp打包教程：使用HBuilder X和AppUploader完成原生App云打包和上架指南"
目录 uniapp进行打包
使用上架工具appuplode进行发包
1.登录appuploder软件 2.登陆开发者App Store后台 uniapp进行打包
在HBuilder X编辑器中打开需要打包的项目，然后…
uniapp运行到安卓模拟器一直在“同步手机端程序文件完成“界面解决办法
如果你是用的模拟器是android studio创建的模拟器，那么你需要新创建一个android11 x86架构的模拟器： 创建完成后，启动模拟器：
然后在hbuilder中重新运行到这个模拟器就可以了：
运行结果：
如果你是用安…
uniapp+vue基于Android的校园二手跳蚤市场的设计与实现 微信小程序
实现功能： 用户管理：登陆、注册、注销、修改密码、上传头像、修改资料 发布与检索：发布商品、模糊搜索、人气排序、价格排序、时间排序、推送商品（协同过滤算法实现个性化推荐），最新发布、分类检索 核心交易…
【开题报告】基于uniapp的瑜伽学习交流小程序的设计与实现
1.选题背景
瑜伽在现代社会中越来越受到人们的关注和喜爱。它不仅可以帮助人们塑造健美的身材，还能促进身心健康、提高生活质量。然而，由于瑜伽动作的复杂性和技巧性，很多初学者在学习过程中会遇到困难和挑战。
同时，由于工作和…
案例035:基于微信外卖小程序
文末获取源码 开发语言：Java 框架：SSM JDK版本：JDK1.8 数据库：mysql 5.7 开发软件：eclipse/myeclipse/idea Maven包：Maven3.5.4 小程序框架：uniapp 小程序开发软件：HBuilder X 小程序…
uniapp基础-教程之HBuilderX配置篇-01
uniapp教程之HBuilderX配置篇-01
为什么要做这个教程的梳理，主要用于自己学习和总结，利于增加自己的积累和记忆。首先下载HBuilderX，并保证你的软件在C盘进行运行，最好使用英文或者拼音，这个操作是为了保证软件的稳定…
uniapp基础-教程之HBuilderX基础常识篇02
uniapp创建项目时属性多为vue后缀；其中每个文件中都包含了三段式结构分别是template；script；style形势，分别是前端显示的画面以及js和css样式。
template：说大白话就是给别人看的，我们打开页面就可以看到的…
uniapp挽留提示2.0
项目需求：有时候挽留的ui是全屏的，用page-container也可以。后来产品提了个问题，手机侧滑的时候没那么顺畅（就是一用侧滑，就显示出来，产品要的方案是如下图，emmm大概是这个意思） 后面…
Vue2或者uniapp 中 使用 iframe 嵌入本地 HTML 页面 并 相互通信。
1.使用 iframe 嵌入本地 HTML 页面（以pdfjs为例）
在 public 文件夹下新建 static 文件夹，然后将 html 文件及相关引用拷贝到 static 文件夹下
uniapp在src下新建hybrid文件 vue 文件完整代码
<template><div class"wrap&q…
微信小程序nodejs+vue+uniapp视力保养眼镜店连锁预约系统
作为一个视力保养连锁预约的网络系统，数据流量是非常大的，所以系统的设计必须满足使用方便，操作灵活的要求。所以在设计视力保养连锁预约系统应达到以下目标： （1）界面要美观友好，检索要快捷简易…
uniapp使用vue3和ts开发小程序获取用户城市定位
这个组件的功能：可以重新定位获取到用户的具体位置，这个是通过getLocation这个api和高德地图的api获取到的，getLocation这个api需要在微信公众平台后台>开发管理> 接口管理里面申请才能使用的，不然无法使用哦，这…
uniapp的vue3的模版的setup函数内使用uniapp内置方法
vue2使用方式直接在method同级使用就行,但是在vue3的setup函数内直接使用会报错,本人找了好久,发现vue3需要导入uniapp模块才能使用,具体如下 使用uniapp上拉加载更多方法
<script>import {onReachBottom} from dcloudio/uni-apponReachBottom(() > {console.log(&qu…
uniapp小程序项目连接微信客服【最新/最全教程】
目录 文档微信官网文档图片微信小程序客服配置官网 效果图聊天地址手机微信电脑端 微信聊天功能实现微信小程序后台添加客服微信号以及配置代码实现参考最后 文档
微信官网文档 微信官网文档
图片 微信小程序客服配置官网
微信小程序客服配置官网 效果图
聊天地址
地址
手…
uni IOS 上传文件 uniapp上传进度
前言
在使用 uniapp 开发的微信小程序中使用了图片上传功能,使用了 uniapp 的图片上传组件 注意：我这里后端接口接收类型为form-data，参数名为files 一、官方示例用法
** uview 1.0 u-upload 官方文档
分析
首先可以看到 <u-upload ref="uUpload" :action=&…
uniapp 打包的 IOS打开白屏 uniapp打包页面空白
uniapp的路由跟vue一样，有hash模式和history模式，
使用 URL 的 hash 来模拟一个完整的 URL，于是当 URL 改变时，页面不会重新加载。
如果不想要很丑的 hash，我们可以用路由的 history 模式，这种模式充分利用 history.pushState API 来完成 URL 跳转而无须重新加载页面。…
解决uview中uni-popup弹出层不能设置高度问题
开发场景：点击条件筛选按钮，在弹出的popup框中让用户选择条件进行筛选
但是在iphone12/13pro展示是正常，但是切换至其他手机型号就填充满了整个屏幕，需要给这个弹窗设置一个固定的高度
iphone12/13pro与其他型号手机对比 一开始…
uniapp 在app端 使用webview进行数据交互。
使用案例
1.app端(需要使用nvue)
<template> <view class"webview-box"> <button style"z-index: 999;" click"handlePostMessage(app向url传值)">点击向url传值</button><web-view ref"webview" clas…
uniapp项目打包h5，支持文件协议，使用vconsole调试移动端
uniapp项目需要打包h5，并且需要嵌套到一个原生的移动端项目中，需要支持文件协议能直接访问
打包设置
设置./基础路径
引入vconsole调试移动端
<script src"https://unpkg.com/vconsole/dist/vconsole.min.js"></script>可以将…
【Vue】【uni-app】实现工单列表项详情页面
这次主要实现的是一个工单详情页面
从工单列表项中点击详情 跳转到工单详情页面，这个详情页面就是这次我们要实现的页面，并可以通过点击这个关闭按钮返回到工单列表页面 首先是在我们原有的工单列表页面的按钮增加一个点击跳转
<button size"m…
uniapp uni-popup组件在微信小程序中滚动穿透问题
起因
在微信小程序中使用uni-popup组件时，出现滚动穿透，并且uni-popup内部内容不会滚动问题。 解决
滚动穿透
查阅官方文档，发现滚动穿透是由于平台差异性造成的，具体解决可以参照文档禁止滚动穿透
<template><page-…
腾讯地图系列（一）：腾讯地图密钥key申请以及初始操作
目录
第一步 注册、登录腾讯地图
1.1 注册 1.2 登录
第二章 申请开发者密钥key 官网：腾讯位置服务 - 立足生态，连接未来 第一步 注册、登录腾讯地图
1.1 注册 1.2 登录 第二章 申请开发者密钥key
官网控制台，点击左侧“应用管理”->“…
uniapp 云打包 生成安卓证书文件
现在使用uniapp来开发小程序，H5，APP越来越多了，目前开发了一款APP，使用的也是uniapp。在此记录下用uniapp开发app云打包时约到的一些问题吧。
前因是我司安卓同学休产假，像云打包时需要的证书文件只能自己动手来搞。看…
uniapp开发小程序经验记录
uniapp开发小程序的过程中会遇到很多问题，这里记录一下相关工具优化，便于后来者参考。
每次保存代码后，小程序都跳回首页
针对这个问题，常规的做法就是修改pages配置文件，但是这种方式不便于路由参数的设置ÿ…
uniapp图片预览
使用uni.previewImage()
<template><swiper class"banner" indicator-dots circular :autoplay"false"><swiper-item v-for"item in pictures" :key"item.id"><image tap"onPreviewImage(item.url)" …
【uniapp】小程序中input输入框的placeholder-class不生效解决办法
问题描述
uniapp微信小程序，使用input组件时，想要改变提示词 placeholder 的样式，但是使用placeholder-class 改变不了
如下：
<input type"text" placeholder"搜索" placeholder-class"placeholde…
uniapp-hubildx配置
1.配置浏览器 （1）运行》运行到浏览器配置》配置web服务器 （2）选择浏览器安装路径 （3）浏览器安装路径： （3.1） 右键点击图标》属性 （3.2）选择目标&…
1.uniapp基础
1.uniapp基础 官方文档：uni-app官网 1.1开发工具 （1）工具： HBuilderX HBuilderX-高效极客技巧 1.2 新建项目 （1） 文件》新建项目 （2）选择相应的配置信息，填写项目根路…
uniapp是否可以用vant等移动端UI库、使用步骤以及需要注意的问题
文章目录 使用vant步骤使用中遇到的问题在浏览器中的运行效果综上，不建议uniapp项目使用vant。 使用vant步骤
首先vant可以兼容uniapp，直接用vant版就好。微信小程序专用版本是：vant-weapp。
基本使用步骤：
1、安装
# 安装 Va…
uniapp打包的h5项目多了接口调用https://api.next.bspapp.com/client
产生跨域问题。
这个实际上是因为该项目在manifest.json文件中勾选了‘uni统计配置’导致的，取消勾选就可以了。
如果是小程序项目，在小程序开发者工具中添加可信任域名就可以了。
可以看看下面这个链接内容
uni-app H5跨域问题解决方案（…
腾讯地图系列（二）：微信小程序添加插件（三种方法）以及插件AppId获取
目录
第一章 前言
第二章 添加插件
2.1 微信小程序添加插件方法一（微信公众平台添加插件）
2.2 微信小程序添加插件方法二（通过项目配置添加插件）
2.3 微信小程序添加插件方法三（微信公众平台服务市场添加插件&…
uniapp 使用 $emit和$on——$on中无法为data中的变量赋值
问题在于this的指向， 解决办法是使用变量保存$on，其次再为data中的值赋值 以下是具体代码：
1、html代码： <view class"form_picker" click"selePositionFun()"><view class""><inp…
uniapp微信小程序富文本、小程序富文本、rich-text解决video问题
我直接使用的 mp-html mp-html 相当好用，功能比较完善，也可以二次开发 具体的直接看官方文档吧
uniapp引入插件市场echarts图表（l-echart）实现小程序端图表，并修改源码实现watch监听option
使用的uniapp插件:l-echart
https://ext.dcloud.net.cn/plugin?id4899
注意事项
1.因为小程序有主包分包大小限制，并且uni_modules中的包也会算在主包体积中，而我项目中的图表是在分包中使用的，所以我移动uni_modules中的l-echart图表组件…
uniapp得app云打包问题
获取appid，具体可以查看详情 也可以配置图标，获取直接生成即可 发行 打包配置 自有证书测试使用时候不需要使用 编译打包 最后找到安装包apk安装到手机 打包前，图片命名使用要非中文，否则无法打包成功会报错
uni-app 获取PAD激光测温方式 （uni-app安卓获取广播内容）
直接在onload执行下列代码 var main plus.android.runtimeMainActivity(); //获取activityvar context plus.android.importClass(android.content.Context); //上下文var receiver plus.android.implements(io.dcloud.feature.internal.reflect.BroadcastReceiver, {onRece…
uniapp 打包H5页面时候清除手机缓存问题
最近遇到一个情况： uniapp 写了一个H5 页面，挂在一个小程序上面，但是每次更新代码，新增新功能，总是有的用户看到的还是上一个版本的样式，前端打包的时候，已经在Uniapp项目的根目录下面新建了一个…
案例059:基于微信小程序的在线投稿系统
文末获取源码 开发语言：Java 框架：SSM JDK版本：JDK1.8 数据库：mysql 5.7 开发软件：eclipse/myeclipse/idea Maven包：Maven3.5.4 小程序框架：uniapp 小程序开发软件：HBuilder X 小程序…
uni-app详解、开发步骤、案例代码
uni-app概念
uni-app是一个使用Vue.js开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、Web（响应式）、以及各种小程序、快应用等多个平台。它允许开发者使用一套代码同时构建多个平台的应用程序，包括iOS、Android、H5、微信小程序、支付宝小程序、百度小…
uniapp蓝牙传输中文乱码问题
uniapp蓝牙传输中文乱码问题
0 现状
传输数字和字母的json字符串都可以解析，有个中文的硬件那边就解析不了，替换一下发数据的处理函数即可
1 原先字符串转化函数
const stringToBytes (msg) > {const buffer new ArrayBuffer(msg.length)const …
uniapp使用v-html调用接口，富文本图片 视频自适应大小
前端获取到后台数据 不做处理 就会出现下面问题 图片 视频超出视图显示不全 处理
//info 是富文本
<view v-ifinfo v-htmlreplaceWhite(info)></view>调用下面方法
replaceWhite(html) { // 处理富文本默认图片，视频大小let newContent html.replace…
uniapp定时器的应用
1、初始化定时器
data(){return{timer: null, //定时器}
}
2、定时器的使用
定时器分两种，setInterval和setTimeout。
二者的区别：
setInterval函数会无限执行下去，除非调用clearInterval函数来停止它。setTimeout函数只执行一次&#x…
uniapp+unicloud（微信商家转账到零钱功能+v3签名）
企业版
首先需要在微信商户里面设置好 v3密钥，弄好证书，网上有很多这边不做详细讲解了，可以自行查询。
v3签名
直接贴出我的全部代码
unicloud
money 的index.js
cert是在money下面的文件夹 use strict;
const db uniCloud.database()…
案例058:基于微信小程序的智能社区服务系统
文末获取源码 开发语言：Java 框架：SSM JDK版本：JDK1.8 数据库：mysql 5.7 开发软件：eclipse/myeclipse/idea Maven包：Maven3.5.4 小程序框架：uniapp 小程序开发软件：HBuilder X 小程序…
在UniApp中使用uni.makePhoneCall方法调起电话拨打功能
目录
1.在manifest.json文件中添加权限
2. 组件中如何定义
3.如何授权
4.相关知识点总结 1.在manifest.json文件中添加权限
{"permissions": {"makePhoneCall": {"desc": "用于拨打电话"}}
}2. 组件中如何定义
<template>…
uniapp 之 短信验证码登录
一、需求 输入手机号码，可以获取验证码。 二、实现效果
点击前：
点击后：
三、代码实现
<template><view class"login"><view class"infobox"><view class"item"><input type…
漫谈Uniapp App热更新包-Jenkins CI/CD打包工具链的搭建
零、写在前面
HBuilderX是DCloud旗下的IDE产品，目前只提供了Windows和Mac版本使用。本项目组在开发阶段经常需要向测试环境提交热更新包，使用Jenkins进行CD是非常有必要的一步。尽管HBuilderX提供了CLI，但Jenkins服务通常都是搭建在Linux环境…
案例048:基于微信小程序电影订票系统
文末获取源码 开发语言：Java 框架：SSM JDK版本：JDK1.8 数据库：mysql 5.7 开发软件：eclipse/myeclipse/idea Maven包：Maven3.5.4 小程序框架：uniapp 小程序开发软件：HBuilder X 小程序…
uniapp app将base64保存到相册,uniapp app将文件流保存到相册
如果是文件流可以先转base64详情见>uniapp 显示文件流图片-CSDN博客
onDown(){let base64 this.qrcodeUrl ; // base64地址const bitmap new plus.nativeObj.Bitmap("test");bitmap.loadBase64Data(base64, function() {const url "_doc/" new Dat…
uni-app 微信小程序之好看的ui登录页面（四）
文章目录 1. 页面效果2. 页面样式代码 更多登录ui页面 uni-app 微信小程序之好看的ui登录页面（一） uni-app 微信小程序之好看的ui登录页面（二） uni-app 微信小程序之好看的ui登录页面（三） uni-app 微信小程…
uni-app 微信小程序之好看的ui登录页面（二）
文章目录 1. 页面效果2. 页面样式代码 更多登录ui页面 uni-app 微信小程序之好看的ui登录页面（一） uni-app 微信小程序之好看的ui登录页面（二） uni-app 微信小程序之好看的ui登录页面（三） uni-app 微信小程…
uniapp获取app版本号、h5版本号、微信小程序版本号的方法
目录 第一种获取App版本号App版本号App的H5版本号 第二种获取App版本号第三种获取App版本号第一种获取微信小程序版本号获取微信小程序版本号 最后 第一种获取App版本号
App版本号
// 获取当前app的版本
const systemInfo uni.getSystemInfoSync();
// 应用程序版本号
// 条…
【uniapp小程序】如何根据开发和发行，自动替换不同环境的baseUrl
需求
小程序调试时使用Hbuilder的运行功能，在测试环境调试；到了发行正式版时使用发行功能，baseurl需要替换到生产环境；有没有办法让代码能够识别当前使用的时运行还是发行，自动切换baseur而不是手动切换？&…
uniapp 打开文件管理器上传(H5、微信小程序、android app三端)文件
H5跟安卓APP 手机打开的效果图： Vue页面：
<template><view class"content"><button click"uploadFiles">点击上传</button></view>
</template><script>export default {data() {return…
uniapp 显示文件流图片
如果是需要将文件流保存到相册，可以先转base64.详情见>uniapp app将base64保存到相册,uniapp app将文件流保存到相册-CSDN博客
uni.request({url: "www.baidu.com",data: {},header: {content-type:application/json,Authorization: "token"…
uni-app 微信小程序之好看的ui登录页面（五）
文章目录 1. 页面效果2. 页面样式代码 更多登录ui页面 uni-app 微信小程序之好看的ui登录页面（一） uni-app 微信小程序之好看的ui登录页面（二） uni-app 微信小程序之好看的ui登录页面（三） uni-app 微信小程…
uniapp点击图片预览功能？
uni-app点击图片预览功能需要使用uni-app提供的uni.previewImage()方法来实现。具体步骤如下： 在点击事件中，将需要预览的图片URL作为参数传递给uni.previewImage()方法。 在uni.previewImage()方法中，使用current参数指定当前预览的图片URL…
uni-app实现安卓原生态调用身份证阅读器读卡库读身份证和社保卡、银行卡、IC卡等功能
DONSEE系列多功能读写器Android Uniapp API接口规范V1.0.0
本项目Uniapp调用了身份证读卡器的库文件：DonseeDeviceLib-debug.aar，该库放到nativeplugins\donsee-card\android，然后会自动加载。SDK会自动检查是否拥有USB设备权限，…
代码混淆技术探究与工具选择
代码混淆技术探究与工具选择
引言
在软件开发中，保护程序代码的安全性是至关重要的一环。代码混淆（Obfuscated code）作为一种常见的保护手段，通过将代码转换成难以理解的形式来提升应用被逆向破解的难度。本文将介绍代码混淆的概…
nvue页面用法uniapp
1.介绍
Nvue是一个基于weex改进的原生渲染引擎，它在某些方面要比vue更高性能，在app上使用更加流畅，但是缺点也很明显，没有足够的api能力，语法限制太大，所以nvue适用于特定场景（需要高性能的区域…
uniapp 输入框输入时，会将内容顶上去的解决方案
// 设置页面最小高度
export const setPageMinHeight () > {return {position: relative,min-height: uni.getSystemInfoSync().windowHeight px}
}页面使用：
import {setPageMinHeight} from "/utils/uniUtil";data() {return {minHeight: setPag…
h5或uniapp或微信小程序，实现左上角返回到指定页面，侧滑左滑返回指定页面，安卓物理返回键返沪指定页面解决思路的思考
h5或uniapp或微信小程序，实现左上角返回到指定页面，侧滑左滑返回指定页面，安卓物理返回键返沪指定页面 uniapp开发app,(非微信小程序)uniapp写的微信小程序 uniapp开发app,(非微信小程序)
自定义的左上角返回按钮
<i class"iconfon…
uniapp基于u-grid-item九宫格实现uCharts秋云图表展示
uniapp基于uView的UI组件u-grid-item九宫格实现uCharts秋云可视化图表展示
这里使用uView的u-grid-item九宫格组件去显示图标排列 九宫格可以做成多列，移动设备上可以通过左右滑动进行展示 <template><div><div style"text-align: center;font…
uniapp监听wifi连接状态
在uniapp中检测WiFi连接状态可以使用uni的API进行操作。
uni.onNetworkStatusChange((res) > {
console.log(res)uni.getConnectedWifi({success: function(res) {console.log(已连接WIFI, res);},fail: function(err) {console.log(未连接WIFI, err);}});
})
此函数将返回…
uniapp切换页面时报错问题
我们来看如下错误： 该错误的意思是不能切换到 tabbar 页面。tabbar页面通常是公共页面或者底部导航栏，如果我们用 navigateTo 或者 redirectTo 都不能实现页面切换。
我们有两种方式：
第一种是用 switchTab 来进行切换，但注意切…
uniapp实战 —— 轮播图【数字下标】（含组件封装，点击图片放大全屏预览）
组件封装 src\components\SUI_Swiper2.vue
<script setup lang"ts">
import { ref } from vue
const props defineProps({config: Object,
})const activeIndex ref(0)
const change: UniHelper.SwiperOnChange (e) > {activeIndex.value e.detail.cur…
hbuilder + uniapp +vue3 开发微信云小程序
1、创建项目： 2、创建项目完成的默认目录结构： 3、在根目录新建一个文件夹cloudFns（文件名字随便），存放云函数源码： 4、修改manifest.json文件：添加 小程序 appid和cloudfunctionRoot࿰…
uniapp实战 —— 开发微信小程序的调试技巧
手机真机调试微信小程序 开发版和体验版的小程序，域名没有备案时想调试接口访问效果，可以按下述方式操作：
在手机上点右上方三个点，点击“开发调试”，开启调试模式，即可真机访问接口（跳过域名校…
uniapp 数组添加不重复元素
一、效果图 二、代码 //点击事件rightBtn(sub, index) {console.log(sub, index)//uniapp 数组添加不重复元素if (this.selectList.includes(sub.type)) {this.selectList this.selectList.filter((item) > {return item ! sub.type;});} else {this.selectList.push(sub.t…
uniapp实现拨打电话跳转手机拨号界面 （ios和安卓通用）
效果展示：左边为安卓系统展示，右边为ios系统展示 代码：
toPhone(){uni.makePhoneCall({phoneNumber: "10086", //要拨打的手机号success: (res) > {// console.log("调用成功")},fail: (res) > {// console.log(调…
uniapp实战 —— 骨架屏
1. 自动生成骨架屏代码 在微信开发者工具中，预览界面点击生成骨架屏 确定后，会自动打开骨架屏代码文件 pages\index\index.skeleton.wxml 2. 将骨架屏代码转换为vue文件 在项目中新建文件 src\pages\index\components\skeleton.vue 将pages\index\index…
uniapp实战 —— 竖排多级分类展示
效果预览 完整范例代码 页面 src\pages\category\category.vue
<script setup lang"ts">
import { getCategoryTopAPI } from /apis/category
import type { CategoryTopItem } from /types/category
import { onLoad } from dcloudio/uni-app
import { compu…
基于PaddleOCR银行卡识别实现（四）之uni-app离线插件
目的 在前三篇文章中完成了银行卡识别整个模型训练等工作，通过了解PaddleOCR的端侧部署，我们也可以将银行卡号检测模型和识别模型移植到手机中，做成一款uni-app手机端离线银行卡号识别的应用。
准备工作
为了不占用过多篇幅，这…
vue，uniapp的pdf等文件在线预览
vue，uniapp文件在线预览方案，用了个稍微偏门一点的方法实现了 通过后端生成文件查看页面，然后前端只要展示这个网页就行，uniapp就用web-view来展示，后台系统就直接window.open()打开就行
示例查看PDF文件，…
uniapp实战 —— 可滚动区域 scroll-view （自适配高度，下拉刷新）
自适配高度 自定义的顶部导航栏，可参考博文 https://blog.csdn.net/weixin_41192489/article/details/134852124
如图可见，在页面滚动过程中，顶部导航栏和底栏未动，仅中间的内容区域可滚动。
整个页面的高度设置为 100%…
uniApp项目的创建，运行到小程序
一、项目创建
1. 打开 HBuilder X
2. 右击侧边栏点击新建，选择项目 3. 填写项目名，点击创建即可 注：uniapp中如果使用生命周期钩子函数，建议使用哪种 ?(建议使用Vue的)
二、运行
1. 运行前先登录 2. 登录后点击 manifest.js…
uniapp页面跳转函数
1.在需要跳转的类加一个点击事件click 2.写一个跳转函数
ToSetting() {uni.navigateTo({url:"/pages/tabbar-5-detial/setting/setting"})}
ok了。
跳转的页面是静态页面，即没有从上一个页面获取数据。
最初级的页面跳转。。。
uniapp获取wifi连接状态
当使用Uniapp开发移动应用时，我们经常需要获取设备的连接状态，特别是WiFi连接状态。下面是一个简短的关于在Uniapp中获取WiFi连接状态的博客：
在Uniapp中，要获取设备的WiFi连接状态，我们可以利用uni.getNetworkType接…
uniapp小程序分享为灰色
引用：https://www.cnblogs.com/panwudi/p/17074172.html
uniapp开发的微信小程序，没有转发，分享：
创建一个mixin:common/share.js
export default {onShareAppMessage(res) { //发送给朋友return {}},onShareTimeline(res) {//…
uniapp移动端悬浮按钮（吸附边缘）
Uniapp移动端悬浮按钮可以通过CSS实现吸附边缘的效果。具体实现步骤如下：
html：
<movable-area class"movable-area"><movable-view class"movable-view" :position"position" :x"x" :y"y"…
uniapp自定义的日历（纯手写）
效果图： html：
<!-- 年月 --><view class"box"><view class"box_time"><view class"time"><image click"lefts" :src"url/uploads/20231206/9d1fb520b12383960dca3c214d84fa0…
uniapp点击按钮，防止按钮多次点击多次触发事件【防抖操作】
图片、 一、在根目录下新建common文件并创建common.js文件，输入下面代码 // 防止处理多次点击function noMultipleClicks(methods, info) {// methods是需要点击后需要执行的函数， info是点击需要传的参数let that this;if (that.noClick) {// 第一次点…
uni-app获取response header响应头（h5/app/小程序三端）
h5、app获取方式：getResponseHeader(key)
示例：参考：HTML5 API Reference
// 创建xhr实例：
// #ifdef APP-VUE
let xhr new plus.net.XMLHttpRequest();
// #endif
// #ifdef H5
let xhr new window.XMLHttpRequest();
// #en…
uniapp+vite+ts+express踩坑总结
1 关于引入express包报
import express from "express"; ^^^^^^
SyntaxError: Cannot use import statement outside a module的问题。
解决方案：
在package.json中添加type：“module”选项
2 Response is a type and must be imported …
uniapp 使用wgt包实现热更新具体实现代码
uniapp 使用wgt包实现热更新具体实现代码
参考文档：https://ask.dcloud.net.cn/article/35667
app.vue
在onLaunch生命周期里面调用
import { GetRefres } from /utils/hot-refresh;
onLaunch(() > {// #ifdef APP-PLUSGetRefres();// #endif
});utils/hot-r…
uniapp 微信小程序 封装axios 包含请求拦截、响应拦截、无感刷新令牌功能
前言： 1、为什么不适用uniapp自带的请求功能？ 答：uniapp自带的请求功能，再刷新了令牌后，重新请求返回的数据无法返回给发起请求的方法。也就是说，刷新令牌后重新发起的请求和第一次发起请求的方法是割裂的。…
uniapp 单选按钮 选中默认设备
需求1：选中默认设备，113 和114 和139都可以选中一个默认设备
选中多个默认设备方法：
async toSwitch(typeItem, title) {const res await this.setDefaultDev(typeItem.ibdr_devsn, typeItem.ibdr_pid)if (!res) {this.common.toast(切换默…
flutter 代码混淆
Flutter 应用混淆： Flutter 应用的混淆非常简单，只需要在构建 release 版应用时结合使用 --obfuscate 和 --split-debug-info 这两个参数即可。 –obfuscate --split-debug-info 用来指定输出调试文件的位置，该命令会生成一个符号映射表。目前…
uniapp 页面通信
navigateTo
// 在起始页面跳转到test.vue页面，并监听test.vue发送过来的事件数据
uni.navigateTo({url: /pages/test?id1,events: {// 为指定事件添加一个监听器，获取被打开页面传送到当前页面的数据acceptDataFromOpenedPage: function(data) {consol…
uniapp原生插件之安卓动态权限申请原生插件
插件介绍
安卓动态权限申请原生插件，集成了常用的权限申请，可以自定义权限申请 该插件为原生开发，如果您想使用UTS版本可以点击这里 插件地址
安卓动态权限申请原生插件，支持常用的权限申请，支持自定义权限申请 - DC…
最新CRMEB商城源码开源版v5.2.2版本+前端uniapp
CRMEB开源商城系统是一款全开源可商用的系统，前后端分离开发，全部100%开源，在小程序、公众号、H5、APP、PC端都能用，使用方便，二开方便！安装使用也很简单！使用文档、接口文档、数据字典、二开文…
基于Java+SpringBoot+Vue3+Uniapp前后端分离考试学习一体机设计与实现企业级2.01版本(视频讲解，已发布上线)
博主介绍：✌全网粉丝5W，全栈开发工程师，从事多年软件开发，在大厂呆过。持有软件中级、六级等证书。可提供微服务项目搭建与毕业项目实战，博主也曾写过优秀论文，查重率极低，在这方面有丰富的经验…
uniApp中uView组件库的丰富布局方法
目录
基本使用
#分栏间隔
#混合布局
#分栏偏移
#对齐方式
API
#Row Props
#Col Props
#Row Events
#Col Events UniApp的uView组件库是一个丰富的UI组件库，提供了各种常用的UI组件和布局方法，帮助开发者快速构建美观、灵活的界面。下面给你写一…
uniapp+vue3使用canvas保存海报的使用示例，各种奇奇怪怪的问题解决办法
我们这里这里有一个需求，是将当前页面保存为海报分享给朋友或者保存到本地相册，因为是在小程序端开发的，所以不能使用html2canvas这个库，而且微信官方新推出Snapshot.takeSnapshot这个api还不是很完善，如果你是纯小程序…
微信小程序uniapp记住密码
记住密码功能
在请求登录接口成功后，我们需要判断用户是否勾选记住密码，如果是，则将记住密码状态、账号信息存入本地。 下次登录时，获取本地的记住密码状态，如果为true则获取本地存储的账号信息，将信息回填…
uniapp提交带有弹出确认和取消按钮方法提交接口
目录 方法1方法2最后 方法1
submitServie(){let self this;if (!self.resultData.item && !self.resultData.subItem) {uni.showToast({title: 请选择服务分类,duration: 1000,icon: none});return false;}uni.showModal({title: 提示,content: 确定提交？…
函数内引入外部函数的调用顺序问题及解决方案
项目需求：uniapp中点击保存图片到相册的功能，需要将临时路径开头以wxfil转换为以http开头的路径
项目问题：内部函数处理数据后给外部函数调用，但是一直调用外部函数再走内部函数。
问题过程：
1.需要先使用uploadFil…
案例044:基于微信小程序的消防隐患在线举报系统
文末获取源码 开发语言：Java 框架：SSM JDK版本：JDK1.8 数据库：mysql 5.7 开发软件：eclipse/myeclipse/idea Maven包：Maven3.5.4 小程序框架：uniapp 小程序开发软件：HBuilder X 小程序…
uniapp腾讯地图路线规划
在uniapp中使用腾讯地图进行路线规划需要通过腾讯地图API进行操作。以下是基本的步骤： 在腾讯地图开放平台上注册账号，并创建应用获取API key。 在uniapp的项目中引入腾讯地图API的JS文件，例如在index.html中添加以下代码：
<…
uniapp和vue如何使用SheetJS导出excel？
uniapp和vue如何使用SheetJS导出excel？ SheetJS中文文档详解 一、SheetJS是什么 SheetJS是一款适用于浏览器和Node.js的开源电子表格解析库。 与其他电子表格解析库相比，SheetJS拥有强大的电子表格解析功能，即使电子表格很大，也可…
uniapp：使用fixed定位，iOS平台的安全区域问题解决
manifest.json > 添加节点 "safearea": { //iOS平台的安全区域"background": "#1C1E22","backgroundDark": "#1C1E22", // HX 3.1.19支持"bottom": {"offset": "auto"}
},已解决ÿ…
uniapp开发input标签只能输入数字
本功能实现input只能输入数字
1、小数点不能在第一位，否则输入不进去
2、小数点后面最多为两位，多了输入不进去
3、只能输入一个小数点
<input v-model"inputCount" input"inputAmount" type"number" style"f…
uniapp全局事件uni.$on，可以不相邻的组件之间传递参数
目录 传送参数页面接受参数页面最后 uniapp全局事件，也就是说，不相邻的，不是父子组件，也可以传递参数。 一个组件，传递项目内所有文件其中一个里面内，可以接受到参数。
传送参数页面
<template><…
uniapp上传文件api如何使用
在uni-app中使用上传文件API有以下几个步骤： 创建 <input type"file"> 元素，并监听文件选择事件 <input type"file" change"chooseFile">在 methods 中定义 chooseFile 方法，处理文件选择事件 met…
【uniapp小程序-分享】
//分享到聊天onShareAppMessage() {let shareMessage {title: this.liveInfo.wx_title,path: /subPages/livePages/liveCourse/live_course_info?courseid this.courseid,imageUrl: this.liveInfo.wx_thumb};let shearMsg uni.getStorageSync(shearImg this.courseid);if (…
uniapp数据缓存（存储/获取/移出）
1.存储：
异步：uni.setStorage(OBJECT)
uni.setStorage({key: storage_key,data: hello,success: function () {console.log(success);}
});同步：uni.setStorageSync(KEY,DATA)
try {uni.setStorageSync(storage_key, hello);
} catch (e) …
什么是uniapp？如何开发uniapp？
大家好！我是咕噜铁蛋！随着移动应用市场的持续发展，开发者们面临着不断增长的需求和多样化的平台选择。在这个背景下，UniApp应运而生，成为一种跨平台开发框架，为开发者提供了一种高效、简便的方式来开发移动…
【uniapp小程序-wesocket的使用】
创建一个Scoket.js
class webSocketClass {constructor(url, time) {this.url urlthis.data nullthis.isCreate false // WebSocket 是否创建成功this.isConnect false // 是否已经连接this.isInitiative false // 是否主动断开this.timeoutNumber time // 心跳检测间隔…
uni-app 用于开发H5项目展示饼图，使用ucharts 饼图示例
先下载ucharts H5示例源码：
uCharts: 高性能跨平台图表库，支持H5、APP、小程序（微信小程序、支付宝小程序、钉钉小程序、百度小程序、头条小程序、QQ小程序、快手小程序、360小程序）、Vue、Taro等更多支持canvas的框架平台&#…
jquery、vue、uni-app、小程序的页面传参方式
jQuery、Vue、Uni-app 和小程序（例如微信小程序）都有它们自己的页面传参方式。下面分别介绍这几种方式的页面传参方式：
jQuery:
在jQuery中，页面传参通常是通过URL的查询参数来实现的。例如：
<a href"page2…
详细教程 - 从零开发 Vue 鸿蒙harmonyOS应用 第五节 （基于uni-app封装鸿蒙接口请求库）
随着鸿蒙系统的兴起,越来越多的app会采用鸿蒙开发。而鸿蒙开发必不可少的就是调用各种接口服务。为了简化接口的调用流程,我们通常会做一层封装。今天就来讲解一下,如何用uni-app封装鸿蒙的接口请求库。
一、新建项目 首先我们要新建一个鸿蒙项目啦！当然选择第一个…
uniapp——内网部署H5端editor富文本报错问题——亲测有效
最近同事在改uniapp的项目，使用了editor组件： 但是在h5端，此editor组件会经常出现加载不出来的情况：
editor组件——官网地址：
uniapp官网editor组件：https://uniapp.dcloud.net.cn/component/editor.ht…
用uniapp写一个点击左侧可以滑动的menu
完成后的图片（点击左侧右边或滑动，滑动右边左侧的选中也会变化）：
数据js （classifyData）：
export default[{"name": "女装","foods": [{"name": &q…
uniapp地图开发（APP，H5）
uniapp地图开发（APP，H5） 背景实现页面实现功能实现注意事项 尾巴 背景
最近项目中需要使用地图相关功能，需要用到聚合，marker拖拽，自定义marker显示内容，根据角色不同maker显示不同图标等功能。…
uniapp图片上传说明
目录
1.文件上传组件
2.单文件上传
3.多文件上传
4.图片的回显
5.注意点 1.文件上传组件
前端上传组件使用uni-file-picker，可以自行进行下载使用。默认上传到绑定的服务空间，配置属性auto-upload为false关闭自动上传，可以限定上传的是…
全球知名的五款JavaScript混淆加密工具详解
现在市场上有很多好用的混淆加密工具，其中一些比较流行且受欢迎的工具包括：
1、UglifyJS（罗马尼亚）：UglifyJS是一个非常流行的 JavaScript工具库，它可以压缩、混淆、美化和格式化 JavaScript 代码。使用…
uniapp整合websocket（简易版）
本文为非全局websocket，只在单页面创建连接。适用于在线聊天对话等业务。若有需要全局websocket（一打开app/小程序就自动连接，关闭则断开），请参考：微信小程序全局websocket。或将本文的实现移至App.vue中即可本文示例较为简易，若生产业务线上使用，需额外优化稳定性即异…
uniapp运行到手机模拟器
第一步，下载MUMU模拟器
下载地址：MuMu模拟器官网_安卓12模拟器_网易手游模拟器 (163.com)
第二步，运行mumu模拟器 第三步，运行mumu多开器 第三步，查看abs 端口 第四步，打开HBuilder,如下图，将…
uniapp问题总结
图片预览（previewImage）
// 预览图片
uni.previewImage({urls: res.tempFilePaths,// --------------------微信小程序中无效----------------longPressActions: {itemList: [发送给朋友, 保存图片, 收藏],success: function(data) {console.log(选中了…
uniapp实战 -- 个人信息维护（含选择图片 uni.chooseMedia，上传文件 uni.uploadFile，获取和更新表单数据）
效果预览 相关代码 页面–我的
src\pages\my\my.vue <!-- 个人资料 --><view class"profile" :style"{ paddingTop: safeAreaInsets!.top px }"><!-- 情况1：已登录 --><view class"overview" v-if"membe…
uniapp uview 页面多个select组件回显处理，默认选中
<view class"add-item column space-around" click"selectClick(1)"><text class"w-s-color-3 f-28">商品分类</text><view class"w-100 space-between"><!-- 第一个参数为你的单选数组，第二个…
uniapp中如何使用百度tts生成文字语音并播放
第一步先在百度云里面申请一个tts应用，这里默认你们都会了哈，申请完是这样的 第二步在manifest.json注册一下 第三步进项目,先获取token
handleGetToken() {// client_id和client_secret就是百度API Key和Secret Keyuni.request({url: https://aip.ba…
uniapp实现检查版本检测，更新
1.首先需要获取当前app的版本
const systemInfo uni.getSystemInfoSync();// 应用程序版本号// #ifdef APPme.version systemInfo.appWgtVersion;// #endif// #ifdef H5me.version systemInfo.appVersion;// #endif2.在获取到服务器保存的app版本
3.点击按钮验证版本号 //…
uniapp 统一获取授权提示和48小时间隔授权
应用商店审核要求 获取权限前需要给提示，拒绝之后48小时不能给弹窗授权 项目用的是uniapp getImagePermission(v?: string, tag?: any, source?: any, proj?: any) {// proj proj || vueSelf.$proj(tag, source);let data {state: false,//是否原生授权denied…
uniapp点击tabbar之前做判断
在UniApp中，可以通过监听 tabBar 的 click 事件来在点击 tabBar 前做判断。具体步骤如下： 在 pages.json 文件中配置 tabBar，例如： {"pages":[{"path":"pages/home/home","name":"h…
【前端基础】uniapp、axios 获取二进制图片
responseType: "arraybuffer
在网络请求中，responseType: "arraybuffer" 是指定服务器响应的数据类型为二进制数据缓冲区（ArrayBuffer）。这是XMLHttpRequest（XHR）和Fetch API等客户端JavaScript API中…
【飞翔的鸟】飞行游戏-uniapp项目开发流程详解
小时候玩过的飞行游戏，叫什么名字来着，通过点击操作控制煽动翅膀来持续飞行，躲避障碍物，有多远就飞多远吧，现在想起来，其中的实现原理非常简单，感兴趣的话来一起看看，这里给大家讲一…
uni-app 工程目录结构介绍
锋哥原创的uni-app视频教程：
2023版uniapp从入门到上天视频教程(Java后端无废话版)，火爆更新中..._哔哩哔哩_bilibili2023版uniapp从入门到上天视频教程(Java后端无废话版)，火爆更新中...共计23条视频，包括：第1讲 uni…
uni-app附件下载预览 并解决打开附件时黑屏
// 预览附件perviewFile(file) {console.log(点击附件, file)var strfile.previewUrlvar filTypestr.split(.)console.log(filType,filType)uni.downloadFile({url: success: function(res) {console.log(打开文档成功, res);if (res.statusCode 200) {uni.saveFile({tempFile…
Android/iOS APP备案流程指南
Android/iOS APP备案流程指南
摘要
本文通过详细介绍了工信部对移动互联网应用程序（APP）备案的要求，解释了APP备案的定义、时间节点、办理流程以及腾讯云、阿里云的备案流程，最后提供了常见问题的解答。
引言
随着移动互联网的…
【UniApp】-uni-app-处理项目输入数据(苹果计算器)
前言 上一篇文章完成了项目的基本布局，这一篇文章我们来处理一下项目的输入数据项目的输入数据主要是通过按键来输入的，所以我们需要对按键进行处理那么我们就来看一下 uni-app-处理项目输入数据 步入正题 在上篇文章中，我在 data 中定义了一…
uniapp常见的标签
1.view
view 是 uni-app 中最基本的组件之一，用于在页面中创建一个视图容器。它类似于 HTML 中的 div 标签，可以用来包裹其他组件或者作为布局容器使用
2.text text 用于显示文本内容，类似于 HTML 中的 span 标签。可以设置字体大小、颜色、…
uni-app APP、html引入html2canvas截图以及截长图（附送250套精选微信小程序源码）
下载安装html2canvas
方式一，https://www.bootcdn.cn/ CDN网站下载html2canvas插件
这里下载后放在测项目目录common下面
页面中引入 方式二、npm方式安装html2canvas
1、npm方式下载 npm i html2canvas2、引入html2canvas
import html2canvas from html2ca…
uni-app tabbar组件
锋哥原创的uni-app视频教程：
2023版uniapp从入门到上天视频教程(Java后端无废话版)，火爆更新中..._哔哩哔哩_bilibili2023版uniapp从入门到上天视频教程(Java后端无废话版)，火爆更新中...共计23条视频，包括：第1讲 uni…
uniapp中uview的text组件
基本使用：
通过text参数设置文本内容。推荐您使用:textvalue的形式
<u--text text"我用十年青春,赴你最后之约"></u--text>设置主题：
通过type参数设置文本主题，我们提供了五类属性。primary error success warning…
uni-app page新建以及page外观配置
锋哥原创的uni-app视频教程：
2023版uniapp从入门到上天视频教程(Java后端无废话版)，火爆更新中..._哔哩哔哩_bilibili2023版uniapp从入门到上天视频教程(Java后端无废话版)，火爆更新中...共计23条视频，包括：第1讲 uni…
uniapp APP应用程序iOS没有上架到苹果应用商店如何整包更新？
随着移动互联网的快速发展，uni-app 作为一种跨平台开发框架，受到了广泛欢迎。然而，有时候开发者可能会遇到一个问题：如何为已经发布到苹果应用商店的 uni-app APP 进行整包更新？尤其是当应用还没有上架到苹果应用商店时…
uniapp：实现手机端APP登录强制更新，从本地服务器下载新的apk更新,并使用WebSocket，实时强制在线用户更新
实现登录即更新，或实时监听更新
本文介绍的是在App打开启动的时候调用更新，点击下方链接，查看使用WebSocket实现实时通知在线用户更新。
uniapp：全局消息是推送，实现app在线更新，WebSocket，ap…
uniapp 目录结构
uniapp 项目常用的目录结构和每个文件的作用。 uniapp 目录结构
components // 组件目录
api // 封装接口目录
node_modules // 环境依赖
pages // 页面文件目录index …
Vue、uniApp、微信小程序、Html5等实现数缓存
此文章带你实现前端缓存，利用时间戳封装一个类似于Redis可以添加过期时间的缓存工具 不仅可以实现对缓存数据设置过期时间，还可以自定义是否需要对缓存数据进行加密处理
工具介绍说明
对缓存数据进行非对称加密处理 对必要数据进行缓存，并…
uni-app顶部导航条固定
1.准备 scroll-view 滚动容器，包裹需要滚动的区域 <!-- 自定义导航栏 --><CustomNavbar /><scroll-view class"scroll-view" scroll-y><!-- 自定义轮播图 --><XtxSwiper :bannerList"bannerList" /><!-- 首页…
uniapp自定义顶部导航并解决打包成apk后getMenuButtonBoundingClientRect方法失效问题
需求：要在app上的顶部导航提示哪里添加一些东西进去，用uniapp自带的肯定不行啊，所以自定义了所有的页面的顶部导航，之后自定义后用手机调试发现 uni.getMenuButtonBoundingClientRect()这个方法的top获取不到....网上找了很多种方…
uni-app 命令行创建
1. 首先创建项目，命令如下:
npx degit dcloudio/uni-preset-vue#vite-ts uni-app-demo如果出现报错，如下图. 大概率就是没有目录C:\Users\Administrator\AppData\Roaming\npm 解决办法： 创建目录 C:\Users\Administrator\AppData\Roaming\n…
uniapp 相关知识点总结整理
一. 单位
1. 换算规则： 1 px 2 rpx1 px 0.75 pt 3 / 4 pt1 pt 1.33 px 4 / 3 px 8 / 3 rpx1 em 16 px1 em 12 pt1px 1pt * 图像分辨率/721. rpx是基于 当前屏幕宽度与750的比值 算出来的，属于动态的。会根据不同屏幕进行换算。所以做响应式比…
uniapp的css样式图片大小截图展示
目录 截取图片前截取图片后第一种方式：代码第二种方式：代码最后 截取图片前 截取图片后 第一种方式：代码
<view class"swiper-box-img"><image class"swiper-box-img-img" :src"item.file_path" mod…
UNIAPP中借助store+watch完成实时数据
简介
手机端蓝牙连接校验仪，校验仪上传校验数据至手机完成展示。基于watch，完成实时展示数据。对象放在store中。实现分为store中的配置，数据接收，数据展示
store配置
在state中配置属性，在mutations中配置更新方法…
uniapp-H5项目的坑
先推荐个插件库-非常好用：https://ext.dcloud.net.cn/
一、uniapp h5 适配pc端 1、问题：屏幕尺寸在400px~960px之间页面排版错乱 2、解决方法：在page.json文件中
"globalStyle": {"navigationStyle": "custom&quo…
uni-app引入vant表单（附源码）
新建项目 下载安装vant
npm i vant main.js引入 import { Form } from vant;
import { Field } from vant;Vue.use(Form);
Vue.use(Field);代码引入
<van-form submit"onSubmit"><van-fieldclass"rePwd"v-model"username"name"请…
uniapp uview裁剪组件源码修改(u-avatar-cropper)，裁出可自定义固定大小图片
u-avatar-cropper修改后
<template><view class"index"><!-- {{userinfo}} --><view class"top"><view class"bg"><image src"../../static/electronic_card/bg.png"></image></view&g…
uniapp通过蓝牙传输数据 （ios）
在uni-app中，可以通过uni-ble（uni-app官方提供的蓝牙插件）来实现iOS设备上的蓝牙数据传输。
首先，确保已在uni-app的manifest.json文件中添加uni-ble插件的配置： "permission": { "scope.userLocati…
封装uniapp签字板
新开发的业务涉及到签字功能，由于是动态的表单，无法确定它会出现在哪里，不得已封装模块。 其中涉及到一个难点就是this的指向性问题， 第二个是微信小程序写法， 我这个写法里用了u-view的写法，可以自己修改组…
【VUE】无法加载文件 \node\vue.ps1，因为在此系统上禁止运行脚本。问题解决
问题描述
在VS Code中输入vue create -p dcloudio/uni-preset-vue uniapp-demo命令时报错 无法加载文件 D:\address\node\vue.ps1，因为在此系统上禁止运行脚本。有关详细信息，请参阅 https:/go.microsoft.com/fwlink/?LinkID135170 中的 about_Executi…
什么是uniapp？用uniapp开发好不好用？
随着移动应用市场的持续发展，开发者们面临着不断增长的需求和多样化的平台选择。在这个背景下，UniApp 应运而生，成为一种跨平台开发框架，为开发者提供了一种高效、简便的方式来开发移动应用程序。利用 UniApp 开发应用程序可以节省…
条件编译处理多端差异
条件编译https://uniapp.dcloud.net.cn/tutorial/platform.html#%E4%B8%BA%E4%BB%80%E4%B9%88%E9%80%89%E6%8B%A9%E6%9D%A1%E4%BB%B6%E7%BC%96%E8%AF%91%E5%A4%84%E7%90%86%E8%B7%A8%E7%AB%AF%E5%85%BC%E5%AE%B9
<template><view class"container"><…
Java智慧工地源码，Spring Cloud +UniApp +MySql技术开发，支持多端展示
智慧工地解决方案依托计算机技术、物联网、云计算、大数据、人工智能、VR&AR等技术相结合，为工程项目管理提供先进技术手段，构建工地现场智能监控和控制体系，弥补传统方法在监管中的缺陷，最线实现项目对人、机、料、法、环的全…
uni-app API接口扩展组件(uni-ui)
锋哥原创的uni-app视频教程：
2023版uniapp从入门到上天视频教程(Java后端无废话版)，火爆更新中..._哔哩哔哩_bilibili2023版uniapp从入门到上天视频教程(Java后端无废话版)，火爆更新中...共计23条视频，包括：第1讲 uni…
uni-app 前后端调用实例 基于Springboot
锋哥原创的uni-app视频教程：
2023版uniapp从入门到上天视频教程(Java后端无废话版)，火爆更新中..._哔哩哔哩_bilibili2023版uniapp从入门到上天视频教程(Java后端无废话版)，火爆更新中...共计23条视频，包括：第1讲 uni…
uni-app设置地图显示
使用前需到**高德开放平台（https://lbs.amap.com/）**创建应用并申请Key 登录 高德开放平台，进入“控制台”，如果没有注册账号请先根据页面提示注册账号 打开 “应用管理” -> “我的应用”页面，点击“创建新应用”&…
uniapp门店收银，点击右边商品，商品会进入左边的购物车，并且，当扫码枪扫描商品条形码，商品也会累计进入购物车
效果： 代码：
<template><view class"container"><view class"top" style"height: 10%; margin-bottom: 20rpx; box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2);"><view class"box" style&q…
uniapp运行到开发者工具中
uniapp 项目在微信开发者工具中运行，用于开发微信小程序。
微信 appid 获取地址：微信公众平台
运行到微信开发者工具中 一、进入微信公众平台、微信扫码登录、选择开发管理、选择开发设置、复制 appid 。 二、打开 manifest.json 配置文件、选择微信小…
uni-app 前后端调用实例 基于Springboot 上拉分页实现
锋哥原创的uni-app视频教程：
2023版uniapp从入门到上天视频教程(Java后端无废话版)，火爆更新中..._哔哩哔哩_bilibili2023版uniapp从入门到上天视频教程(Java后端无废话版)，火爆更新中...共计23条视频，包括：第1讲 uni…
uniapp 新建组件
1. 新建文件夹 components 文件夹名称必须是 components ，否则组件无法自动导入 2. 新建组件 3. 编辑组件 components/logo/logo.vue
<template><img src"https://img.alicdn.com/imgextra/i1/O1CN01EI93PS1xWbnJ87dXX_!!6000000006451-2-tps-150-15…
案例089:基于微信小程序的校园综合服务平台设计与实现
文末获取源码 开发语言：Java 框架：SSM JDK版本：JDK1.8 数据库：mysql 5.7 开发软件：eclipse/myeclipse/idea Maven包：Maven3.5.4 小程序框架：uniapp 小程序开发软件：HBuilder X 小程序…
uniapp 微信小程序 输入框限制输入2位小数
此处input的type为digit
<input v-model"amount" type"digit" placeholder"请填写金额" input"checkAmount"/>data() {return {amount:""}
}methods: {// 小数点后2位checkAmount(e){e (e.match(/^\d*(\.?\d{0,2})…
【vue/uniapp】pdf.js 在一些型号的手机上不显示
引入： uniapp 项目通过 pdf.js 来在线浏览 pdf 链接，在微信小程序中都显示正常，但是通过 app 跳转小程序，在苹果、小米显示正常，但是华为和 oppo 就不显示，可以通过降 pdf.js 的版本来解决这个问题。 解决&…
前端uniapp的tab选项卡for循环切换、开通VIP实战案例【带源码/最新】
目录 效果图图1图2 源码最后 这个案例是uniapp，同样也适用Vue项目，语法一样for循环，点击切换
效果图
图1 图2 源码
直接代码复制查看效果
<template><view class"my-helper-service-pass"><view class"tab…
【vue/uniapp】使用 uni.chooseImage 和 uni.uploadFile 实现图片上传（包含样式，可以解决手机上无法上传的问题）
引入： 之前写过一篇关于 uview 1.x 版本上传照片 的文章，但是发现如果是在微信小程序的项目中嵌入 h5 的模块，这个 h5 的项目使用 u-upload 的话，图片上传功能在电脑上正常，但是在手机的小程序上测试就不会生效&#x…
如何在uniapp中编写云函数
UniApp 是一个使用 Vue.js 开发所有前端应用的框架，开发者编写一次代码，可发布到iOS、Android、H5以及各种小程序。如果你想在 UniApp 中操作云数据库，你可能需要使用云开发的功能。
以下是在 UniApp 中操作云数据库的一般步骤： …
uniapp子组件向父组件传值
目录 子组件向父组件传值子组件1子组件2 父组件最后 子组件向父组件传值
子组件1
<template><view class"content"><view v-for"(item,index) in list" :key"index">{{item}}</view></view>
</template>&…
uniapp前置摄像头拍照功能怎么实现？
33333使用uniapp的原生插件camera
1、在uniapp中创建一个页面
2、在该页面或组件的<template>部分，添加一个camera标签，并设置相应的属性，如position属性为"front"表示使用前置摄像头、"back"表示使用后置摄像头…
uniapp vue2 车牌号输入组件记录
uniapp vue2 车牌号输入案例记录
组件如图
直接上代码
1.html
<template><view><view class"plate" :class"{show: show}"><view class"itemFirst flex-d"><view class"item item1" click"handl…
【uniapp】APP打包上架应用商-注意事项
初雪云-uniapp启动图自定义生成（支持一键生成storyboard） 一、修改App端上传图片/视频 uni.uploadFile let thatthis;
uni.chooseImage({count: 1,sourceType: [camera,album],sizeType: [compressed, original],success: rey > {uni.showLoading({ t…
uniapp 微信小程序跳转外部链接
一、背景：
开发小程序时，跳转到内部路径通常会使用：uni.navigateTo，uni.redirectTo，uni.reLaunch，uni.switchTab等方法，可以跳转到pages.json中已经注册的页面
uni.navigateTo(OBJECT) | uni-…
uniapp怎么实现分包
首先: 分包可以分很多个 但是在optimization：{“ subPackages” ：true} 这里面只能写一个 其次：想要分很多包 必须在pages.json里面得subPackages里面继续追加 最后：保存页面之后 新建得时候就可以看见分包的位置 原创作者&#…
uniapp、vue、小程序常用的一些验证规则校验方法（例如：手机号。身份证、金额等）
例如： 检查是否为空数组 、是否是空 不为空false 为空true、校验密码、校验手机号格式、校验邮箱格式、校验身份证号格式、校验值长度 不少于6位数、 电话号码加密 15288889999 转化为 152****9999、身份证号码加密、验证输入重量、金额等类型 例如 0.11 2.23…
uniapp日期加减切换，点击切换
先上完成后的页面：当前年年份不显示，不然完整显示。 可以切换和自定义选择。
html:样式和图片自定义。
<view class"image-text_30"><image click"delMonth" :src"require(/static/home/zuo.png)" class"…
uni-app中在模拟器上内容可以滚动，真机上失效问题解决
uni-app中在模拟器上内容可以滚动，真机上失效问题解决
1、刚刚开始使用的是view组件，给定了高度，超出部分y轴滚动，微信小程序模拟器上面一直为正常
代码如下：
<template><tn-popup v-model"show"…
uniapp微信小程序投票系统实战 (SpringBoot2+vue3.2+element plus ) -投票创建后端实现
锋哥原创的uniapp微信小程序投票系统实战：
uniapp微信小程序投票系统实战课程 (SpringBoot2vue3.2element plus ) ( 火爆连载更新中... )_哔哩哔哩_bilibiliuniapp微信小程序投票系统实战课程 (SpringBoot2vue3.2element plus ) ( 火爆连载更新中... )共计21条视频…
uniapp微信小程序投票系统实战 (SpringBoot2+vue3.2+element plus ) -创建图文投票实现
锋哥原创的uniapp微信小程序投票系统实战：
uniapp微信小程序投票系统实战课程 (SpringBoot2vue3.2element plus ) ( 火爆连载更新中... )_哔哩哔哩_bilibiliuniapp微信小程序投票系统实战课程 (SpringBoot2vue3.2element plus ) ( 火爆连载更新中... )共计21条视频…
Flyio封装API接口（uniapp开发微信小程序）
Flyio封装API接口
1）flyio 是什么?
2）flyio能干什么？
3）flyio使用 1）flyio 是什么? 一个支持所有JavaScript运行环境的基于Promise的、支持请求转发、强大的http请求库。可以让您在多个端上尽可能大限度的实现代码…
uniapp自定义底部导航栏
1.新建 nav-custom.vue组件
<template><view class"nav-box" :style"{height:heightpx,background:bgColor}"><!-- 自定义导航栏 --><view class"status_bar" :style"{height:statusBarHeightpx}"><!-- u…
uniApp下载图片到手机相册，适配Android、Ios、微信小程序、H5
uniapp下载图片到手机，适配Android、Ios、微信小程序、H5 1.根据不同设备展示不同的按钮1.1 图片显示1.2 微信小程序显示的按钮1.3 h5显示的按钮1.4 app显示的按钮 2. 引入需要用到的文件3. data中需要的数据4. onload方法5. methods需要用到的方法6. 获取手机相册的…
uniapp 解决安卓App使用uni.requestPayment实现沙箱环境支付宝支付报错
背景：uniapp与Java实现的安卓端app支付宝支付，本想先在沙箱测试环境测支付，但一直提示“商家订单参数异常，请重新发起付款。”，接着报错信息就是：{ "errMsg": "requestPayment:fail [pa…
uniapp最简单的底部兼容安全区域显示
效果图：
1.html写上动态padding-bottom
<view class"button-wrap" :style"padding-bottom:bottomPaddingrpx"><view class"com-btn cencel-btn">取消</view><view class"com-btn confirm-btn " cl…
uni-app使用uni-ui加ts类型限制
uni-app使用uni-ui加ts类型限制
安装 uni-ui 组件库
pnpm i dcloudio/uni-ui配置自动导入组件
// pages.json
{// 组件自动导入"easycom": {"autoscan": true,"custom": {// uni-ui 规则如下配置 "^uni-(.*)": "dcloudio/uni…
WXUI 基于uni-app x开发的高性能混合UI库
uni-app x 是什么？
uni-app x，是下一代 uni-app，是一个跨平台应用开发引擎。
uni-app x 没有使用js和webview，它基于 uts 语言。在App端，uts在iOS编译为swift、在Android编译为kotlin，完全达到了原生应用…
uniapp中实现H5录音和上传、实时语音识别（兼容App小程序）和波形可视化
文章目录 Recorder-UniCore插件特性集成到项目中调用录音上传录音ASR语音识别 在uniapp中使用Recorder-UniCore插件可以实现跨平台录音功能，uniapp自带的recorderManager接口不支持H5、录音格式和实时回调onFrameRecorded兼容性不好，用Recorder插件可避免…
【我想开发一个小程序，大概需要多少钱？】
小程序开发为什么报价差距很大？主要是因为小程序的实现方法和功能模型不同。
小程序的实现方法：
实现方法主要分为SAAS小程序、定制小程序和第三方平台小程序。不同的实现方法价格都是不一样的，大概的区间如下： SAAS小程序和第三…
uniapp微信小程序投票系统实战 (SpringBoot2+vue3.2+element plus ) -投票帖子详情实现
锋哥原创的uniapp微信小程序投票系统实战：
uniapp微信小程序投票系统实战课程 (SpringBoot2vue3.2element plus ) ( 火爆连载更新中... )_哔哩哔哩_bilibiliuniapp微信小程序投票系统实战课程 (SpringBoot2vue3.2element plus ) ( 火爆连载更新中... )共计21条视频…
uniapp开发安卓应用微信开放平台创建应用如何获取签名
微信开放平台创建应用时需要应用的签名
比如我们开发了一个应用叫 “滴滴拉屎” 包名：uni.DIDILASHI #mermaid-svg-BUKbltDr30J93dUs {font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;fill:#333;}#mermaid-svg-BUKbltDr30J93dUs .…
uni-app修改头像和个人信息
效果图 代码（总）
<script setup lang"ts">
import { reqMember, reqMemberProfile } from /services/member/member
import type { MemberResult, Gender } from /services/member/type
import { onLoad } from dcloudio/uni-app
impor…
uniapp组件定义
自定义组件
新建在/components/组件名.vue文件 组件文档结构
<template><view>......</view>
</template>
<script>export default {name: "组件名称",//属性自定义props: {属性名称: {type: String, //属性类型value: "值&quo…
uniapp使用wxml-to-canvas开发小程序保存canvas图片
微信小程序官方解决方案：wxml-to-canvas
使用wxml-to-canvas要知道一些前提条件
1、只能画view，text，image
2、每个元素必须要设置宽高
3、默认是flex布局，可以通过flexDirection: "column"来改变排列方式
4、文字 必…
uniapp 字母索引列表插件（组件版） Ba-SortList
简介（下载地址）
Ba-SortList 是一款字母索引列表组件版插件，可自定义样式，支持首字母字母检索、首字检索、搜索等等；支持点击事件。
支持首字母字母检索支持首字检索支持搜索支持点击事件支持长按事件支持在uniapp界…
uniapp中uview组件库丰富的CountTo 数字滚动使用方法
目录
#平台差异说明
#基本使用
#设置滚动相关参数
#是否显示小数位
#千分位分隔符
#滚动执行的时机
#API
#Props
#Methods
#Event 该组件一般用于需要滚动数字到某一个值的场景，目标要求是一个递增的值。
注意
如果给组件的父元素设置text-align: cente…
uniapp 查找不到uview-ui文件怎么办？
用官方的方式总是报：文件查找失败：uview-ui at main.js
解决方案：
1.先安装uview-ui
npm install uview-ui
下载成功是这样的： 而不是这样的： 这样的原因是你的项目里没有package.json包，先执行 npm …
uniapp中按钮点击跳转页面失效，纠正错误（亲测可用）
不知道伙伴你的错误和我是否一致？ 我当时为了点击跳转按钮发现跳转不了，如下错误提示：
worker.js?libNameWAAccelerateWorker.js:1 [Deprecation] SharedArrayBuffer will require cross-origin isolation as of M92, around July 2021. S…
uniapp使用checkbox-group以及API
在Uniapp中，我们可以使用checkbox-group组件来实现多选框的功能。该组件可以将多个checkbox绑定在一起，使得它们可以一起被操作。
首先，在页面中引入checkbox-group组件： <checkbox-group v-model"selectedFruits"&…
uni-app做A-Z排序通讯录、索引列表
上图是效果图，三个问题
访问电话通讯录，拿数据拿到用户的联系人数组对象，之后根据A-Z排序根据字母索引快速搜索
首先说数据怎么拿 - 社区有指导https://ask.dcloud.net.cn/question/64117 uniapp 调取通讯录 // #ifdef APP-PLUSplus.contac…
UniApp调试支付宝沙箱（安卓）
先看下这里完整的交互的图：小程序文档 - 支付宝文档中心
一、打包
不管怎样，先打个包先。可以直接使用云端证书、云端打包，只需要指定包名即可。
二、在支付宝开放平台创建应用
这个参考官方的过程就可以了，只要有刚才打的包&…
uni-app中实现弹幕的滚动效果
在uni-app中实现弹幕的滚动效果，可以通过以下步骤实现： 在页面中创建一个容器，用于显示弹幕内容。可以使用<view>标签或者其他适合的标签作为容器。 使用CSS样式设置容器的位置和样式，例如设置position: fixed使其固定在页…
图鸟Vue3版本部署
无法将“pnpm”项识别为 cmdlet、函数、脚本文件或可运行程序的名称。
分析原因
这个错误信息表明在 VS Code 终端中尝试运行 pnpm install，但系统无法识别 pnpm 命令。这通常表示 pnpm 这个工具没有被正确安装，或者它的可执行文件所在的路径没有被正确…
Uniapp软件库源码-全新带勋章等
测试环境：php7.1。ng1.2，MySQL 5.6 常见问题： 配置好登录后转圈圈，检查环境及伪静态以及后台创建好应用 上传图片不了，检查php拓展fileinfo 以及public文件权限 App个人主页随机背景图，在前端uitl文件夹里面…
精品基于Uniapp+springboot班级管理系统App
《[含文档PPT源码等]精品基于Uniappspringboot班级管理系统App》该项目含有源码、文档、PPT、配套开发软件、软件安装教程、项目发布教程、包运行成功！
软件开发环境及开发工具：
开发语言：Java
后台框架：springboot、ssm
安卓…
uniapp定时器器如何关闭
在onload中设置定时器 ，发现在onhide中关闭不掉，疯狂抓狂，最后发现需要再销毁之后进行关闭
<script>export default {data() {return {clearTime:null,};},onLoad(option) {this.clearTimesetInterval(this.hh(), 500);},onHide(){if(…
uniapp开发微信小程序uni.chooseImage()部分机型不生效问题
bug场景： 点击不生效，无法调起手机的相册选择照片功能
解决方案 在小程序管理后台，更改用户隐私协议，增加选择照片功能
具体操作如下： 设置 基本设置 服务内容说明–>更新 增加信息类型 选中的照片或视频 等…
uniapp 权限申请插件（权限使用说明） Ba-Permissions
简介（下载地址）
Ba-Permissions 是一款权限申请插件，支持权限使用说明弹窗，满足市场审核需求。支持自定义权限申请，也支持快速申请定位、相机、媒体、文件、悬浮窗等常见权限。
支持权限使用说明弹窗，满足…
❤ Uniapp使用一（文档和 API 篇）
❤ Uniapp使用一（文档和 API 篇）
一、介绍
uni-app官网：https://uniapp.dcloud.io/api/media/image?idpreviewimage 微信小程序官网：https://developers.weixin.qq.com/miniprogram/dev/api/media/image/wx.previewImage.html …
uniapp自带的选择日期的使用
年月日的下拉框
直接看代码
<view class"uni-title uni-common-pl">日期选择器</view><view class"uni-list"><view class"uni-list-cell"><view class"uni-list-cell-left">当前选择</view>&…
uni-app根据腾讯地图接口三级联动组件
有时候很懵逼，因为需要用到腾讯地图接口的三级联动，习惯问问度娘，结果出来了我几年前用JQ写的，好吧，还是自己撸一个现在用的吧
组件使用得是uni-popup弹窗，picker-view 滑动选择地址
访问腾讯地图接口使用…
uniapp PDF文件预览/打开
兼容微信小程序/h5/ios/android 在微信小程序环境下需要配置pdf域名 pdfPreview(url){var title 预览uni.showLoading({ title: 加载中, mask: true })//由于android 下webview无法直接打开pdf，需要先下载uni.getSystemInfo({success: res > {console.log(res.p…
uniapp h5 生成 ubuntu桌面程序 并运行方法
uniapp h5 生成 ubuntu桌面程序 并运行方法,在window环境下开发，发布到ubuntu桌面，并运行
1、安装Nodejs
安装包官方下载地址：https://www.nodejs.com.cn/
安装完后cmd，如图，即安装成功 2、通过Nodejs安装 electron…
uni-app的学习【第三节】
五 运行环境判断与跨端兼容 uniapp为开发者提供了一系列基础组件，类似HTML里的基础标签元素，但uni-app的组件与HTML不同，而是与小程序相同，更适合手机端使用。 虽然不推荐使用 HTML 标签，但实际上如果开发者写了`div`等标签，在编译到非H5平台时也会被编译器转换为 `view`…
uniapp 学习笔记
VUE 学习笔记
布局
横向布局
<style>
H(){
display: flex;//创建 布局管理器
flex-direction: row; //方向 row垂直
flex-wrap: wrap;//显示不下是否换行
}//居中
.center(){display:flex; justify-content: center;//垂直居中 竖向align-items: center;//水平居中 横向…
uniapp-app视频层级过高问题
使用v-html动态渲染
参考：uniapp video app端层级过高的问题，滑动渲染问题。_video在app端层级过高-CSDN博客
有想过使用原生，但是太麻烦了，然后换成了弹窗播放，但是动态的src播放失败，错误提示ÿ…
uniapp 在static/index.html中添加全局样式
前言
略
在static/index.html中添加全局样式
<style>div {background-color: #ccc;}
</style>static/index.html源码：
<!DOCTYPE html>
<html lang"zh-CN"><head><meta charset"utf-8"><meta http-…
uniapp pages.json 页面路由
pages.json 页面路由
pages.json 文件用来对 uni-app 进行全局配置，决定页面文件的路径、窗口样式、原生的导航栏、底部的原生tabbar 等。
它类似微信小程序中app.json的页面管理部分。注意定位权限申请等原属于app.json的内容，在uni-app中是在manifes…
uniapp中打包Andiord app，在真机调试时地图以及定位功能可以正常使用，打包成app后失效问题（高德地图）
踩坑uniapp中打包Andiord app，在真机调试时地图以及定位功能可以正常使用，打包成app后失效问题_uniapp真机调试高德地图正常 打包apk高德地图就不加载-CSDN博客
问题：
目前两个项目，一个项目是从另一个项目里面分割出来的一整套…
uniapp设置隐藏原生导航栏(3)
1、单个页面隐藏 在pages.json里配置 (第一种方式)
{"path": "pages/home/index","style": {"navigationBarTitleText": "首页","navigationStyle": "custom" // 使用自定义导航栏，系统会关…
uniapp点击事件报错 Cannot read property ‘stopPropagation‘ of undefined
问题产生：在列表上有个小按钮，可点击弹出选择框。 列表本身可点击进入详情页。所以想用click.stop来阻止点击小按钮时候，触发列表的点击事件。 结果：如图所示 解决方案：发现自己用的是icon，在icon上加click…
uni-forms表单校验有很多坑，uniapp项目，我的表单是写在tab切换页中的，
我的表单是写在tab切换页中的，这和一般写在最外层的表单不一样，当你点提交按钮时，返回的是一个数组，你有3个tab,就有3个数组，你需要通过下标拿到你表单所在的tab对应的数组 <view class"form-box"><…
uniapp+vue3+ts --微信小程序tab导航可以上下滚动选中选项组件代码
uniappvue3ts --微信小程序tab导航可以上下滚动选中选项组件代码
废话不多说，直接上代码。
组件代码：
<template><view class"scroll-tabs-container"><view class"radiusz bg-white pt-[10rpx] z-[999]" :class&…
uniapp组件库Modal 模态框 的使用方法
目录
#平台差异说明
#基本使用
#传入富文本内容
#异步关闭
#点击遮罩关闭
#控制模态框宽度
#自定义样式
#缩放效果
#API
#Props
#Event
#Method
#Slots 弹出模态框，常用于消息提示、消息确认、在当前页面内完成特定的交互操作。 #平台差异说明
AppH5微…
uni-app使用HBuilderX打包Web项目
非常简单，就是容易忘记 一、找到manifest.json配置Web配置 二、源码视图配置
"h5" : {"template" : "","domain" : "xxx.xx.xx.xxx","publicPath" : "./","devServer" : {&quo…
uniapp 使用echarts做折线图条形图。
提前10天把中烟活动做完了，以为能打酱油到除夕那天，结果又要做什么数据看板，方便烟草领导过年查看数据，还只给5天时间，真实压榨剥削啊，下辈子再也不‘拍黄片’了，不！下份工作我就转前…
![uniapp vuecli项目融合[小记]：将多个项目融合，打包成一个小程序/App，拆分多个H5应用](https://img-blog.csdnimg.cn/img_convert/128f09c629a83a505ffa42595d554de8.png)
uniapp vuecli项目融合[小记]：将多个项目融合，打包成一个小程序/App，拆分多个H5应用
前言： 目前两个uniapp vuecli开发的项目【A、B】，新规划的项目C：需要融合项目B 80%的功能模块，同时也需要涵盖项目A的所有功能模块。
应用需求： 1、新项目C【小程序】可支持切换到应用A/C界面【内部通过初始化、路由跳…
uniapp 用css animation做的鲤鱼跃龙门小游戏
第一次做这种小游戏，刚开始任务下来我心里是没底的，因为我就一个‘拍黄片’的，我那会玩前端的动画啊，后面尝试写了半天，当即我就给我领导说，你把我工资加上去，我一个星期给你做出来，…
uni-app导航栏自定义“返回按钮”多种方法设置原生返回
方法一、 导航栏返回按钮事件 onBackPress监听页面返回，返回 event = {from:backbutton、 navigateBack} ，backbutton 表示来源是左上角返回按钮或 android 返回键；navigateBack表示来源是 uni.navigateBack；详见app、H5、支付宝小程序onBackPress() { this.back1(); …
uniapp canvas做的刮刮乐解决蒙层能自定义图片
最近给湖南中烟做元春活动，一个月要开发4个小活动，这个是其中一个难度一般，最难的是一个类似鲤鱼跃龙门的小游戏，哎，真实为难我这个“拍黄片”的。下面是主要代码。 <canvas :style"{width:widthpx,height:hei…
uniapp vue3版本引用 jsencrypt加密库报错：“default“ is not exported by……
个人产生这个异常的原因：将历史项目（vue2）的jsencrypt文件复制到新项目（vue3）里直接引用报错。存在兼容问题，需要重新安装vue3版本的jsencrypt 安装依赖
npm install jsencrypt页面引入
import { JSEncry…
Java+Spring Cloud +Vue+UniApp微服务智慧工地云平台源码
目录
智慧工地云平台功能
【劳务工种】所属工种有哪些？
1.管理人员
2.信息采集
3.证件管理
4.考勤管理
5.考勤明细
6.工资管理
7.现场统计
8.WIFI教育
9.课程库管理
10.工种管理
11.分包商管理
12.班组管理
13.项目管理 智慧工地管理平台是以物联网、…
uni-app(微信小程序、钉钉小程序)打开第三方地图：uni.openLocation的使用
1.相关参数 （文档） 2. 代码实现 openMap() {uni.openLocation({latitude: 29.074979,longitude: 119.52142,name: 地点,address: 浙江省金华市婺城区白龙桥镇郭力垄水库(白龙桥镇),success: function(res) {console.log(打开系统位置地图成功)},fail: fu…
uniapp小程序：内存超过2mb解决方法（简单）message：Error: 上传失败：网络请求错误 代码包大小超过限制。
分析：这种情况是代码文件内存超过2mb无法进行预览上传
解决方法：
1、Hbuilder中点击运行-->运行到小程序模拟器--->运行时是否压缩代码
2、在微信小程序中点击详情--->本地设置： 3、点击预览即可运行了
uniapp安卓android离线打包本地打包整理
离线打包准备 下载Android studio 1.准备资源hbuilder 2.准备离线SDK
最新android平台SDK下载最新android平台SDK下载
3.离线打包key申请
4.直接导入HBuilder-Integrate-AS工程，直接运行simpleDemo项目即可
5.安装java 1.8 jdk-8u151-windows-x64
6.遇到这个报错报错Caus…
uniapp微信小程序投票系统实战 (SpringBoot2+vue3.2+element plus ) -我创建的投票列表实现
锋哥原创的uniapp微信小程序投票系统实战：
uniapp微信小程序投票系统实战课程 (SpringBoot2vue3.2element plus ) ( 火爆连载更新中... )_哔哩哔哩_bilibiliuniapp微信小程序投票系统实战课程 (SpringBoot2vue3.2element plus ) ( 火爆连载更新中... )共计21条视频…
uniapp Android 离线打包之未配置appkey或配置错误
1、去官网申请appKey:
申请Appkey
2、项目中使用appKey:
<meta-dataandroid:name"dcloud_appkey"android:value"794534204bbae06989........" />3、参考 官方教程，修改配置：
配置教程
注意： 本地的appId 和 官…
uniapp 动态生成page.json，自动拆分页面及自动注册页面
自动生成文件，需要借助原生nodejs的能力，然后通过获取文件及文件名，进行数据生成，并写入到page.json里面
1，在你的uniapp项目中创建如上目录 2，small.js文件
module.exports {baseUrl: pages/small/,ch…
uni-app学习与快速上手
文章目录 一、uni-app二、学习与快速上手三、案例四、常见问题五、热门文章 一、uni-app
uni-app是一种基于Vue.js开发框架的跨平台应用开发框架，可以用于同时开发iOS、Android、H5和小程序等多个平台的应用。uni-app的设计理念是一套代码可以编译到多个平台运行&a…
uniapp 用web-view嵌套网页地址并传参
小程序登陆后把token和openId 对应传到pc端 pc端有两套一套pc端代码和适应移动端的代码 嵌套的是适应移动端的代码
1.uniapp
<template><view class"main"><u-navbar :fixed"true" :autoBack"false" leftClick"goBack&quo…
uni-app 接口封装，token过期，自动获取最新的token
一、文件路径截图 2、新建一个文件app.js
let hosthttp://172.16.192.40:8083/jeecg-boot/ //本地接口
let myApi {login: ${host}wx/wxUser/login, //登录
}
module.exports myApi
3、新建一个文件request.js
import myApi from /utils/app.js;
export const r…
【uniapp/vue/pdf.js】在 uniapp 中使用 pdf.js（可以实现在电脑和手机上预览 pdf 文件）
pdf.js 可以在 uniapp 中使用，可以实现在电脑和手机上预览 pdf 文件， 如果是用 iframe 无法实现在手机上预览，附件传的是比较低版本的 pdf.js 文件（2.2.228），其中跨域报错已处理，因为我试过高版…
uniapp组件库Line 线条 的适用方法
目录
#平台差异说明
#基本使用
#线条类型 1.3.7
#兼容性
#API
#Props 此组件一般用于显示一根线条，用于分隔内容块，有横向和竖向两种模式，且能设置0.5px线条，使用也很简单。
#平台差异说明
AppH5微信小程序支付宝小程序百…
uniapp中如何如何让图⽚宽度不变，⾼度⾃动变化，保持原图宽⾼⽐不变
在Uniapp中，你可以通过设置image标签的mode属性为"widthFix"来实现这个需求。这样设置后，图片的宽度将保持不变，高度将自动变化，同时保持原始的宽高比。
请注意，这里的image标签不是HTML中的img标签&#x…
基于Vue uniapp和java SpringBoot的汽车充电桩微信小程序
摘要： 随着新能源汽车市场的迅猛发展，汽车充电桩的需求日益增长。为了满足市场需求，本课题开发了一款基于Java SpringBoot后端框架和Vue uniapp前端框架的汽车充电桩微信小程序。该小程序旨在为用户提供一个简洁高效的充电服务平台࿰…
uniapp如何添加多个表单数组？
目录
一、实现思路
二、实现步骤 ①view部分展示 ②JavaScript 内容 ③css中样式展示 三、效果展示
四、小结 注意事项 总结模板： 一、实现思路 1.在 data 中定义一个数组，用于存储表单项的数据 2.在模板中使用 v-for 指令渲染表单项 3.在 methods 中…
uniapp H5 实现上拉刷新 以及 下拉加载
uniapp H5 实现上拉刷新 以及 下拉加载
1. 先上图
下拉加载
2. 上代码
<script>import DragableList from "/components/dragable-list/dragable-list.vue";import {FridApi} from /api/warn.jsexport default {data() {return {tableList: [],loadingHi…
uniapp多格式文件选择（APP，H5）
uniapp多格式文件选择（APP，H5） 背景实现代码实现运行结果注意事项 尾巴 背景
从手机选择文件进行上传是移动端很常见的需求，在原生开发时由于平台专一性很容易实现。但是用uniapp开发官方提供的API在APP平台只能选择图片和视频&a…
uniapp瀑布流实现
1. 图片瀑布流：
不依赖任何插件，复制即可见效：
<template><view class"page"><view class"left" ref"left"><image class"image" v-for"(item,i) in leftList" :k…
uniapp中mescroll的使用
1.视图
<mescroll-uniref"mescrollRef"init"mescrollInit"down"downCallback"up"upCallback":up"{auto:false,page:{num:0,size:10}}":fixed"false"
</mescroll-uni>
2.js 1. 引入js文件，…
Uniapp小程序端打包优化实践
背景描述：
在我们最近开发的一款基于uniapp的小程序项目中，随着功能的不断丰富和完善，发现小程序包体积逐渐增大，加载速度也受到了明显影响。为了提升用户体验，团队决定对小程序进行一系列打包优化。 项目优化点&…
uni-app app引入天地图
话不多说咸鱼来了
<template><view><div class"mapBox" style"width: 100%; height: 100vh;background: #ddc0c0;" id"mapId" ></div></view>
</template>
<script module"test" lang"r…
uniapp /微信小程序 使用map组件实现手绘地图方案
获取地图范围
点图拾取坐标-地图开放平台|腾讯位置服务
获取需要手绘地图左下角和右上角GPS坐标
以北京故宫为例： 截取需要手绘地图进行手绘地图制作
素材处理
由于地图素材文件比较大，小程序又限制包大小<2M,无…
uniapp 问题汇总-问题数(2)
ios scroll-view无法滚动 使用uview折叠面板嵌套scroll-view
嵌套之后安卓可以滚动，ios无法滚动
<u-collapse accordion opencollapseOpen changecollapseChange ref"uCollapse" :valueuCollapseValue><u-collapse-item :nameindex :title&quo…
基于Android的成人教育课程学习考试系统uniAPP的 小程序_12lo1
APP性能需求 （1）会员在安卓App页面各种操作可及时得到反馈。 （2）该平台是提供给多个会员使用的平台，会员使用之前需要注册登录。登录验证后，会员才可进行各种操作[10]。 （3）管理员用…
uniapp文件预览以及修改预览标题
常用预览
uniapp里面我们使用downloadFile和openDocument这两个api可以很简单实现对文档类型的文件预览。
const previewFile (item: any) > {uni.downloadFile({url: https://文件地址.pdf,success: (res: any) > {uni.openDocument(filePath: res.tempFilePath,file…
uniapp基于Android平台的校园生活服务交流论坛系统(二手,失物招领 -跑腿) 小程序hbuiderx
作为一款APP的校园论坛系统，面向的是大多数学者，软件的界面设计简洁清晰，用户可轻松掌握使用技巧。在调查之后，获得用户以下需求： （1）用户注册登录后，可进入系统解锁更多功能&#x…
【Uni-App】运行微信小程序时报错routeDone with a webviewId 2 that is not the current page
使用HBuilderX开发微信小程序，运行项目的时有可能会出现routeDone with a webviewId 1 that is not the current page的报错，但不影响运行。如果强迫症介意的话，可以考下面的方法进行修复。 产生原因
由于微信开发者工具的调试基础库处于灰度…
uni-app移动端图片预览组件 movable-area 、movable-view （支持缩放，拖动效果、替换部分代码图片可直接使用）
UniApp图片预览组件 利用uni-app官方<movable-area>、<movable-view>内置视图组件 配合 uView 组件的u-popup 弹框组件共同实现封装的图片预览组件，支持手指缩放、拖动效果，替换代码中部分图片后 可以直接使用。 效果图： 组件代码…
uniapp 从自己的微信小程序跳转到京东小程序某个商品
今天由于工作有这个需求于是就去试了下，看了很多方法，对于我最后实现的样板和心得在此记录
随便搞个点击按钮
点击事件传的是商品详情地址，后续用正则提取出来
<view class"goods-item" v-for"(item,index) in goodsLis…
uni-app 经验分享，从入门到离职（三）——关于 uni-app 生命周期快速了解上手
文章目录 📋前言⏬关于专栏 🎯什么是生命周期🧩应用生命周期📌 关于 App.vue/App.uvue 🧩页面生命周期📌关于 onShow 与 onLoad 的区别 🧩组件生命周期 📝最后 📋前言
这…
uniapp+微信小程序+nodejs问题记录
一、前言 通过uniapp进行微信小程序调试。服务端使用NodeJs。
二、报错统计 1、本地调试时微信小程序报错：request:Cannot send network request to localhost 解决方法： 【微信小程序开发平台】-【本地设置】-勾选“不校验合法域名、web-view、TLS版本…
uniapp中的uni-row/uni-col上的click点击无效
文章目录 问题解决 问题
在做uniapp的项目的时候，发现click点击无效。但没找到真正不能点击的原因，只能将其认为与elementui中的el-row上的click无效的原理一致。
有不对的地方，请告诉我一下，谢谢 解决
代码如下：
…
uni-app切换页面刷新，返回上一页刷新（onShow钩子函数的使用）
切换页面刷新：通过onShow()便可实现
返回上一页通过uni.navigateBack({delta: 1});实现
以返回上一页刷新为例
从B页面返回上一页到A页面，在A页面写入方法refreshHandler()
//a.vue
methods: { // 执行刷新逻辑refreshHandler() {uni.request({ur…
uniapp开发一个交流社区小程序
uniapp开发一个交流社区小程序
假期的时候简单学了一下uniapp，想开发一款类似百度贴吧的交流社区来练练手。本篇文章主要记录开发过程，文末附上项目地址。
主要需要开发以下几个页面。
信息页面热榜页面用户主页用户信息页
信息页面 该页面的功能主要…
uniapp本地存储的几种方式localStorage
在uniapp开发中，本地存储是一个常见的需求。本地存储可以帮助我们在客户端保存和管理数据，以便在应用程序中进行持久化存储。本文将介绍uniapp中本地存储的几种方式，以及相关的代码示例。
介绍
在移动应用开发中，我们经常需要将…
uniapp父子组件通信
在Uni-app中，可以使用props和$emit方法实现父子组件之间的通信。 父组件向子组件传递数据（props）： 1. 在父组件中，在子组件的标签上使用属性绑定方式传递数据
<template> <child-component :message"p…
uniapp中使用EelementPlus
uniapp的强大是非常震撼的，一套代码可以编写到十几个平台。这个可以在官网上进行查询uni-app官网。主要还是开发小型的软件系统，使用起来非常的方便、快捷、高效。
uniapp中有很多自带的UI，在创建项目的时候，就可以自由选择。而E…
FastAdmin西陆房产系统(xiluHouse)全开源
应用介绍 一款基于FastAdminThinkPHPUniapp开发的西陆房产管理系统，支持小程序、H5、APP；包含房客、房东(高级授权)、经纪人(高级授权)三种身份。核心功能有：新盘销售、房屋租赁、地图找房、房源代理(高级授权)、在线签约(高级授权)、电子合同…
app对接优量汇收益如何？
优量汇作为国内头部的广告联盟，开发者在对接时要注意哪些方面？
AdSet官网 | 聚合SDK广告变现平台-上海神蓍信息科技有限公司
一、优量汇优势：
（1）快速变现，节省对接时间
1、快速变现，节省接…
uniapp踩坑之项目：简易版不同角色显示不一样的tabbar和页面
1. pages下创建三个不同用户身份的“我的”页面。 显示第几个tabbar，0是管理员 1是财务 2是司机 2. 在uni_modules文件夹创建底部导航cc-myTabbar文件夹，在cc-myTabbar文件夹创建components文件夹，在components文件夹创建cc-myTabbar.vue组件…
Uni-app 学习笔记
H5访问页面跳转：
直接在浏览器输入页面 如： http://localhost:5174/#/pages/request/request
小程序访问页面跳转 pages.json中： "condition": { //模式配置，仅开发期间生效"current": 0, //当前激活的模式（list 的索引项）"list"…
企业网站管理系统（多语言）
应用介绍 响应式PC：
https://demo.ldcms.com.cn/
响应式H5： 前端小程序： 后台登录网址：
https://demo.ldcms.com.cn/ESBFdpKflc.php/index/login 前端截图： 后台截图： 本文来自：企业网站管理…
uniapp canvas游标卡尺效果
效果 根据公司业务仿照写的效果。原项目从微信小程序转uniapp，未测试该效果在android端效果。
uniapp直接使用canvas不可做子组件，否则无效果显示，其次显示时要考虑页面渲染超时的问题。
如效果所见，可以设置取值精度。
gitee地址：project_practice: 项目练习 - Gitee.…
uniapp 开发App 权限授权 js-sdk
从官网的插件市场下载的：
直接上代码：
/*** 本模块封装了Android、iOS的应用权限判断、打开应用权限设置界面、以及位置系统服务是否开启*/var isIos
// #ifdef APP-PLUS
isIos (plus.os.name "iOS")
// #endif// 判断推送权限是否开启
fu…
springboot微信小程序uniapp学习计划与日程管理系统
基于springboot学习计划与日程管理系统，确定学习计划小程序的目标，明确用户需求，学习计划小程序的主要功能是帮助用户制定学习计划，并跟踪学习进度。页面设计主要包括主页、计划学习页、个人中心页等，然后用户可以利用…
uniapp的配置和使用
①安装环境和编辑器
注册小程序账号
微信开发者工具下载
uniapp 官网
HbuilderX 下载
首先先下载Hbuilder和微信开发者工具 （都是傻瓜式安装），然后注册小程序账号： 拿到appid： ②简单通过demo使用微信开发者工具和…
【工作学习 day04】 9. uniapp 页面和组件的生命周期
问题描述
uniapp常用的有：页面和组件，并且页面和组件各自有各自的生命周期函数，那么在页面/组件请求数据时，是用created呢，还是用onLoad呢？ 先说结论:
组件使用组件的生命周期，页面使用页面的…
uniapp中根据图片路径(网络或本地路径)转换为base64
uniapp中根据图片路径(网络或本地路径)转换为base64
/*** 图片地址转换为base64格式图片* param {string} url 图片地址 可网络地址、本地相对路径* param {string} type base64图片类型 默认png*/
function urlToBase64(url, type png) {let promises// 网络地址 或者h5端本…
前端修炼手册（uniapp的api篇）
一、页面相关API
uni.navigateTo 该API用于跳转到应用内的某个页面，可以传递参数。
uni.navigateTo({url: /pages/detail/detail?id1
})uni.redirectTo 该API用于关闭当前页面并跳转到应用内的某个页面，可以传递参数。
uni.redirectTo({url: /pages/…
uniapp微信小程序开发踩坑日记：Pinia持久化
如果你使用过Pinia，那你应该知道Pinia持久化插件：https://prazdevs.github.io/pinia-plugin-persistedstate/zh/
但由于官方文档提供的说明并不是针对小程序开发，所以我们在使用这个插件实现uniapp小程序开发中Pinia持久化会出现问题
我在C…
APP inventor零基础移动应用开发
1.Android平台简介
Android由谷歌和开放手机联盟共同创建的一款针对手机的开源软件工具包
主要特色
---开放性 – 丰富的硬件选择 – 开发商不受任何限制 – 无缝集成互联网服务
App Inventor是由Google公司开发的一款在线开放的Android编程工具软件，通过图形化…
vue3+ts+vite+uniapp项目常见问题
vue3tsvite中""路径失效的问题
""需要进行配置：
首先npm install types/node --save-dev（需要用到node其中的path）接着在vite.config.ts配置文件中进行配置：
引入 import path from ‘path’，然…
uniapp中打开蓝牙需要哪些权限
在uniApp中进行蓝牙连接，需要获取以下权限：
蓝牙权限：用于扫描和连接蓝牙设备。定位权限：用于获取设备的位置信息，以便确定设备与蓝牙设备之间的距离。存储权限：用于读取和写入与蓝牙设备相关的数据。
获…
uniapp 开发一个密码管理app
密码管理app
介绍
最近发现自己的账号密码真的是太多了，各种网站，系统，公司内网的，很多站点在登陆的时候都要重新设置密码或者通过短信或者邮箱重新设置密码，真的很麻烦
所以准备开发一个app用来记录这些站好和密码…
uniapp实现手机横屏（方法二）
在manifest.json文件中，将"deviceOrientation"属性设置为"auto"，这样整个应用程序将支持横屏显示。 在需要横屏显示的页面的<script>标签中，添加onShow生命周期函数，并在函数中调用uni.setScreenOrien…
uniapp富文本文字长按选中（用于复制，兼容H5、APP、小程序三端）
方案：使用u-parse的selectable属性 <u-parse :selectable"true" :html"content"></u-parse> 注意：u-parse直接使用是不兼容小程序的，需要对u-parse进行改造：
1. 查看u-parse源码发现小程序走到以…
【uniapp】自定义步骤条样式
代码实现
<view class"steps-wrap"><view class"flex-box"><view class"number active-number">1</view><view class"desc active-desc">步骤1</view><view :class"[line, activeStep …
微信小程序 图片自适应高度 宽度 完美适配原生或者uniapp
--
-
-
-
查了一下百度看到网上图片高度自适应的解决方案
基本是靠JS获取图片的宽度进行按比例计算得出图片高度。
不是很符合我的需求/
于是我脑瓜子一转 想到一种新的解决方案 不用JS计算也能完美解决。
我写了一个组件，直接导入可以使用。
-
-
- 1.新…
uniapp 使用 uni-file-picker 上传头像
此处使用 select 处理选择完文件后的逻辑，即将文件上传到自己的服务器。
<uni-file-picker limit"1" :del-icon"false" disable-preview :imageStyles"imageStyles"file-mediatype"image" select"upload"&g…
uni-app使用uView打开弹出层后输入框聚焦时placeholder错位问题
这里就不放效果了，大概意思就是在使用uView的popus时，在底部弹出后，如果弹窗中的输入框会造成一瞬间的placeholder文字错位，这个问题的主要是因为uView安全区适配导致
uView相关文档
https://www.uviewui.com/components/safeAr…
uniapp登录逻辑
1.登录页面实现
<template><view class"box"><view class"boxTop"><view class"title">欢迎登录</view><view class"topic">还没有账号，<span clickgetRegister>立即注册</…
uniapp校验app版本并更新
最近用uniapp写了一个安卓壳子做app，遇到一个需求，校验app版本并更新
通过对比线上版本号和app自己的版本号的差异，唤起更新弹窗
相关代码
App.vue
<script>export default {onLaunch: function() {this.checkVersion()},onShow: f…
uniapp小程序因使用 uni.switchTab传不了值使用vuex（简单明了）
uniapp里面不需要npm下载vuex，自带vuex直接用就行 一、先建立一个index.js文件夹
里面写如以下代码
import Vue from vueimport Vuex from vuexVue.use(Vuex)const store new Vuex.Store({state: {userExt: null},mutations: {//相当于同步的操作setUserExt(sta…
uniapp rich-text 富文本组件在微信小程序中自定义内部元素样式
rich-text 富文本组件在微信小程序中，无法直接通过外部css样式控制文章内容样式。
解决方案：将传入的富文本内容截取并添加自定义样式类名
（1）全局配置filter方法，实现富文本内容截取转换，附上‘rich-txt…
Uniapp-开发小程序
文章目录 前言一、npm run xxx —— cross-env: Permission denied解决方法（亲测有效）其他解决方法： 二、macOS 微信开发者工具选择uniapp 用 vscode 开发 总结 前言
macOS下 uniapp 开发小程序。 一、npm run xxx —— cross-env: Permissi…
uniapp项目准备工作
1.封装请求
export const baseUrl
function getHeaders () {let token uni.getStorageSync(token)let header {"access-token":token,// X-Requested-With: XMLHttpRequest,Content-Type: application/json; charsetUTF-8}return header
}
function reLogin(){/…
picker选择器-年月日选择
从底部弹起的滚动选择器。支持五种选择器，通过mode来区分，分别是普通选择器，多列选择器，时间选择器，日期选择器，省市区选择器，默认是普通选择器。
学习一下日期选择器
平台差异说明 日期选择默…
UniApp中打开蓝牙所需哪些权限
Hello，各位同学们新年好呀，咱们又见面了！我是咕噜铁蛋！随着移动应用的普及，蓝牙技术正变得越来越重要。在UniApp中，打开蓝牙功能为我们提供了更多便利和创新的可能性。然而，很多人可能不清楚在U…
uniapp返回上一级页面，传参，上一级通过参数重新请求数据
小程序navigateback传值_微信小程序 wx.navigateBack() 返回页面如何传递参数 - 文章...-CSDN博客 当前页面 上一级页面
uniapp不同平台获取文件内容以及base64编码特征
前言
文件图片上传，客户端预览是很正常的需求，获取文件的md5特征码也是很正常的，那么，在uniapp中三种环境，h5, 小程序以及 app环境下，如何实现的？ 参考： 如何在uniapp中读取文件Arr…
uniapp上传文件到腾讯云
官方API地址
javaScript_SDK 下载cos
npm i cos-js-sdk-v5 --save
生成签名
获取secretId和secretKey
let cos new COS({SecretId: *******************************,SecretKey: ******************************,})
参考文章：腾讯云如何获取secretId和secret…
uni-app判断不同端
大家好，今天给大家分享的知识是在uni-app中如何区分是在什么端操作的程序 话不多说直接上代码： // #ifdef APP-PLUS<view>APP端</view>// #endif// #ifdef H5<view>H5端</view>// #endif// #ifdef MP<view>小程序端</v…
uniapp实现全局悬浮框
uniapp实现全局悬浮框(按钮,页面,图片自行设置) 可拖动 话不多说直接上干货 1,在components新建组件(省去了每个页面都要引用组件的麻烦) 2,实现代码
<template><view class"call-plate" :style"top: top px;left: left px;" touchmove&quo…
uniapp 引入h5页面
如何在app中引入网页？通过使用webview 标签 uniapp 官网给出的webview使用方法: https://uniapp.dcloud.io/component/web-view 但是给出的基本都是在app中使用原生html页面的方法和demo，但是用vue写的H5页面就不能正常使用，下面是解决方法&a…
智慧工地uniapp项目管理系统源码
目录
智慧工地的核心
智慧工地特点
智慧工地的优势
智慧工地应用场景
智慧工地平台---项目版（端）
智慧工地数字栾生平台
三位一体全数据贯通 智慧工地是指应用物联网、大数据、云计算、人工智能等新兴技术，对建筑工地进行数字化、信息…
uniapp微信小程序解决上方刘海屏遮挡
问题 在有刘海屏的手机上，我们的文字和按钮等可能会被遮挡 应该避免这种情况 解决 const SYSTEM_INFO uni.getSystemInfoSync();export const getStatusBarHeight ()> SYSTEM_INFO.statusBarHeight || 15;export const getTitleBarHeight ()>{if(uni.get…
uniapp插件uViewplus的使用（涉及TS下的问题）
在技术选型后最后定了使用有团队维护的uview-plus3.0,官方文档 配置参考：https://juejin.cn/post/7169875753100640270 ts配置参考：https://blog.csdn.net/m0_70027114/article/details/132957426
引入
在项目文件的pages.json中的"easycom"…
uni-app页面通讯的基本使用
文章目录 概要页面间通讯--方式一- url查询字符串和EventChannel- 正向传递数据- 反向传递数据 -- 方式二- 只能用来反向传递数据 小结 概要
本文主要介绍uni-app页面通讯的基本使用
页面间通讯
–方式一
- url查询字符串和EventChannel
直接在url后面通过查询字符串的…
婚恋交友系统源码-交友APP小程序H5开发-源码交付，支持二开-实名制交友更放心！
一、交友小程序开发的重要性
1. 满足人们的社交需求：交友小程序为人们提供了一个便捷的社交平台，使得人们可以随时随地地结识新朋友，拓展自己的社交圈子。
2. 丰富人们的业余生活：通过交友小程序，人们可以参加各种线…
记录解决uniapp使用uview-plus在vue3+vite+ts项目中打包后样式不能显示问题
一、背景
从 vue2uview1 升级到 vue3vitetsuview-plus ,uview组件样式打包后不显示，升级前uview 组件是可以正常显示，升级后本地运行是可以正常显示，但是打包发布成H5后uview的组件无法正常显示，其他uniapp自己的组件可以正常显示…
[uniapp的页面传参]详细讲解uniapp中页面传参的传递方式和接受方式 使用案例 代码注释
目录 一、传递方式1. URL传参2. Storage传参3. Vuex传参4.api传参eventChannel 二、接受方式1. URL传参2. Storage传参3. Vuex传参4.api传参eventChannel 三、使用案例四.提醒 在uniapp中，页面传参是非常常见的需求。本文将详细讲解uniapp中页面传参的传递方式和接受…
uniapp离线打包（使用Android studio打包）
一、准备工作
安装HbuilderX，记住版本号下载对应HbuilderX版本的Android离线SDK，如我使用3.6.18版本打包，则对应应下载3.6.18版本的SDK（官网不提供旧版本的SDK，有些需要自己找）官网下载地址：ht…
Aidex移动端项目入门
运行效果 项目源码下载
若依-ruoyi-AiDex-Uniapp: 若依-Ruoyi APP 移动解决方案，基于uniappuView封装的一套基础模版，开箱即用，免费开源，一份代码多终端适配，支持H5、支付宝小程序、微信小程序、APP，实现了…
【前端】小程序登录、公众号登录 - 头像储存
环境 平台限制 最终头像储存 公众号登录 code转openid服务，附带用户微信头像地址 https://thirdwx.qlogo.cn/mmopen/vi_32/PiajxSqBRaEJU... 【非线上头像】 微信小程序 登录时无法同步获取线上头像， 使用默认头像创建新账户后，依据“…
uniapp运动课程健身打卡系统微信小程序
考虑到实际生活中在我来运动管理方面的需要以及对该系统认真的分析,将系统分为小程序端模块和后台管理员模块，权限按管理员和用户这两类涉及用户划分。 (a) 管理员；管理员使用本系统涉到的功能主要有：首页、个人中心、用户管理、课程类别管理…
基于uniapp微信小程序的汽车租赁预约系统
随着现代汽车租赁管理的快速发展，可以说汽车租赁管理已经逐渐成为现代汽车租赁管理过程中最为重要的部分之一。但是一直以来我国传统的汽车租赁管理并没有建立一套完善的行之有效的汽车租赁管理系统，传统的汽车租赁管理已经无法适应高速发展，…
uniapp使用sqlite
1、判断数据库是否打开 isOpen() {let open plus.sqlite.isOpenDatabase({name: this.dbName,path: this.dbPath})return open;}
2、创建数据库(有就打开)
openSqlite() {return new Promise((resolve, reject) > {plus.sqlite.openDatabase({name: this.dbName,path: th…
mescroll 在uni-app 运行的下拉刷新和上拉加载的组件
官网传送门: https://www.mescroll.com/uni.html
最近使用到了mescroll 但是一直都是整个页面的滚动,
最近需求有需要局部滚动, 收藏了一个博主的文章觉得写的还挺好, 传送门: https://blog.csdn.net/Minions_Fatman/article/details/134754926?spm1001.2014.3001.5506
使用…
采用uniapp实现的银行卡卡片, 支持H5和微信小程序
采用uniapp-vue3实现的银行卡卡片 支持H5、微信小程序（其他小程序未测试过，可自行尝试） 可用于参考学习 可到插件市场下载尝试： https://ext.dcloud.net.cn/plugin?id16736
使用示例
uniapp微信公众号H5分享
如果项目文件node_modules中没有weixin-js-sdk文件，则直接使用本文章提供的；
如果不生效，则在template.h5.html中引入
<script src"https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
首先引入weixin-js-…
uniapp微信小程序-项目实战修改密码
图标是使用uview里面的图标，icfont也可以 以下是所有代码
<template><view><!-- 密码三个 --><view class"password" v-for"(item,index) in userList"><view class"contentuser"><view class&qu…
微信小程序uniapp劳务咨询系统知识百科考试系统java+python+nodejs+php均支持
使用劳务咨询服务平台小程序的分别管理员和用户二个权限子模块。 管理员所能使用的功能主要有：首页、个人中心、用户管理、百科分类管理、知识百科管理、地区信息管理、劳务需求管理、试卷管理、试题管理、论坛交流、系统管理、考试管理等。 用户用户端可以实现首页…
uniapp小程序基础功能封装
在utils文件中创建一个公共的封装文件 index.js
uni.showToast 的封装
export const toast (text) > {return uni.showToast({title: text,icon: none,duration: 2000})
}
uni.showLoading 的封装
export function showLoading(text 加载中..., delay 0) {uni.showLo…
uniapp 使用svg
一、common/function.js 方法封装 // svg 转成urlsvgToUrl(url) {var encoded url.replace(/<!--(.*)-->/g, "").replace(/[\r\n]/g, " ").replace(/"/g, ).replace(/%/g, "%25").replace(/&/g, "%26").replace(/#/g,…
万岳外卖跑腿系统开源版uniapp配置小程序及易联云小票方法及流程
万岳外卖系统跑腿系统开源版含uniapp工程源码可生成客户端app商户端APP配送端APP及平台小程序如果你需要代码或者需要教程可以找我昵称上面或者关注我注明CSDN
最近大家都关注易联云小票的配置方法我就简单说下流程希望大家给关注下 后续将更新更多相关教程共同进步࿰…
uniapp开发安卓app华为平板真机预览
首先使用数据线连接平板和电脑设备
一、前期准备
平板需要开启三个地方：
1、打开设置，在搜索框中输入版本号/或者直接点击最下方的【关于平板电脑】，点击版本号进入关于平板的界面，连续点击版本号7次，直到出现提醒“…
uni-app原生api的promise化以解决异步等待问题分析
相信各位在进行uni-app开发的时候会遇到各种关于异步回调问题，例如要传code给后端以换取session_key，在这之前需要先调用 uni.login，所以执行的顺序是必须同步等待的。在写这篇文章之前对于整体的流程概念需要做一个梳理，以便能更…
IT廉连看——Uniapp——页面样式与布局
IT廉连看——Uniapp——页面样式与布局
目标：
了解样式与布局的规范
熟记px和rpx的区别
全局样式与index样式的区别
一、查看uniapp框架简介——尺寸单位 px尺寸单位的使用是贯穿始终的。
[IT廉连看]
二、尺寸单位——实操效果
1、打开Hbuilder X并进入in…
uniapp webview 修改ua（UserAgent、user-agent）
uniapp webview 修改ua（UserAgent、user-agent）
//设置userAgent代理
plus.navigator.setUserAgent("Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36");
修改后&…
uniapp中在app中清除缓存功能
1.计算缓存大小 //计算缓存大小getStorageSize() {let that this;let fileSizeString "";let isFlag arrIndex(this.menuList, key, my-ql)plus.cache.calculate(function(size) {let sizeCache parseInt(size);if (sizeCache 0) {fileSizeString "0B&q…
证件照（兼容H5，APP，小程序）
证件照由uniappuyui开发完成，并同时兼容H5、App、微信小程序、支付宝小程序，其他端暂未测试。
先看部分效果图吧具体可以下方复制链接体验demo 首页代码
<template><view class""><view class"uy-m-x-30 uy-m-b-20"…
uniapp_微信小程序自定义顶部导航栏和右侧胶囊对齐（不对齐来打我）
一、想要的效果 思路首先开启自定义导航栏，取消自带的导航栏，然后计算胶囊的高度和标题对齐 二、成品代码
1、首先再你需要居中的代码添加以下style <view class"header":style"{paddingTop:navBarTop px,height:navBarHeight px,…
uniapp editor组件添加插入超链接
标题uniapp editor组件添加插入超链接
我基于官方editor组件开发了一个可添加超链接等其他功能的富文本插件 官方富文本编辑器editor组件改良扩展优化版
uni-app 经验分享，从入门到离职（五）——由浅入深 uni-app 数据缓存
文章目录 📋前言⏬关于专栏 🎯什么是数据存储🧩数据存储——存储📌 uni.setStorage(OBJECT)📌 uni.setStorageSync(KEY,DATA) 🧩数据存储——获取📌 uni.getStorage(OBJECT)📌 uni.g…
uniapp中如何把通过uni.chooseImage上传的图片转换成base64格式
uniapp中如何把通过uni.chooseImage上传的图片转换成base64格式
image-tools官网
//下载包
npm i image-tools --save
//在需要使用的地方引入
import { pathToBase64, base64ToPath } from image-toolsuni.chooseImage({count: 1, //默认9sizeType: [original, compressed],…
uni-app中本地存储和缓存
可以使用同步的方法uni.setStorageSync、uni.getStorageSync、uni.removeStorageSync和uni.clearStorageSync等方法来操作本地存储和缓存。
设置本地存储
uni.setStorageSync(key, value);
获取本地存储
let value uni.getStorageSync(key);
删除本地存储
uni.removeSto…
百度百科小程序源码 基于uniapp开发的zblog多端小程序开源源码
应用介绍
本文来自：百度百科小程序源码 基于uniapp开发的zblog多端小程序开源源码 - 源码1688
简介：
基于uniapp开发的zblog多端小程序开源源码，百度百科小程序源码下载。
前期准备工作
1、必须是已BA域名、zblog程序、并且伪静态。
2、…
陪玩软件系统的开发-用PHP书写，uni开发的陪玩平台更有质量-线上线下功能齐全-APP小程序H5公众号都有，源码交付！
线上陪玩系统的功能 在线预订：用户可以在陪玩系统中在线预订陪玩服务，系统会根据用户的订单要求自动匹配陪玩人员。 指定搜索：用户可以通过搜索指定的ID来找到他们想要的陪玩人员。 在线交流：在陪玩系统中提供在线沟通功能&…
uniapp：APP端webview拦截H5页面跳转，华为市场发布需要限制webview的H5页面跳转
在使用uniapp开发APP项目时，华为市场上线APP会被打回来：您的应用内容存在点击跳转至第三方应用市场或游戏中心下载渠道的问题，不符合华为应用市场审核标准。
华为审核指南4.6
因此可以考虑下面的处理方式，通过拦截webview页面的…
Uniapp-小程序简单的时间选择组件-年月日时分
文章目录 前言一、组件效果二、组件代码使用 总结 前言
uniapp小程序开发系列。本文实现一个简单时间选择控件。uniapp用个心仪时间控件真的麻烦。官方给得要么年月日，要么时分。产品只要年月日时分。这该怎么玩。旧项目没有引入ui框架，我也不想去引入&…
微信小程序 uniapp+vue餐厅美食就餐推荐系统
本论文根据系统的开发流程以及一般论文的结构分为三个部分，第一个部分为摘要、外文翻译、目录；第二个部分为正文；第三个部分为致谢和参考文献。其中正文部分包括： （1）绪论，对课题背景、意义、目…
基于uniapp框架的古汉语学习考试系统 微信小程序python+java+node.js+php
1、一般用户的功能及权限 所谓一般用户就是指还没有注册的过客,他们可以浏览主页面上的信息。但如果需要其它操作时，要登录注册，只有注册成功才有的权限。 2、管理员的功能及权限 用户信息的添加和管理，古汉语信息加和管理和学习视频添加和管…
uni-app nvue vue3 setup中实现加载webview,解决nvue中获取不到webview实例的问题
注意下面的方法只能在app端使用，
let wv plus.webview.create("","custom-webview",{plusrequire:"none", uni-app: none, width: 300,height:400,top:uni.getSystemInfoSync().statusBarHeight44
})
wv.loadURL("https://ww…
vue+nodejs+uniapp婚纱定制婚庆摄影系统 微信小程序 springboot+python
目前移动互联网大行其道，人人都手中拿着智能机，手机手机，手不离机，如果开发一个用在手机上的程序软件，那是多么的符合潮流，符合管理者和客户的理想。本次就是开发婚庆摄影小程序，有管理员&#…
Uniapp小程序开发-底部tabbar的开发思路
文章目录 前言一、uniapp 实现 tabbar二、图标使用网络图片后端返回tabbar信息uniapp方式中的setTabBarItem 总结 前言
记录uniapp 开发小程序的底部tabbar ，这里讨论的不是自定义tabbar的情况。而是使用wx.setTabBarItem(Object object) 这个api的情况。关于custo…
使用uniapp实现小程序获取wifi并连接
一、背景 因业务需求，需要在小程序实现发现wifi和连接wifi。但由于Andriod和IOS有差异，所以实现起来有所区别。 先看官方文档 https://developers.weixin.qq.com/miniprogram/dev/framework/device/wifi.html 把连接基础流程了解后，发现二者流…
uniapp截图功能的实现，需要用到HTML2canvas库
首先需要使用命令行导航到项目根目录当中去，然后使用npm或者yarn按照HTML2canvas库，安装好了导入库，之后就可以用了
<template><view><!-- 截图的内容 --><view id"captureContent"><text>Hello, W…
uni-app 实现拍照后给照片加水印功能
遇到个需求需要实现，研究了一下后写了个demo
本质上就是把拍完照后的照片放到canvas里，然后加上水印样式然后再重新生成一张图片
代码如下，看注释即可~使用的话记得还是得优化下代码
<template><view class"content"&g…
【uni-app】路由
（1）路由配置
uni-app 页面路由全部交给框架统一管理，开发者需要在pages.json里配置每个路由页面的路径及页面样式（类似小程序在 app.json 中配置页面路由）。 "pages": [{"path": "pages/ind…
hbuilderx创建、运行uni-app
创建uni-app
在点击工具栏里的文件 -> 新建 -> 项目： 选择uni-app类型，输入工程名，选择模板，点击创建，即可成功创建。
uni-app自带的模板有 Hello uni-app ，是官方的组件和API示例。还有一个重要模…
uniappQQ登录是如何实现的，请说明其流程
QQ登录功能的实现分成以下几个步骤：
注册QQ互联账号并创建应用，获取 appid 配置回调地址 recirect_uri在页面中放置 QQ登录按钮，点击按钮后跳转到 QQ 登录页面，链接地址是由 QQ 平台提供的，需要拼接上申请的 appid登录…
【uni-app】自定义组件和通信
（1）自定义组件概念
组件是 vue 技术中非常重要的部分，组件使得与ui相关的轮子可以方便的制造和共享，进而使得vue使用者的开发效率大幅提升，在项目的component目录下存放组件，uni-app 只支持 vue 单文件组件…
【uni-app】常用组件和 API
常用组件
uni-app 为开发者提供了一系列基础组件，类似 HTML 里的基础标签元素，但 uni-app 的组件与 HTML 不同，而是与小程序相同，更适合手机端使用。
虽然不推荐使用 HTML 标签，但实际上如果开发者写了div等标签&…
uniapp的动态表单实现
目录 1.说明
2.示例 3.总结 1.说明
①在 formData 中定义个数组变量用来接受同一个字段的多个结果。
dynamicFormData: {email: ,// domains 字段下会有多个结果domains: []
}②使用 uni-forms-item 的 rules 属性定义单个表单域的校验规则。
<uni-forms-item :label&qu…
uniapp的扩展组件uni-popup 弹出层自动打开
我的需求是在页面加载完之后自动打开弹窗，自动打开只能写在onReady 或 mounted 生命周期内，这是这个组件的规定：
如果想在页面渲染完毕后就打开 uni-popup ，请在 onReady 或 mounted 生命周期内调用，确保组件渲染完毕…
![记一次uniapp扫描NFC [ISO15693]](https://img-blog.csdnimg.cn/direct/ae2147e45ccc44438105a4761070c4e5.png)
记一次uniapp扫描NFC [ISO15693]
前炎
NFC的类型有很多种,详情:android NFC文档
这次的需求是读取NfcV即ISO15693类型的芯片 本次封装类本体来自uni-app NFC读取卡Id 扇门块的16进制数组 数据解析 (感谢大佬提供的封装) 本次需求原本是读取nfc的mac地址和从NEDF取数据,但后期考虑到NEDF可被读写就改成了读取…
uni-app webview 打开baidu.com
在uni-app中，你可以使用web-view组件来打开外部网页，比如百度首页。以下是一个简单的示例代码，展示了如何在uni-app中使用web-view组件打开百度首页： <template>
<view>
<web-view :src"baiduUrl">&l…
uniapp：启动图 .9png 制作教程
1、工具安装：自行下载Android Studio 2、制作.9png 注意上图3条黑线的位置，意思是：标注黑线的位置可以进行缩放。 对其大多数启动图来说，标注以上3条黑线即可。
uniapp开发之项目运行到 夜神模拟器中
在实际的开发中老是会遇到uniapp运行的模拟器找不到模拟器的情况，时而出现时而消失的，很是头疼。 目标 解决uniapp无法检索到模拟器的问题 1、安装夜神模拟器
官网下载地址 安装包
2、检索不到设备 3 解决方法
找到uniapp中的ADB路径设置窗口 adb路径…
uni-app app实现web-view H5图片长按下载
问题和使用场景描述：
uniapp app web-view中图片无法长按保存，IOS下是正常的，但是Android下长按无反应
解决方案：
下载mui.min.js，放到项目中的static下(下载见最上面的压缩包)
在static目录下新建script.js
mui.…
uniapp+node.js前后端做帖子模块：发布帖子（社区管理平台的小程序）
目录 0前提1.一些准备1.1表帖子表 post 1.2总体思路 2.前端3.后端 👍 点赞，你的认可是我创作的动力！
⭐️ 收藏，你的青睐是我努力的方向！
✏️ 评论，你的意见是我进步的财富！ 0前提
温馨提示…
uniapp同步将本地图片转换为base64，支持微信、H5、APP
接上篇，少了一个方法的源代码。 先上代码： ploadFilePromiseSync (url) > { return new Promise((resolve, reject) > { // #ifdef MP-WEIXIN uni.getFileSystemManager().readFile({ filePath: url, encoding: base64, success: res > { let …
uniapp生成app包引导用户开启通知权限和热更新
uniapp生成app包引导用户开启通知权限和热更新
引导用户开启通知权限
export function setPermissions() {// #ifdef APP-PLUS if (plus.os.name Android) {var main plus.android.runtimeMainActivity();var pkName main.getPackageName();var uid main.getApplicationI…
uniapp问卷调查(单选)
前言
该代码片段只支持问卷调查的单选功能
使用组件库 配置 | uView 2.0 - 全面兼容 nvue 的 uni-app 生态框架 - uni-app UI 框架 (uviewui.com) 代码
<template> <view> <view v-for"(item, index) in radiolist1" :key"index"> …
微信小程序 uniapp+vue实习助学岗位系统springboot/php/python/nodejs
（一）研究目标： 对于本微信小程序实习系统的设计来讲，主要是采用了java语言和mysql数据库来完成对系统的设计，根据某高校的实习系统，提出解决问题的一个可行性方法，可以在手机端就能完成我们的工…
uniapp 地图行车轨迹
文章目录 uniapp 地图行车轨迹1、画地图2、切换地图中心点3、画路线4、轨迹移动5、标记点及自定义内容 uniapp 地图行车轨迹
官网地图组件：https://uniapp.dcloud.net.cn/component/map.html 官网地图组件控制：https://uniapp.dcloud.net.cn/api/locati…
uniapp实战:父子组件传参之子组件数量动态变化
需求说明 现有的设置单元列表,每个带有虚线加号的可以看做是一组设置单元,点击加号可以添加一组设置单元.点击设置单元右上角可以删除对应的设置单元.
实现思路说明 利用数组元素添加或是删除的方式实现页面数量动态变化.由于每个设置单元内容都相同所以单独封装了一个子组件.…
uniapp中导入css和scss的区别
在项目中编写了一个基础的公共样式
common.scss文件
想要将其 导入到app.vue文件中
第一次使用的是import url(static/common.scss);
编译直接报错，无法识别这个文件
原因是 使用import url()是CSS中用于导入外部样式表的语法，但它不适用于导入SCS…
解决uni-app vue3 nvue中使用pinia页面空白问题，让你的应用更稳定！
嗨，各位小伙伴们，我是你们的好盆友咕噜铁蛋！随着Vue3和nvue在uni-app中的广泛应用，使用pinia作为状态管理工具已经成为了不少开发者的首选。然而，在实际开发过程中，我们有时会遇到一个奇怪的问题࿱…
uniapp的h5端保存文件
1、安装file-saver：在你的uni-app项目中，使用npm安装file-saver库。你可以在项目根目录下打开终端或命令提示符，然后运行以下命令来安装file-saver：
npm i file-saver -S2、引入file-saver：在你的uni-app组件或页面中…
关于uniapp H5应用无法在触摸屏正常显示的处理办法
关于uniapp H5应用无法在触摸屏正常显示的处理办法 1、问题2、处理3、建议 1、问题
前几天， 客户反馈在安卓触摸大屏上无法正确打开web系统（uni-app vue3开发的h5 应用），有些页面显示不出内容。该应用在 pc 端和手机端都可以正常…
uniapp 小程序AP配网
一、TCPSocket.js 封装TCP协议
class socket {constructor() {this.connection {};}// 创建一个TCP实例establish(monitor) {this.connection wx.createTCPSocket();this.connection.connect({ address: "192.168.1.1", port: 9100 });}// 发送消息connect(messag…
uniApp h5解决Chrome跨域问题的最终方法
最近用Dcloud 工具 HBuilder X写了一个uniapp 客户端项目，代码在HBuilder 工具内运行没有问题， 打包后放在android app 和ios app内运行也没有问题，唯有把h5链接地址放在chrome里会有如下跨域问题：
Access to XMLHttpRequest at …
社交类app开发步骤分析
在当今的数字化时代，社交类app已成为人们日常沟通和互动的重要工具。开发一款成功的社交类app不仅需要创新的概念，还要融合先进的技术、用户友好的设计以及对市场的深刻理解。以下是社交类app开发的几个关键方面： 1. 市场调研与定位ÿ…
uniapp 上传压缩图片 兼容h5和小程序的方法
项目是用uniapp开发的，当时只是做App端，后来项目扩展到H5端， uniapp框架可以跨平台所以移动端和H5使用的是一套代码 上传头像的时候要求图片的大小在2MB一下，所以要压缩图片，App端当时使用的是uni.compressImage(OBJEC…
uniapp 微信小程序使用高德地图Vue3不兼容Vue2问题
1. uniapp 微信小程序使用高德地图Vue3不兼容Vue2问题
1.1. 问题 uniapp Vue3项目引用高德地图报错 import amapPlugin from ‘…/…/…/js_sdk/js_amap/amap-wx.130’;
"default" is not exported by "../../../MyProject/Base/Szy/js_sdk/js_amap/amap-wx.1…
UniApp Vue 3 中的网络请求封装详解及用法
在UniApp中，结合Vue 3的强大特性，进行网络请求的封装是项目中常见的需求。这样的封装不仅提高了代码的可维护性，还使得在组件中使用网络请求更加简洁。本文将详细介绍UniApp Vue 3中的网络请求封装，并提供一个简单的用法示例。
1…
uniapp富文本编辑-editor-vue2-vue3-wangeditor
前言
除了“微信小程序”，其他小程序想要使用editor组件实现富文本编辑，很难vue3项目 官方组件editor，在初始化时有点麻烦，建议搭配第三方组件wangeditor 写在前面 - editor组件缺少editor-icon.css
内容另存为editor-icon.css…
【工作实践-07】uniapp关于单位rpx坑
问题：在浏览器页面退出登录按钮上“退出登录”字样消失，而在手机端页面正常;通过查看浏览器页面的HTML代码，发现有“退出登录”这几个字，只不过由于样式问题，这几个字被挤到看不见了。
样式代码中有一行为：…
uniapp 头部设置公共token（确保新增页面不重复提交--每一次新增都获取一次token,后端根据token判断是否有重复，有重复提交后台给提示错误）
1 在公共文件中请求接口获取token 2 在公共请求中设置token 3 在使用的页面onShow请求
WordPress 小程序「星宿UI」基于 uni-app 多端开源优化版
一款基于 WordPress 后台的资讯资源下载小程序，独具一色的 UI 非常好看，独立 PHP 接口。下载地址：优化版.zip
uniapp中使用WebSocket
在 uni-app 中，uni.connectSocket 方法用于建立 WebSocket 连接，但它并不提供 onOpen、onMessage、onClose 和 onError 这样的方法作为回调函数。相反，你应该使用 uni.onSocketOpen、uni.onSocketMessage、uni.onSocketClose 和 uni.onSocket…
uniapp npx update-browserslist-db@lates 问题解决
在uniapp运行项目时，会有这种报错，其实这是表明browserslistlatest版本低了，在催你升级版本，browserslistlatest是用来支持解析css用的，当然，你也可以直接忽略这个报错提示，也可以正常运行项目。…
交友社交软件开发-php交友聊天系统-
为了开发一个高效的交友系统，需要一个完善的信息管理和筛选机制。这个系统应该能够根据用户的个人信息、兴趣爱好、价值观等标准进行筛选，并向用户提供符合他们要求心仪的人的信息。为了实现这个目标，系统可以利用人工智能技术，分…
uniapp的h5端在线预览文件
步骤如下：
1、下载需要准备的工具文件包 2、将其解压到/static/pdf文件夹下,如图：
3、创建在线查看文件的页面：
<template><view><web-view :src"path"></web-view></view>
</template>&l…
使用uniapp开发时自定义tabbar
预览图： 一、配置page.jsong中的tabbar（这一步是必须的，因为我们在使用uni.switchTab()时必须要用到）
"tabBar": {"list": [{"pagePath": "pages/index/index","iconPath": &…
uniapp：根据环境（开发、测试、生产）选择服务器接口或者业务
一、根据环境（开发、测试、生产）选择服务器接口或者业务 打开main.js 页面，使用以下代码
const accountInfo wx.getAccountInfoSync();
const envWx accountInfo.miniProgram.envVersion;
if (envWx develop) {console.log(开发环境&…
uniapp:使用DCloud的uni-push推送消息通知（在线模式）java实现
uniapp:使用DCloud的uni-push推送消息通知（在线模式）java实现
1.背景
今天开发app的时候遇到一个需求： 业务在出发特定条件的时候向对应的客户端推送消息通知。 为什么选择在线模式，因为我们使用的是德邦类似的手持终端…
UniApp项目处理小程序分包
目前 uniApp也成为一种 App端开发的大趋势 因为在目前跨端 uniApp可以说相当优秀
可以同时兼容 H5 PC 小程序 APP 的技术 目前市场屈指可数 那么 说到微信小程序 自然就要处理分包 因为微信小程序对应用大小限制非常铭感 限制在2MB 超过之后就会无法真机调试与打包
不过需要注…
uniapp真机运行的时候显示同步资源失败，未得到同步资源的授权，请停止运行后重新运行，并注意手机上的授权提示
1、问题
在添加清单文件之前，项目运行都是好好的，添加了清单项目以后，基座一打就报这个错，并且手机在安装基座的时候会提示解析包时失败，
2、解决方案
打开我的清单文件，我发现我和官网写的清单文件不一…
在uniapp中，如何去掉一些不想要的权限，
1、问题
在uniapp中，云打包以后会自动增加一个电话权限，并且在manifest.json里面也没有添加这个权限，怎么添加都添加不上
2、解决方案
1、在uniapp项目中右键，新增自定义文件 2、新增清单文件，命名为AdroidManifest…
uniapp 使用了uview 的dropdown下拉菜单后出现页面无法滚动
在上面不难发现，当下拉菜单已经处于关闭状态时，class为 u-dropdown__content这一块的元素还是存在的，究极原因是只把这个元素的opacity置为0了，导致页面无法滚动 所以找到uview的dropdown文件进行如下处理，直接给它关闭…
uniapp使用vue3语法构建自定义导航栏，适配小程序胶囊
具体代码
<template><view class"nav-wrapper-container" :style"height:navBarHeight px"><view class"nav-status-container" :style"height:navstatusBarHeight px;" /><view v-if"isCustom" clas…
解决uni-app中使用webview键盘弹起遮挡input输入框问题
这个平平无奇的回答，可能是全网最靠谱的解决方案。 这里我用的是vue3 setup .vue文件的方式
<view>
<web-view :fullscreen"false" :webview-styles"{top: statusBarHeight40,height:height,progress: {color: green,height:1px } }"…
uniapp实现进度条组件
首先，在uniapp项目中创建一个自定义组件，可以命名为Progress.vue。在Progress.vue中，编写如下代码：
<template><view class"progress"><view class"progress-bar" :style"{width: progr…
如何解决iQOO手机运行uniapp真机调试时无法识别的问题
打开开发者选项，打开USB设置，把默认USB选项改成MIDI模式，就可以检测到手机了
实名制交友-智能匹配-仿二狗交友系统-TP6+uni-APP小程序H5公众号-源码交付-支持二开！
一、代码风格
通常不同的开发者具备不同的代码风格，但为了保证语音交友系统开发质量，在编码前需要进行代码风格的统一，通过制定一定的规则，约束开发者的行为。具有统一风格的代码才能更清晰、更完整、更容易理解、更方便后期维护…
UNIapp实现局域网内在线升级
首先是UNIapp 生成apk
用Hbuilder 进行打包 可以从网站https://www.yunedit.com/reg?gotocert 使用自有证书，目测比直接使用云证书要快一些。
发布apk 网站
用IIS发布即可 注意事项中记录如下内容 第一、需要在 iis 的MiMe 中添加apk 的格式，否则无法…
uniapp_微信小程序_说下动态class（实用性很强）
// 以上图片为例,里面的参数是后端传给你的，你不知道有多少东西，更不可能一个一个改，所以引入动态class 代码实现
<view :class"{ pay: item.paymoneystatus 未支付,inpay: item.paymoneystatus 已支付}">{{item.paymon…
uniapp微信小程序获取当前位置
uni-app微信小程序uni.getLocation获取位置；authorize scope.userLocation需要在app.json中声明permission；小程序用户拒绝授权后重新授权-CSDN博客
[Uniapp]携带参数跳转界面（两种方法）
一、方法1：路由携参 假设现在有两个界面：界面A和界面B。并要由界面A跳转到界面B，则我们可以使用 uni.navigateTo({}) 跳转界面时，将参数附加在URL后，…
uniapp——信号值组件（vue3）
组件代码
<template><view><view class"signals"><view v-for"(item, index) in signals" :key"index" class"signal" :style"item"></view></view></view>
</template>&…
uniapp H5 $el.querySelectorAll is not a function
在监听是否在可视区域遇到问题（网页端） 解决方案
<view class"container">
...省略 业务代码...
</view>参考 ： https://blog.csdn.net/qq_18841969/article/details/134620559
uviewplus在uniapp中的配置使用
版本: "uview-plus": "^3.1.45"在page.json中配置:
"easycom": {"autoscan": true,"custom": {"^u--(.*)": "uview-plus/components/u-$1/u-$1.vue","^up-(.*)": "uview-plus/componen…
uniapp 开发app，如何使用模拟器
1、开发app ，设置模拟器 （uniapp 如何设置模拟器） https://blog.csdn.net/sweetsoft/article/details/130727169
2、运行到模拟器
注意：1、模拟器所在的位置：“D:\Program Files\Nox\bin”，在该文件夹下找…
uniapp 的video播放如何实现小窗功能
在页面中使用<video>组件来展示视频，并设置好相应的属性和事件监听： <video src"video.mp4" play"onVideoPlay" pause"onVideoPause"></video>在页面的data中定义一个变量来表示是否开启小窗模式&#…
微信小程序python+uniapp+hbuiderx宠物美容用品商城领养寄养系统i843n
宠物中心信息管理系统app是在安卓操作系统下的应用平台。为防止出现兼容性及稳定性问题，编辑器选择的是Hbuildex，安卓APP与后台服务端之间的数据存储主要通过MySQL。用户在使用应用时产生的数据通过 python等语言传递给数据库。通过此方式促进宠物中心信…
uniapp ui库 px 转 rpx
项目最层新建pxToRpx.js
yarn add postcss --save-dev
pxToRpx.js的代码const postcss require(postcss);module.exports postcss.plugin(postcss-px2rpx, function(opts) {opts opts || {};var timesBigger opts.times || 2;return function(root) {root.walkDecls(dec…
uniapp 离线本地打包
uniapp打包教程地址
https://nativesupport.dcloud.net.cn/AppDocs/usesdk/android.html点击查看
需要的环境：
java (1.8)离线SDK(上面的连接下载即可)Android Studio（同上）
配置环境变量
依次点击“计算机”－“属性”&#…
将小程序代码转成uni-app代码
最近因为公司项目原因需要将小程序的项目转换成uni—app的项目，所以总结了以下几点： 首先你可以先到uni-app的官网简单看一下对它的介绍，本次文章的介绍是针对简单的微信小程序来进行的转化。
在这之前我们来看一下目录对比 下面就来介绍一下…
【uni-app】condition 启动模式配置，生产环境无效，仅开发期间生效
在小程序开发过程中，每次代码修改后，都会启动到首页，有时非常不方便，为了更高效的开发，有时需要模拟直接跳转到指定的页面， 操作方法如下： 在pages.joson里面配置下列代码：
"…
Uniapp + SpringBoot 开发微信H5项目 微信公众号授权登录 JAVA后台（一、配置使用微信公众平台测试公众号）
申请测试号进行调试开发，测试号拥有大部分服务号有的接口权限。
一、接口配置信息填写校验
这里需要填写一个URL和一个Token验证字符串 我这里是用了natapp内网穿透 将本地的后台8080端口服务映射到了 http://x7zws8.natappfree.cc https://natapp.cn/在natapp官网…
uni app 微信小程序微信支付
使用方法 接口传参 使用wx.requestPayment方法是一个统一各平台的客户端支付API，不管是在某家小程序还是在App中，客户端均使用本API调用支付
uniapp让输入框保持聚焦状态，不会失去焦点
使用场景：当输入框还有发送按钮的时候，点击发送希望软键盘不消失，还可以继续输入，或者避免因输入图片标签造成的屏闪问题
多次尝试后发现一个很实用的方法，适用input输入框和editor输入框
解决办法：把cli…
springboot、vue、uniapp项目的部署和运行（超链接可直接跳过去）
springboot、vue项目环境配置
1、首先要安装jdk、maven、mysql、nodejs
软件安装
2、安装idea、HbuilderX、navicat
运行项目
3、运行springboot项目、运行vue项目、运行uniapp项目
uniapp开发DAPP钱包应用(一) 环境搭建 Vue+ MetaMask + ABI.json
上几节我们讲了如何通过Java后端完成链上交易、信息查询、以及如何使用web3插件实现开发自测。
这一节，我们来说说前端DAPP的开发实现。
1. MeteMask 🪜Java对接（BSC）币安链 | BNB与BEP20的开发实践（三）水…
【uni-app】运行环境判断与跨端兼容
（1）开发环境和生产环境 uni-app 可通过 process.env.NODE_ENV 判断当前环境是开发环境还是生产环境，一般用于连接测试服务器或生产服务器的动态切换。 在HBuilderX 中，点击「运行」编译出来的代码是开发环境，点击「发行…
uniapp—day02
个人名片： 😊作者简介：一名大二在校生 🤡 个人主页：坠入暮云间x 🐼座右铭：给自己一个梦想，给世界一个惊喜。 🎅**学习目标: 坚持每一次的学习打卡 文章目录 WXML 和HTML区…
Uniapp Vue2 image src动态绑定static目录下的图片
报错的static地址写法： this.url ../static/img.png this.url /static/img.png
正确的static地址写法： this.url /static/img.png
动态绑定
<image :src"url"></image>
Uni-app开发入门：跨平台应用开发指南
1. 什么是Uni-app？
Uni-app是一个基于Vue.js的跨平台应用开发框架，允许开发者使用一套代码同时构建iOS、Android、H5以及小程序等多个平台的应用。通过Uni-app，开发者可以大大提高开发效率，降低维护成本。
2. Uni-app的特点
跨…
uniapp实现点击选项跳转到应用商店进行下载
uni-app 中如何打开外部应用，如：浏览器、淘宝、AppStore、QQ等
https://ask.dcloud.net.cn/article/35621
Android唤起应用商店并跳转到应用详情页
兼容处理多个应用商店的情况 https://juejin.cn/post/6896399353301516295
如何查看market://detail…
uniapp手机号一键登录
uniapp手机号一键登录，先写个button
<button class"phone" open-type"getPhoneNumber" getphonenumber"getPhoneNumber">手机号一键登录</button>
先在onload钩子获取临时code码
onLoad() {uni.login({provider: weix…
基于uniapp的旅游景点入园预约系统 微信小程序0220o
技术要求： a) 操作系统：Windows、Linux等； b) 开发工具：Android Studio、pycharm等； c) 数据库：Oracle、MySQL等； d) 开发语言：python； e) 技术框架：采用MVC模…
uniapp 自动更新版本并安装
首先 我们在app打包的时候回去设置版本号，用来了解当前版本具体更新了哪些功能；所以在app更新的时候，首先去获取我们的版本号；
App.vue
onLaunch: function() {console.info(plus.runtime.appid,plus.runtime.appid)plus.runtim…
uniapp html变量 直接输出html
在uniapp中，如果你想要直接输出HTML变量的内容，你可以使用v-html指令来实现。这个指令会将绑定的变量中的HTML代码渲染成真实的HTML元素。
以下是一个简单的例子： <template> <view> <view v-html"rawHtml"&…
微信小程序uniapp+django+python的酒店民宿预订系统ea9i3
Android的民宿预订系统设计的目的是为用户提供民宿客房、公告信息等方面的平台。 与PC端应用程序相比，Android的民宿预订系统的设计主要面向于民宿，旨在为管理员和用户、商家提供一个Android的民宿预订系统。用户可以通过Android及时查看民宿客房等。 An…
【项目实战】SpringBoot+uniapp+uview2打造一个企业黑红名单吐槽小程序
避坑宝 v1.0.0 基于SpringBootuniapp企业黑红名单吐槽小程序 📚项目介绍
避坑宝
【避坑宝】企业黑红名单吐槽小程序是一个具有吐槽发布企业信息的一个平台，言论自由，评判自定，便于我们打工人分辨企业好坏。技术栈基于SpringBoot…
![uniapp报错：[获取文件失败] 以下文件已被配置忽略打包上传，模拟器无法获取...](https://img-blog.csdnimg.cn/direct/247b91133e624de4943fd0934682c8a7.png)
uniapp报错：[获取文件失败] 以下文件已被配置忽略打包上传，模拟器无法获取...
uniapp分包控制台报错： Error: module ‘pagesMember/address/address.js’ is not defined, require args is ‘pagesMember/address/address.js’ 以及 [获取文件失败] 以下文件已被配置忽略打包上传，模拟器无法获取： pagesMember/address/…
uni-app设置页面整体背景颜色为渐变色踩坑
page {background: linear-gradient(to bottom, #6295f1, #f7f8fa);}解决方法
page {background: linear-gradient(to bottom, #6295f1, #f7f8fa);height: 100%;}
uni app 打肉肉（打飞机）小游戏
都给老婆和孩子写了 合十 钓鱼了，给自己写个打飞机吧。没找飞机怪兽的图片。就用馒头和肉肉代替了。有问题不要私信我。自己改哈
<template><view class"page_main"><view class"contentone"><canvas class"canvas…
uniapp实现自定义相机
自定义相机起因由于最近用uniapp调用原生相机容易出现闪退问题，找了很多教程又是压缩图片又是优化代码，我表示并没有太大作用!!实现自定义相机使用效果图拓展实现多种自定义相机水印相机身份证相机人像相机起因 由于最近用uniapp调用原生相机容易出现闪退…
Uniapp 反编译成原始代码遇到问题总结-wxml篇
有一次客户把uniapp的源码给丢了，只剩下编译后的小程序，只剩下编译后的代码，客户想要二开，但是又不想多花钱去重写一遍前端代码，就问我能不能反编译一下，我当时就拒绝了，怎么可能？但…
uniapp 开发出现这个 Error in onLoad hook: “SyntaxError: Unexpected end of JSON input“
uniapp 开发出现这个 Error in onLoad hook: “SyntaxError: Unexpected end of JSON input“,这个问题如何解决。
原因：
由于JSON.parse无法识别某些url中的特殊字符比如&等特殊符号造成的。
解决办法：
页面A（JSON.stringify传参&a…
uniapp 跳转返回携带参数（超好用）
天梦星服务平台 (tmxkj.top)https://tmxkj.top/#/
1.返回界面 uni.$emit(enterPeople, this.entryList)uni.navigateBack({delta: 1})
2.返回到的界面（接收数据界面） onShow() {let that thisuni.$on(enterPeople,function(enterPeopledata){console.…
uniapp h5 部署
uniapp 配置 服务器文件路径
打包文件结构
//nginx 配置
server {listen 8300;server_name bfqcwebsiteapp;charset utf-8;#允许跨域请求的域，* 代表所有add_header Access-Control-Allow-Origin *;#允许带上cookie请求add_header Access-Control-Allow-C…
关于uni-app 外部系统联登遇到的坑
由于鄙人用了uni-app的即时通讯，所以用户体系必须同步uni-app那边的。这些操作也必须由自己的服务器来完成，所以需要把uni-app那边的接口进行url化。
uni-app的文档地址：云对象（uni-id-co） | uniCloud
所用的接口为 …
uniapp 写安卓app，运行到手机端 调试
手机 设置》关于手机》点击版本号 4-5次，弹出手机锁屏页面，输入手机锁屏密码 2.手机 设置中 》搜索 开发人员选项 》 调试》打开USB调试 同页面 找到 选择USB配置》选择 MIDIhbuilder 编辑器 点击 》运行》运行到手机或模拟器》运行到Android App基座 》…
uniapp，实时获取系统时间（动态显示）
在开发中，如果涉及到时间有关的，有可能需要把系统的时间以动态的形式展示出来。
一、页面效果 后面的秒钟是会变的，一秒改变一下，也就是说这个就是与系统时间一致的。
二、思路 我们通过new date对象，获取系统的时间…
uniapp兴趣社区交友圈子系统小程序源码 thinkphp框架后台管理
圈子论坛社区系统，含完整的后台PHP系统。功能：小程序授权登陆，H5和APP，手机号登陆，发帖，建圈子、发活动。圈主可置顶推荐帖子，关注、点赞、评论、交流等。可作为圈子贴吧等自媒体。
兴趣社区圈…
uni-app 上传图片无反应 chooseImage失效
1、点击反应都没有
2、输出fail 信息
{"errMsg": "chooseImage:fail api scope is not declared in the privacy agreement", "errno": 112} 提示： 这个是小程序需要更新用户隐私策略
在小程序 微信公众平台 ： 设置-&…
web前端之实现复选功能、repeat
MENU 1、原生实现1.1、html部分1.2、JavaScript部分1.3、css部分1.4、效果图 2、uniApp实现2.1、html部分2.2、JavaScript部分2.3、css部分2.4、效果图 1、原生实现
1.1、html部分
暂时为null，后续会补充。1.2、JavaScript部分
暂时为null，后续会补充…
【uniapp】表单验证不生效的解决方案
表单验证这个常见的功能，明明在element ui等框架已经用的很熟了，在uniapp开发时还是处处碰壁？这篇文章我会提示uni-forms表单验证的几个注意点，帮助大家排查。 示例
下面是一份包含普通验证和自定义验证的示例：
<…
![[Uni-app] 微信小程序的圆环进度条](https://img-blog.csdnimg.cn/direct/1fc0bcdd2d2e4a14bf64fc87509cf7dd.png)
[Uni-app] 微信小程序的圆环进度条
效果图： 组件完整代码如下：
<template><view class"base-style":style"position: relative;width: diameter px;height: diameter px;display: flex;flex-direction: row;background-color: bgColor ;"><!…
uniapp 使用sqlite时无法读取到db文件中的数据
问题 {“code”:-1404,“message”:“android.database.sqlite.SQLiteException: no such table: user (Sqlite code 1): , while compiling: select * from user, (OS error - 2:No such file or directory),http://ask.dcloud.net.cn/article/282”} at pages/index/index.vu…
uniapp、vue2.6、H5，利用腾讯TRTC，快速跑通1v1视频功能
多人视频聊天室搭建，官网已有相关demo和案例，需要快速搭建多人聊天室直接进入以下网站：
实时音视频 Web & H5 (Vue2/Vue3)-视频通话（含 UI）-文档中心-腾讯云说明：https://cloud.tencent.com/document/…
uniapp ios证书失效
前面是按照网上查找的方法 作者大大的地址
1、一个ios账户（688付费版）
2、登录 Apple Developer
3、创建Identifiers
ps：创建时需继承苹果的sdk，只需要一个就行
点击continue再点击Register即可
4、创建.cer证书
&…
婚恋交友系统开发-PHP书写-uniAPP开发-安装环境7.3-数据库5.6-源码交付-支持二开！
一、确定用户需求 在开发婚恋交友小程序之前，我们需要先确定用户的需求。不同的用户群体对于婚恋交友的需求是不同的，因此我们需要针对不同的用户群体进行调研和分析。
例如，有些用户可能更注重交友的乐趣和体验，而有些用户则更注…
uniapp 开发微信小程序 出现启用组件按需注入问题如何解决
问题描述
在使用uniapp 开发微信小程序，进行上架发布时 代码质量栏 出现启用组件按需注入问题。 虽然现实代码上传成功，但是作为一个吹毛求疵的老猿人，肯定是无法容忍的。那么如何解决呢？
问题解决方案
在uniapp端，…
一套.NetCore+Vue+Uniapp前后端分离的低代码快速开发框架
今天给大家推荐一个后端基于.NetCoreVue前后端分离，移动端基于Uniap可发布IOS、Android、小程序、H5框架系统。
项目简介
这是一个基于.Net Core构建的简单、跨平台快速开发框架。前后端封装了上千个常用类，方便扩展；集成了代码生成器&…
uniapp 小程序拍照上传，百度识别人体关键点，显示拖拽元素，生成海报
需求是小程序这边先拍摄露出手腕的照片，然后传给后端，调百度识别的api，根据返回的手腕位置，显示手表的贴图（可以拖拽旋转之类的）最后可以生成海报，保存图片到手机。 前端这边的技术点分别有
调…
JAVA 上门按摩系统源码运营方案？
一、市场分析随着人们对健康生活的越来越重视，按摩行业也得到了迅猛发展，在市场上所占比例不断提高。JAVA 上门按摩系统源码作为一款便利用户掌握技能，小投入大收益的项目，市场前景广阔。二、优势分析1. 便利用户：JAVA…
uni-app:购物车页面--结算区域
把结算区域封装为组件
在 components 目录中，新建 my-settle 结算组件： 初始化 my-settle 组件的基本结构和样式：
<template><!-- 最外层的容器 --><view class"my-settle-container">结算组件</view>
&…
微信小程序 Springboot英语在线学习助手系统 uniapp
四六级助手系统用户端是基于微信小程序端，管理员端是基于web端，本系统是基于java编程语言，mysql数据库，idea开发工具， 系统分为用户和管理员两个角色，其中用户可以注册登陆小程序，查看英语四六级…
【小程序开发】uniapp引入iconfont图标及使用方式
🧊 前言 本文主要讲述的是在使用uniapp中如何引入iconfont图标，以及两种常用的位置。 位置一：App下原生导航栏的按钮使用字体图标。位置二：页面中的任意位置使用iconfont图标。 🌺 正文
第一步：打开iconfo…
【uniapp】uni.request请求跨域问题解决方案
例如，运行H5页面，请求一个地址资源，如果不是本站地址，浏览器就会报跨域错误，这样访问受限
问题呈现
例如，项目代码里是这样写的，运行H5测试
uni.request({url:https://gitcode.net/zs1028/st…
uniapp中调用.net6 webapi
使用uniapp开发程序时，不管是小程序，还是H5界面，它们只是一个显示界面，也就是只充当前台界面，那么我们后台使用.net6 webapi写业务逻辑，然后前端访问后端，即可实现前后端分离开发软件的模式。 …
uniapp - tensorflowjs 之小程序环境集成
一、简介
tensorflowjs（简称 tfjs）是一个用于使用 JavaScript 进行机器学习开发的库。以下是 tfjs 的官网与 github 仓库：
官网：https://www.tensorflow.org/js?hlzh-cngithub 仓库：https://github.com/tensorflow/…
uniapp在线升级关联云空间
升级中心 uni-upgrade-center - App： https://ext.dcloud.net.cn/plugin?id4542 App升级中心 uni-upgrade-center文档： https://uniapp.dcloud.net.cn/uniCloud/upgrade-center.html#uni-upgrade-center-app 升级中心 uni-upgrade-center - Admin&#…
uniapp中全局页面挂载组件（小程序，h5）
1.uniapp 自带的 easycom 示例"easycom": {"autoscan": true,"custom": {"^xxx-(.*)": "/components/xxx-$1/index.vue" // 匹配components目录内xxx-**下的vue文件}},文件创建方法 上面的方法挂载后，每个页面需…
uni-app--》如何实现网上购物小程序（中上）？
🏍️作者简介：大家好，我是亦世凡华、渴望知识储备自己的一名在校大学生 🛵个人主页：亦世凡华、 🛺系列专栏：uni-app 🚲座右铭：人生亦可燃烧，亦可腐败…
uniapp 引入插件市场的echart插件，使用指南！+踩坑记录！！血泪史！！！
此文章适用于微信小程序中，在uniapp做的小程序中使用echarts
插件地址：echarts-for-wx - DCloud 插件市场 插件网页往下翻有详细的使用步骤，这里简短的贴上几张图片 以下是我 项目中的使用情况，分享给大家：
1.一键导…
uniapp+uview2.0实现表单校验实战
表单提交是很常见的功能,本文基于uniappuview2.0实现表单常见属性校验处理,使用到组件有u–form、Form-item，基本使用说明如下： u–form 此组件一般是用于表单验证使用，每一个表单域由一个u-form-item组成，表单域中可以放置u-…
uniapp连接蓝牙设备
公司做的项目有需要连接第三方的蓝牙设备，要求Android、IOS都要连接这台蓝牙设备，然后去识别NFC标签。
那个设备是德科物联的，DK309的设备，在这记录一下开发的过程。
首先呢，去了解了一下蓝牙设备的一些基础知识&…
uniapp 使用摄像头 live-pusher （APP）
前因：公司需求需要类似于微信小程序camera 类似的功能，但是uniapp并没有相应的组件，由于开发周期相对较短，暂时放弃使用iOS与android原生开发。凑巧之前做过类似直播的功能，所以就想起来使用live-pusher来调用摄像头。…
跨平台应用开发进阶(五十九)：uni-app实现视屏播放小窗功能
文章目录一、前言二、解决方案三、拓展阅读一、前言
在业务功能开发过程中，需要实现视频直播、播放小窗功能。鉴于目前通过接入火山webSDK实现视频直播、点播功能。需要火山协助配合改造实现小窗功能。
uni-app插件市场也提供了若干插件，经试用效果并不…
03_uni_app之ApiIntercept的添加、移除过程
03_uni_app之ApiInterceptor的添加、移除过程一.ApiInterceptor的添加过程 当我们通过uni.addInterceptor(method, interceptor)添加api拦截器时，会依次调用 defineSyncApi("addInterceptor", callback, protocol, undefine)(method, interceptor) wrapp…
uniapp在安卓10+情况下移动文件的解决方案
uniapp在安卓10情况下移动文件的解决方案
首先看一个简单的问题，就是uniapp如何将下载的图片保存到手机本地，直接看下面的代码 const imgUrl https://fanyi-cdn.cdn.bcebos.com/static/translation/img/header/logo_e835568.pnglet dtask plus.downlo…
环信 uni-app Demo升级改造计划——Vue2迁移到Vue3（一）
前言 由于环信uni-app Demo 为早期通过工具从微信小程序转换为的 uni-app 项目，经过实际的使用以及复用反馈，目前已经不适用于当前的开发使用，因此开启了整体升级改造计划，目前一期计划将 vue2 代码进行手动转换为 vue3vite&#…
uniapp系列-超详细教你在uni-app+vue3里通过web-view组件传递信息打开H5页面写入localstorage并解决兼容性
web-view是什么
web-view 是一个 web 浏览器组件，可以用来承载网页的容器，会自动铺满整个页面（nvue 使用需要手动指定宽高）。点击这里直达官网文档点击这里下载我的代码demo本文最下面还有一些常见或者奇怪问题解决方案哦~
为什…
uni-app路由跳转及参数的传参和接收
文章目录 1. uni.navigateTo2.uni.redirectTo3.uni.reLaunch4.uni.switchTab5.uni.navigateBack 1. uni.navigateTo
保留当前页面，跳转到应用内的某个页面，使用uni.navigateTo：
示例：
//在起始页面跳转到test.vue页面并传递参数…
【社区图书馆】Uniapp和Vue的发展史
目录
Vue.js的发展历程
Uniapp的出现
Uniapp与Vue.js的关系 Uniapp是一个基于Vue.js框架的跨平台开发框架，它的出现离不开Vue.js的发展历程。
Vue.js的发展历程
Vue.js是一款由Evan You创建的JavaScript框架，最初在2013年开始开发。随着时间的推移&…
uniapp-腾讯地图自行车路线规划
腾讯地图自行车路线规划
<template><view class""><cu-custom bgColor"bg-gradual-blue" :isBack"true"><block slot"backText">返回</block><block slot"content">自行车骑行路线规划…
uniApp 页面通讯统一解决方案
文章目录 往期回顾统一解决方案uni.on和eventChannel之间的选择如何设置触发器最终范例距离 往期回顾
uniapp 踩坑记录 uni.$on为什么不能修改data里面的数据
uniApp页面通讯大汇总，如何页面之间传值
统一解决方案
uni.on和eventChannel之间的选择
uni.on和eve…
uni-app加载HTML网页
加载HTML内容
v-html：更新元素的 innerHTML
<view v-html"html"></view>
注意：
内容按普通 HTML 插入 - 不会作为 Vue 模板进行编译。如果试图使用 v-html 组合模板，可以重新考虑是否通过使用组件来替代。App端和H…
UNIAPP实战项目笔记64 当前用户修改收货地址的前端和后端
UNIAPP实战项目笔记64 当前用户修改收货地址的前端和后端
思路 默认地址的修改，先清空当前id下的所有默认地址，再将新地址设为默认 前端 将新值传给后端 后端接受值后更新处理 实例截图 代码
后端 index.js
var express require(express);
var route…
前端开发中，定位bug的几种常用方法
目录
第一章 前言
第二章 解决bug的方法
2.1 百度
2.2 有道翻译
2.3 debugger
2.4 console.log 日志打印
2.5 请求体是否携带参数
2.6 注释页面渲染代码
2.7 其他
第三章 尾声 备注：该文章只是本人在工作/学习中常用的几种方法，如果有不对大家…
微信小程序项目转uniapp
安装miniprogram-to-uniapp
npm i miniprogram-to-uniapp -g
转换原生小程序 (可以先把node_modules先删掉 转换好后 在npm i 否则一些包会转换不成功,注意不支持vant)
wtu -i E:\项目\原生小程序\项目\项目名称
运行完成后会在源目录上产生一个 项目_uni的项目
例如转换完…
UNIAPP实战项目笔记39 我的页面布局
UNIAPP实战项目笔记39 我的页面布局
my.vue 我的页面布局 具体图片自己替换哈，随便找了个图片的做示例 代码 pages.json部分 去掉默认导航栏，改为自定义导航栏 ,{"path" : "pages/my/my","style" : …
uniapp怎么引入vant
uniapp引入vant后，只能微信小程序有效果，我试的H5端不报错，但是没效果，app端没有测 首先创建uniapp项目 在pages文件夹同级创建 wxcomponents 的文件夹 然后下载vant-weapp github地址：https://github.com/youzan/va…
基于golang+uniapp+python 实现的一套A股提醒系统
shareshttps://github.com/xxjwxc/shares
功能 A 股量化交易系统 后台开发语言 Go/Python gmsechttps://github.com/gmsec/gmsec gormt 嵌入，自动数据库代码生成 gorm 自动构建(gormt)https://github.com/xxjwxc/gormt 分时任务,盯盘助手,研报股评,每日监控,微信…
最新最全的JavaScript入门视频，包含小程序和uniapp相关的JavaScript知识学习
写在前面
我们学习JavaScript不仅可以用于web网站开发，也可以用于小程序，uniapp项目的开发，所以我们学习JavaScript很重要。
准备工作
我们这里学习JavaScript用的是小程序开发者工具或者uniapp开发者工具，所以需要你先装好这两…
uniapp实战仿写网易云音乐(二)—promise接口请求的封装和主页功能的实现，组件封装
文章目录前言promise请求接口的封装主入口功能的实现：推荐歌单模块新碟新歌模块精选视频模块最后前言
本篇文章继续完成上篇文章的部分，主要实现prromise接口的封装和首页主入口的实现
promise请求接口的封装
在上篇文章中请求我们是这样写的…
用uniapp实现teb切换
1.html
<view><!-- tab栏切换动态改变激活样式 --><view class"nav"><view class"nav-list" v-for"(item,index) in list" :key"item.id" tap"changeAct(item)"><!-- 激活样式名字是红色 判断a…
【uniapp】uniapp使用高德地图定位打包成安卓app的一些记录，比如打包后定位失效、
提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档 文章目录前言一、创建你的uniapp1.打开Dcloud开发者后台2.下载你的证书、获取你的SHA1安全码、证书私钥密码二、打开高德开放平台申请key1.打开官网2.创建一个应用三、在unia…
(七)、首页列表数据渲染【uniapp+uinicloud多用户社区博客实战项目(完整开发文档-从零到完整项目)】
1，获取首页列表数据
1.1在index页面中编写从数据库中获取首页列表数据的方法 //获取首页列表数据getData() {let artTemp db.collection("quanzi_articles").getTemp();let userTemp db.collection("uni-id-users").field("_id,usernam…
uni-app实战教程
一、准备
下载HBuilderX编辑器，前往下载注册百度AI账号，创建应用获得Appid和Secret 前往注册百度AI通用物体识别文档 前往查阅Uni-App文档 前往查阅HTML5 文档 前往查阅HTML5文档 前往查阅
二、介绍
开发工具：HBuilderX跨段框架࿰…
uniapp 实时定位（高德、后台运行、支持息屏、坐标转换、距离计算） Ba-LocationAMap
简介（下载地址）
Ba-LocationAMap 是一款基于高德的定位插件。支持实时定位、后台运行、息屏运行等；支持逆地理地址信息；支持坐标转换；支持坐标转换；支持距离计算；支持电池优化白名单。
本插件…
uniCloud云开发----7、uniapp通过uni-swiper-dot实现轮播图
uniapp通过uni-swiper-dot实现轮播图前言效果图1、官网实现的效果2、需求中使用到的效果图官网提供的效果图源码1、html部分2、js部分3、css部分根据需求调整轮播图前言
uni-swiper-dot.文档 uni-swiper-dot 轮播图指示点 - DCloud 插件市场 本次展示根据需求制作的和官网用到…
uniapp实现上传语音的原理
当今移动互联网时代，语音上传已经成为了一个常见的需求。在uniapp中，我们可以通过uniapp提供的uniRecorder录音插件来实现语音上传的功能。本篇博客将介绍uniapp实现上传语音的原理和具体实现方法。
uniapp实现上传语音的原理
uniapp实现上传语音的原理…
uniapp用户签名
目录 第一章 使用到uniapp的api
1.1 uni.createCanvasContext(canvasId, this)
1.2 uni.getSystemInfo() 1.3 uni.canvasToTempFilePath(object, component) 1.4 uni.uploadFile(object)
第二章 具体步骤
2.1 第一步：签名结构
2.2 第二步：签名样式 …
UNIAPP实战项目笔记70 购物车删除商品的前后端交互
UNIAPP实战项目笔记70 购物车删除商品的前后端交互
思路 需要用到vuex 传id值到后端,删除指定id购物车数据 案例截图 购物车商品编辑页面 代码
后端代码 index.js
var express require(express);
var router express.Router();
var connection require(../db/sql.js);
va…
UNIAPP实战项目笔记69 订单确认时显示为默认地址
UNIAPP实战项目笔记69 订单确认时显示为默认地址
思路 需要用到vuex 默认显示isDefault为1的地址 案例截图 订单结算页面 地址页面 代码
shopcart.vue <template><view class"shop-cart"><template v-if" list.length > 0 "><!-…
Threejs进阶之十四：在uniapp中使用threejs创建三维图形
在uniapp中使用threejs 一、uni-app介绍二、新建uni-app项目三、安装three.js库四、在vue组件中引入three.js库五、创建场景(Scene)和相机(Camera)六、创建渲染器(Renderer)七、创建物体和灯光八、渲染场景(Scene)九、运行测试核心代码 一、uni-app介绍
uni-app是一个基于Vue.…
uni-app 如何处理404/怎么自定义访问不存在的页面
前言
uni-app若依移动版
怎么会遇到不存在的页面？
1，过了N天后，分享链接所对应的页面不存在了。当再次访问该分享链接时，会遇到不存在的页面。H5、小程序均会遇到此情况。 2，熟悉网络知识的用户，伪造一个…
uni-app本地存储
文章目录 概要一，存储数据二，获取数据三，移除数据技术细节小结 概要
大家好，今天和大家分享一下uni-app中的本地存储，其中分为同步和异步，有些朋友可能也在这两个概念中迷惑过，下面我们就来讲讲…
【Uni-app 引入海康h5player并接入ws视频流】
uni-app 海康h5player接入ws视频流 内容简介 采用uni-app中的renderjs 引入海康H5 SDK 后端接入海康综合安防平台的开放API获取预览流 海康H5 SDK 下载地址
接入原因 因在移动端接入不管是hls flv rtsp rtmp流的播放稳定性和速度均很慢，特采用ws直连流来播放&#…
HBuilder开发uniapp添加android的模拟器的方法
我们知道使用uniapp开发多端app非常方便，开发过程中的模拟器也可以提高我们测试代码的效率。但我们按uniapp官网的方法，上google的官网下载模拟器，往往非常不方便。
下面我们来看一下使用其他模拟器的方法。
我们知道android开发中…
基于uniapp开发的zblog多端小程序源码
☑️ 品牌：uniapp ☑️ 语言：vue ☑️ 类型：文章资讯博客 ☑️ 支持：小程序 🎉有需要的朋友记得关赞评，底部免费获取！！！ 🎉
✨ 源码介绍 基于uniapp开发的zb…
uni-app 使用 Uview2.x 搭建自定义tabbar组件，自定义navbar，还会解决自定义导航栏引起闪烁性能差的问题！！！
pages.json 上面可以看到tabbar我使用的原生的，但是值配置了pagepath，并且page里三个首页都可以自定义顶部导航栏，当然如果删掉custom那一行代码，就切换成原生顶部导航栏了。
下面拿一个首页作为代码演示：（…
【翻译一下官方文档】之uniapp的.sync修饰符
先用一个案例引出.sync修饰符
就是这样一个场景 父组件直接修改状态A当然没问题，但是子组件不能直接修改状态A，因为单向数据流限制
单向数据流
uni-app官网 所有的 prop 都使得其父子 prop 之间形成了一个单向下行绑定：父级 prop 的更新会…
【翻译一下官方文档】之uniapp的网络请求
uni.request(OBJECT) 发起网络请求。 参数名类型必填默认值说明平台差异说明urlString是开发者服务器接口地址dataObject/String/ArrayBuffer否请求的参数App 3.3.7 以下不支持 ArrayBuffer 类型headerObject否设置请求的 header，header 中不能设置 RefererApp、H5…
uniapp 开发小程序——点击预览文件
1、问题描述：
点击文字-打开文件进行预览：
2、解决：
使用uni.openDocument 新开页面打开文档，支持格式：doc, xls, ppt, pdf, docx, xlsx, pptx。
<view class"formwork" click"openFile()"…
uni-app小程序uni.navigateBack返回上一个页面并传递参数.返回上个页面并刷新
返回上一个打开的页面并传递一个参数。有种办法就是使用 假如从B页面返回A页面：
var pages getCurrentPages();
var prevPage pages[pages.length - 2]; //上一个页面
prevPage.setData({
mdata:1
})经过测试，在uni.app中使用B页面使用setData设置A页…
什么是uni-app？为什么要学习uni-app？
文章目录
前言
一、什么是uni-app框架？
二、为什么要学？
三、uni-app开发的适用场景是什么？
总结 前言 随着前端技术的不断发展进步，跨端开发成为了程序猿不得不面临的一个难题，uni-app的出现解决了程序猿不断重复…
uni-app之使用App.vue全局文件的教学
在 UniApp 中，App.vue 是整个应用的入口文件，它可以作为一个全局文件，在其中定义的数据、方法和生命周期钩子可以在整个应用中使用。这篇文章将向您介绍如何使用 App.vue 文件来实现全局信息的共享和管理。
步骤： 创建 App.vue 文…
新星计划 uni-app 学习2
uni-app 学习资料：uni-app官网
教程地址：uni-app官网
官方给的很多视频地址，省的自己找。
前一阵子在apicloud群里吃瓜，该平台不再指出svn管理项目，集中到开发的ide里设置git，还有一个用友割韭菜。看官网…
UniApp原生插件制作
参考1：UniApp官网-原生插件开发
参考2：uniapp Android 原生插件开发
一、下载安装Android Studio
本部分不在赘述
二、下载UniApp离线SDK
下载地址：Android 离线SDK - 正式版 | uni小程序SDK
三、解压下载文件，并导入Androi…
1，uniapp功能之—NFC
在根目录的static中新建nfc.js文件 nfc.js
var NfcAdapter;
export default {// 初始化NFCNFCInit() {try {let main2 plus.android.runtimeMainActivity();let Intent plus.android.importClass(android.content.Intent);let Activity plus.android.importClass(android.a…
微信小程序一键登录功能，使用uni-app和springboot（JWT鉴权）
目录
概述
微信登录接口说明 关于获取微信用户的信息
前端代码（uni-app）
后端代码（SpringBoot）
配置文件：application.yml
配置文件：Pom.xml
类：WeChatModel 类：WeChatSe…
uni-app实现高效预览多图base64
/*** description 预览多图，解决官方转换时间过长很低效问题* param {Object} _t 上下文* param {Object} imgList 要预览的图片列表[{ base64: ... }]* param {Object} preImgList 存储图片本地路径的指针 ["/_img/yue.png", ""] 注意-这个参…
uni-app路由配置使用和页面跳转传参
uni-app路由配置使用和页面跳转传参
uni-app路由配置使用和页面跳转传参 文章目录 uni-app路由配置使用和页面跳转传参前言一、组件式路由跳转传参二、函数式路由跳转传参总结 前言
UNI-APP学习系列之路由配置使用和页面跳转传参 一、组件式路由跳转传参 组件式路由跳转 示例…
uniapp sqlite数据库封装设计总结（完结篇）
文章目录 往期回顾最新封装代码数据库js封装示例如何使用前期准备 数据库操作再封装封装代码测试结果 总结：多次封装的有点 往期回顾
uniapp sqlite 数据库操作封装 uniapp sqlLite 数据库操作封装 2：如何面向对象操作数据库 uniapp sqlite3 时间查询
…
uniApp页面通讯大汇总，如何页面之间传值
文章目录 往期回顾页面通讯出现场景通讯方案通讯方案小结 如何父传子页面跳转时序图 uni.\$on和eventChannel.on使用推荐 往期回顾
uniapp 踩坑记录 uni.$on为什么不能修改data里面的数据
页面通讯
出现场景
我们在一个页面往另一个页面跳转的时候，希望跳转的页…
hbuilderX uni-app 自定义快捷键无效、无法生效解决方法（附：好用的常用的快捷键自定义代码片段）
在最后加上 ,"override": true 才能让原有默认的快捷键被覆盖 好用的常用的快捷键自定义代码片段
[//打开快捷键设置{"key": "altshiftk","command": "workbench.action.openGlobalKeybindings","override": tr…
uniapp：给大家分享一个自定义侧滑样例
首先看html,分为两部分，主体内容部分和功能部分，功能部分在css中定位到主体部分的右边
<view class"section" ref"box_center" touchstart"drawStart" touchmove"drawMove($event)"touchend"drawEnd($…
Uniapp uni-app学习与快速上手
个人开源uni-app开源项目地址：准备中 在线展示项目地址：准备中
什么是uni-app
uni，读 you ni，是统一的意思。
Dcloud即数字天堂(北京)网络技术有限公司是W3C成员及HTML5中国产业联盟发起单位，致力于推进HTML5发展构…
uniapp打包ios保姆式教程【最新】
uniapp打包 打包方式ios打包一、前往官网登录二、添加证书 三、添加标识符(Identifiers)四、添加安装ios测试机(Devices)五、获取证书profile文件六、生成并下载p12文件七、开始打包 打包方式 安卓打包直接使用公共测试证书即可打包成功，简单方便，这里我…
uni-app 手电筒打开和关闭
手电筒的打开与关闭,话不多说直接上代码 打开
onTorch() {try {var os plus.os.name;if (iOS os) {var device plus.ios.invoke(AVCaptureDevice, defaultDeviceWithMediaType:, vide);plus.ios.invoke(device, lockForConfiguration:, null);plus.ios.invoke(device, setT…
前端Vue仿滴滴打车百度地图定位查找附近出租车或门店信息(更新版)
前端vue仿滴滴打车百度地图定位查找附近出租车或门店信息, 下载完整代码请访问uni-app插件市场地址:https://ext.dcloud.net.cn/plugin?id12982
效果图如下: #
#### 使用方法
使用方法
<!-- 官方文档： https://dafrok.github.io/vue-baidu-map/#/zh/start/b…
【uniapp 开发小程序】购物车功能，实现全选、反选、单选、计算总价
小程序购物车功能：
<template><view><view class"goodlistItem" v-for"(item,index) in goodList" :keyindex><view class"group"><checkbox-group change"changeitem(item)" checked class&q…
uni-app 微信小程序 onReachBottom 不生效
问题描述： uni-app 微信小程序，页面滑到底部，onReachBottom 没有生效
解决： 最外层容器设置 min-height: 101vh
代码： pages.json 配置
{"path": "","style": { "navigationBar…
前端Vue自定义简单实用中国省市区三级联动选择器
前端Vue自定义简单实用中国省市区三级联动选择器， 请访问uni-app插件市场地址：https://ext.dcloud.net.cn/plugin?id13118
效果图如下： #### 使用方法
使用方法
<!-- themeColor:主题颜色 ref:设置唯一ref pickerValueDefault:默认选择…
uniapp uView2 字体加载错误提示处理（字体离线方案）
最近老是收到有人反馈 uView2的字体图标报错，具体错误提示如下图 这个报错的原因有2种情况
at.licdn.com 网站维护，无法加载；国内这些小程序平台的开发工具日常抽风，代码能跑，但就是报错，简直离谱&#x…
uni-app之表单组件教程玩转交互式表单
在UniApp中，表单组件是构建用户交互的重要元素。本教程将详细介绍UniApp中的各种表单子组件，包括(button、checkbox、editor、form、input、label、picker、picker-view、radio、slider、switch和textarea)，并提供详细的示例代码。 1. button…
【前端技术】uni-app 01：快速开始
开个新坑，学习一下 uni-app，之后也想 uni-app 来做些事，虽然我主业是后端，但 uni-app 其作为一个高效生产力工具，个人认为非常有必要学习一下~ 目录
1 uni-app 介绍
1.1 uni-app 由来
1.2 为什么选择 uni-app
1.3 …
uniapp m3u8格式视频加载
uniapp一：mui-player：三方 h5 web app
uniapp 使用 mui-player 插件播放 m3u8/flv 视频流_翘翘红的博客-CSDN博客
uniapp 开发的h5项目，需要播放m3u8/flv后缀的视频，网上有很多视频插件，但是样式和效果不尽如人意&…
前端Vue自定义地址展示地址选择地址管理组件
前端Vue自定义地址展示地址选择地址管理组件， 下载完整代码请访问uni-app插件市场地址：https://ext.dcloud.net.cn/plugin?id13181
效果图如下： # cc-addressBox
#### 使用方法
使用方法
<!-- addressItem：地址条目数据 c…
uniapp 自定义发行 动态修改 manifest.json
这边需求是：根据不同的打包环境 设置不同的标题以及路径。方便各种调试。防止 每次手动每次修改 manifest.json 出错 uniapp 自定义发行: 添加自定义发行之后 Hbuilder 编辑器会自动多 出来按钮： 官方文档：概述 | uni-app官网 我这里的配置是…
uni-app伴生ui组件库uni-ui基础引入使用方法
可能很多人会用uni-app时还在想用vue的伴生ui element ui 但其实我觉得element ui 在PC端虽然效果不错 但在跨端 的开发中甚至不然用vant ui 那么我们今天要介绍的是uni-app官方提供的ui组件库uni-ui
首先我们访问网址 https://ext.dcloud.net.cn/search?q
然后在插件市场的…
【uniapp微信小程序footer】不满一屏固定显示在底部，超出一屏随页面滚动
<template><view class"wrapper"><view class"main">...</view><view class"footer">xx智慧农场</view></view >
</template>
<style>page {height: 100%;}.wrapper {height: 100%;}.ma…
uniapp graceChecker.js 表单验证
1.新建文件 graceChecker.js
export default {error:,check : function (data, rule){for(var i 0; i < rule.length; i){if (!rule[i].checkType){return true;}if (!rule[i].name) {return true;}if (!rule[i].errorMsg) {return true;}if (!data[rule[i].name]) {this.…
uni-app（android、ios） 使用蓝牙便携式打印机（热敏打印机）
机型等参数
HSPOS点密度：576点/行（8dots/mm，203dpi）接口类型： 蓝牙（Bluetooth2.0，4.0双模，支持Android,IOS）打印方式：图形打印（位图）…
uniapp实现将图片保存到手机相册
最近写的一个需求，将图片压缩上传服务器返回加水印图片地址并且还要在手机相册保存原图和加水印的图片。在此先记录一下保存后台返回加水印的图片。有空再聊一下前端加水印上传并保存在相册。 因为上传图片调用了后台update上传接口后 会返回一个加了水印的图片地址…
uni-app滚动分页 兼容(App 小程序 H5)
因为手机端本身屏幕空间不大 所以大家一般都会选择用滚动分页
首先 我在根目录下创建了一个 api目录 下面创建了一个bookApi.js 其中写了一个请求函数 getBookList 根据当前页 page 和 每页展示多少条 pageSize 获取数据 那么 我的组件代码是这样的
<template><scro…
Uniapp申请APP版应用签名、打包、并在微信开放平台申请移动应用的全流程攻略
一.应用签名申请
1.1 安装jdk, jre, 并设置环境变量
Jdk下载链接
1.2 准备就绪后, 重新打开cmd窗口, 键入Java看是否已正确配置.** 1.3 如已正确配置,则执行以下命令,进行证书生成操作。生成好的证书保存在当前cmd的启动目录下** 证书别名和应用名称可替换成自己的软件名称.…
uniapp 兼容 ios 安全区域兼容多平台的指南
✨求关注~ 😀博客：www.protaos.com 本文将介绍如何在 UniApp 中实现 iOS 安全区域的兼容，以确保应用在不同 iOS 设备上正确显示，并提供跨平台兼容的解决方案。通过本指南，你将学习如何适应 iPhone X 及以上设备的刘海屏…
uniapp+web项目服务器维护缺省页跨端通用
新建index.html 内容如下：
<!DOCTYPE html>
<html style"font-size: 14px"><head><meta charset"utf-8" /><metaname"viewport"content"widthdevice-width,initial-scale1,maximum-scale1,minimum-…
项目使用sqlite
1.sqlite语法学习
官网：https://www.sqlite.org/index.html 菜鸟教程：https://www.runoob.com/sqlite/sqlite-tutorial.html
2.sqlite的封装
module.exports {DBName: name,DBPath: c/path,/*** 打开数据库*/openDB: function() { // 打开数据库retu…
uniapp开发的app打开外部app，使用夜神模拟机测试跳转
<template><div><uni-title title打开外部app></uni-title><div classcontainer><button classbtn type"default" tap"openApp(sunflower)">向日葵远程</button></div><div classcontainer><but…
微信小程序 nodejs+vue+uniapp学科竞赛作品管理系统java+python
每个系统也都将通过计算机进行整体智能化操作，对于基于微信小程序学科竞赛作品管理系统功能所牵扯的数据都是通过用户进行基于微信小程序学科竞赛作品管理系统等相关的数据信息内容、并且可以进行管理员在线处理首页、个人中心、用户管理、教师管理、辅导员管理、作…
uniapp使用uView框架，后端传16位数以上时出现精度缺失的情况
1、使用 json-bigint，失败
2、使用 config 里的 getTask，失败
3、修改 dataType，成功
原因： 通过ajax请求回来的数据在response和preview两种状态显示的是不同的。response中的看到的数据格式其实是字符串（ajax请求…
环信 uni-app-demo 升级改造计划——整体代码重构优化（二）
概述 本次关于 uni-app 代码整体重构工作，基于上一期针对 uni-app 官网 demo 从 vue2 迁移 vue3 框架衍生而来，在迁移过程中有明显感知，目前的项目存在的问题为，项目部分代码风格较为不统一，命名不够规范，注…
微信小程序的webview里的uniapp的h5项目，h5里添加按钮事件回到小程序首页
1.uniapp的h5项目安装插件
npm install --save weixin-js-sdk2.在h5项目里添加事件返回小程序的那个vue页面，导入插件
import wx from weixin-js-sdk3.直接添加点击方法回到小程序首页 //回到小程序首页goHome() {console.log(回到小程序)wx.miniProgram.switchTa…
uni-app+vue3微信小程序切换主题皮肤
思路来源： https://blog.csdn.net/qq_42611074/article/details/128236458 引用store做全局css变量替换；
store.js
import { createStore } from vuexconst store createStore({state: {// default-theme dark-themethemeName: default-theme,themeSt…
【uni-app】uni-app快速入门(含源码)
uni-APP 快速入门前言介绍一、背景二、基础UniAPP 快速入门学习一、UniAPP 介绍（1）什么是 UniAPP ？（2）为什么要选择 UniAPP ？（3）UniAPP 功能框架（4）UniAPP 开…
安卓原生跳转uni-app页面并携带参数
注意：在android studio需配置好离线打包环境
uni-app端，将底下两个方法放入methods nativeJs(successCallback, errorCallback) {return plus.bridge.exec("bridge", "goMainActivity", [plus.bridge.callbackId(typeof successCal…
uniapp sqlLite 数据库操作封装 2：如何面向对象操作数据库
前言
我个人是比较爱鼓捣的一个人，原本是写后端的，但是小公司，没办法，我也会写前端的一些东西。这里说一下我是怎么封装sqlLite数据库和如何写业务逻辑代码的。
Sqlite操作文档 这里感谢这篇博客给的想法 uniapp如何使用sqlite数…
uni-app使用echarts绘制数据可视化图
先打开项目 然后选择 使用命令行窗口打开所在目录(U) 在弹出的终端中输入指令来引入依赖
npm install echarts然后 我们 打开echarts的官网 点击这里这个 示例 找一个自己喜欢的案例点进去 我这里就用一个最简单的吧 代码看着不会乱 将他这个 option中的内容复制出来 然后…
uni-app访问java后端登录，携带参数跳转界面
uni-app访问java后端登录，携带参数跳转界面前言一、访问后端1.request.js2.访问3.获取信息二、带参跳转1.utils2.跳转界面总结前言
uni-app 是一个使用 Vue.js 开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、Web&#x…
uni-app横屏设置
1.官网全局设置
https://uniapp.dcloud.io/collocation/pages?idglobalstyle
"globalStyle": {"pageOrientation": "auto"
}2.某个页面横竖屏设置
在manifest.json中添加配置：
"orientation" : [// 竖屏正方向"p…
(小程序)uniapp调接口完整流程
(小程序)uniapp调接口完整流程 代码：
<script lang"ts" setup>import { ref } from "vue"; const form ref({searchVal: "", });//搜索const searchClick () > {console.log(form.value.searchVal)let data {text: form…
最新v4.2版本CRMEB商城API接口文档标准版前台（二）
CRMEB_标准版前台 crmeb api
基础接口
apple登陆 基本信息
Path： /api/apple_login
Method： POST
接口描述：
请求参数
Headers
参数名称参数值是否必须示例备注Content-Typeapplication/x-www-form-urlencoded是
Body
参数名称参数…
Uniapp底部栏样式修改（通过css放大中间图标）
/*Uniapp底部栏样式修改（中间图标放大）我这边底部栏是五个 中间图标放大*//*样式直接复制到项目的App.vue即可*/.uni-tabbar {
/*.uni-tabbar__item:nth-last-child(3) 修改倒数第三个 也就是中间的图标 我这边底部栏是五个*/.uni-tabbar__item:nth-last…
uniapp 一键登录
官网文档地址https://uniapp.dcloud.net.cn/univerify.html
一、开发前准备
1、需要先开通uni一键登录服务 开通成功后会得到 apiKey、apiSecret。这2个信息，后续需要配置在uniCloud的云函数里。同时注意保密，这2个信息也是计费凭证 2、开通uniCloud服…
uni-app图片列表预览大图
首先确定预览是新写一个页面还是搞一个弹窗，随你，我是新开一个页面的，然后在点击图片准备预览的时候，需要的参数有： 1，当前点击图片的下标， 2，当前点击图片的列表数组 点击的时候将这…
Uniapp - 地图map组件及使用
文章目录 1.引言2.Uniapp介绍3.地图组件简介4.地图组件的基本用法4.1引入地图组件4.2在页面中使用地图组件4.3设置地图的中心点和缩放级别 5.地图组件的高级用法5.1添加标记点5.2添加覆盖物5.3获取用户位置 6总结 1.引言
随着移动互联网的快速发展，地图应用成为了我…
uniapp省市区3级联动组件
picker-region.vue
<template><view><!-- 省市区3级联动组件 --><picker mode"multiSelector" :value"multiIndex" :range"multiArray" change"handleValueChange"columnchange"handleColumnChange"&…
uni-app swiper实现通知上下循环滚动
swiper实现通知上下循环滚动
<template>
<view><swiper circular"true" vertical"true" autoplay"true" interval"3000" duration"1000"
><swiper-item v-for"(item,index) in noticeList"…
uniapp 手写折叠面板展示树形结构
引入弹出层组件
<TreeDataPicker ref"TreedataPicker" selectVal"selectVal" />
打开弹出层组件 this.$refs["TreedataPicker"].open(getorgs);
注意：getorgs 是一个请求方法
弹出层（uni-popup）配…
前端Vue自定义银行卡号格式化组件 中间卡号文本转星号
前端Vue自定义银行卡号格式化组件 中间卡号文本转星号, 下载完整代码请访问uni-app插件市场地址：https://ext.dcloud.net.cn/plugin?id13230
效果图如下: # cc-format-card
#### 使用方法
使用方法
<!-- cardNo:银行卡号 isStar: 是否转星号 -->
<cc…
uniapp封装md5请求加密
要求：要封装一个md5加密的请求头，加密部分：url 问号后面部分和data参数。
签名步骤：
1、 按照参数首字母进行排序, 并拼接为字符串, 并用&链接 2、追加密钥&keyxxxxxxx到字符串(具体加密密钥每个项目不同) 3、把得到的…
uniapp智慧停车场系统微信小程序h5、APP源码 智能停车系统源码 安装搭建部署教程
【APP】: flutter(原生混合框架，不是web封装，原生应用，一套代码直接生成原生Android和ios应用)，既不损失性能，也能降低开发成本 【小程序/h5/公众号】：uni-app(底层框架Vue) 【后台管理】：vue-e…
Uniapp 开发 ①（快速上手）
作者 : SYFStrive 博客首页 : HomePage 📜： 微信小程序 📌：个人社区（欢迎大佬们加入） 👉：社区链接🔗 📌：觉得文章不错可以点点关注 Ǵ…
适用于Uniapp快速开发小程序的5个开源UI框架
随着UniApp愈发流行，支持UniApp的UI组件库就显得更加受欢迎，这里就分享几款支持UniApp的UI组件库。让你跨端应用开发更快速、更高效
TMUI
优质Vue3 TS Pinia Vite跨端组件库,Uni App通用组件库跨端组件库,支持NVUE原生渲染,APP(安卓,IOS),微信小程序,H…
vue框架和uniapp框架区别,前端vue和uniapp哪个好用
uniapp和vue有什么区别？
vue和uni-app的区别如下：1、uni-app可以通过打包实现一套代码多端运行，而vue不行。2、uni-app有自动的框架预载，加载页面的速度更快，vue没有。
3、uniapp使用小程序的标签，vue使用…
前端Vue自定义登录界面切换tabs 账号登录验证码登录模版 支持手机号校验邮箱校验验证码发送
前端Vue自定义登录界面切换tabs 账号登录验证码登录模版 支持手机号校验邮箱校验、验证码发送， 下载完整代码请访问uni-app插件市场地址：https://ext.dcloud.net.cn/plugin?id13298
效果图如下： # cc-loginTabs
#### 使用方法
使用方法
…
前端Vue自定义轮播图swiper 轮播图dot 轮播图指示indicate
前端Vue自定义轮播图swiper 轮播图dot 轮播图指示indicate，下载完整代码请访问uni-app插件市场地址：https://ext.dcloud.net.cn/plugin?id13193 效果图如下:
编辑切换为居中
添加图片注释，不超过 140 字（可选） …
uniapp中小程序的生命周期
一、uni-app应用生命周期
函数名说明onLuaunch当uni-app 初始化完成时触发（全局只触发一次）onShow当 uni-app 启动，或从后台进入前台显示onHide当 uni-app 从前台进入后台onError当 uni-app 报错时触发onUniNViewMessage对 nvue 页面发送的数…
uniapp-ios打包步骤
前置条件：已申请Apple ID并注册Apple Developer Program
一、登录苹果开发者官网
登录：https://developer.apple.com/
点击账户（Account）进行登录，登录成功出现如下页面 二、创建证书、标识符、描述文件等
点击…
使用uniapp开发修改样式无效修改方案
在使用使用uniapp开发修改样式不生效的问题的方法 直接修改css若直接修改没有效使用深度样式修改 ::v-deep >>> //deep如果发现在H5和App修改了有效果而微信开发者工具查看却没有效果则要使用 关于组件样式修改 常用的 uniapp 和 uView 组件 可以使用 //deep 如果是pi…
uni-app数据缓存
异步存缓存
uni.setStorage({key: "键名",data: "值",success:()>{console.log("存储成功");},
})异步取缓存
uni.getStorage({key:"键名",success:(res)>{console.log(res);}
})异步清除指定缓存
uni.removeStorage({key:&q…
微信小程序web-view嵌入uni-app H5页面，通过H5页面跳转企业微信客户聊天窗口如何操作？
1、先找到企业ID和企业微信聊天接入链接
1）找到企业ID，登录 企业微信
https://work.weixin.qq.com/https://work.weixin.qq.com/ 2）找到接入链接 2、开始写H5页面代码
let d {corpId: ww931你挚爱的强哥8dee,//企业微信IDurl: https://…
vue组件的使用及父子组件之间通信
之前了解到vue父子组件之间传值：
父组件传给子组件：通过在页面引用里 传值：
在父组件内引入子组件
<childCompont :parmas"parentParmas"></childCompont>
那么父组件的 parentParmas就会传入子组件内；
子…
uniapp仿浙北惠生活微信小程序
最近给公司写了一个内部微信小程序，功能比较简单，之前是用微信小程序原声写的，一遍看文档一边写，js，wxml，wxcc，json分在不同文件的写法很不习惯，于是花了两天用uniapp重写了一遍&…
前端Vue自定义简单好用商品分类列表组件 侧边栏商品分类组件
前端Vue自定义简单好用商品分类列表组件 侧边栏商品分类组件 ， 下载完整代码请访问uni-app插件市场地址：https://ext.dcloud.net.cn/plugin?id13148
效果图如下： # cc-defineCateList
#### 使用方法
使用方法
<!-- data:商品列表数组…
uni-app scroll-view的滑动事件与子项列表的长按事件的冲突解决
这几天又学习了新的技术，uni-app支持多平台的框架，实现功能的时候发现scroll-view的滑动事件会和子项的长按事件冲突
找了一个不太好的方法，结果浪费了好多时间，
现在发现view有一个touchmove事件（scroll-view的子项…
HBuilderX - uniapp - 运行项目到微信开发者工具 - 提示项目下缺少manifest.json文件
1、有manifest.json的情况下报错，选中项目，右键菜单，重新识别项目类型，再次运行
参考文档： HBuilderX - 项目根目录下缺少manifest.json - 峻宇 - 博客园
2、HBuilderX 运行uniapp到微信开发者工具，提示工…
uniapp中uni.navigateBack()；传参
// B页面let pages getCurrentPages();let prevPage pages[pages.length - 2]; //上一个页面this.lablelist.forEach(el > {if (el.seclect) {object.push(el)}})prevPage.$vm.getParams(object); //重点$vmuni.navigateBack();// A页面
methods: {
getParams(object) {co…
uniapp解决跨域问题
配置：
"proxy": {"/api": {"target": "https://s2.lakala.com","changeOrigin": true,"pathRewrite": {"^/api": "/api"}}} 目标路径
https://s2.lakala.com/api/v3/labs/relat…
PostCSS plugin postcss-uniapp-plugin requires PostCSS 8
最近刚遇到一个奇葩问题。项目开发开发好好的，突然运行就报错了。
Syntax Error: Error: PostCSS plugin postcss-uniapp-plugin requires PostCSS 8.
Migration guide for end-users:
https://github.com/postcss/postcss/wiki/PostCSS-8-for-end-users看错误提示…
uniapp开发的微信小程序之实现转发功能以及页面跳转传递、接收对象
效果图： 转发功能：
<template><view class"container"><button class"share-btn" open-type"share">转发</button></view>
</template><script>
export default {data() {re…
uni-app（跨平台终极解决方案）有感
2014年-2017上半年，博主技术方向在传统PC技术（swing、javafx、c#-winform、wpf）、APP技术（Android、IOS）、Web技术（ASP、JSP、PHP）。 2017下半年-2018上半年，随着多端交互带来的开发…
uniapp使用map组件滑动或者点击实时更新地址
<mapid"maps":latitude"latitude":longitude"longitude"class"map"regionchange"regionChange"tap"onClickMap"></map>regionChange(e) {// 地图中心点坐标this.getCenterLanLat();
},
// 获取当前地…
uniapp h5 web2app 返回上一步退出方法
uniapp h5 web2app 返回上一步退出方法
在app.vue onshow中加入下面方法即可
onShow: function() { document.addEventListener(plusready, function() { var webview plus.webview.currentWebview(); plus.key.addEventListener(backbutton, functio…
uni-app学习笔记
详细请查看官方文档或者b站视频
介绍
uni-app 是一个使用 Vue.js 开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、Web（响应式）、以及各种小程序（微信/支付宝/百度/头条/QQ/钉钉/淘宝）…
uniapp 左右滑动切换页面并切换tab
实现效果如图 要实现底部内部的左右滑动切换带动上方tab栏的切换，并且下方内容要实现纵向滚动 ，所以需要swiper，swiper-item,scroll-view组合使用
tab栏部分
<view class"tabs"><view class"tab_item" v-for&…
uni-app 开发微信小程序 自定义tabBar
pages.js 里面tabBar配置加上"custom": true
"tabBar": {"custom": true,"color": "#8a8a8a","selectedColor": "#198cfb","borderStyle": "black","backgroundColor":…
uni-app在小程序中无法发起网络请求
按照官方的例子配置了网络请求如下
uni.request({url: url, method: POST,data
});发现在network根本没有网络请求，后来查看后台日志发现请求根本没有发出去。
进而定位到应该是uni.request配置的问题。后来查阅文档，尝试添加header如下： u…
uni-app无法启动微信开发者工具，报错，需要打开服务端口
使用uni-app创建项目的之后，想要在微信中运行，报错如下：
14:37:31.783 [微信小程序开发者工具] - initialize
14:37:31.785 [微信小程序开发者工具]
14:37:31.794 [微信小程序开发者工具]
14:37:31.794 [微信小程序开发者工具] [error] IDE …
uniapp 视频默认全屏 播放
在做小程序时，遇到播放视频，希望直接点击视频便全屏播放，uniapp 文档上也有介绍createVideoContext
重要的事情说三遍 this this this，记得createVideoContext第一个参数为video的ID，第二个参数组件实例this
this.vi…
uniapp 创建一个公共的JS方法
在 uni-app 中，可以使用 Vue.js 的 mixin 方法来创建公共的 JavaScript 方法。 例如，在创建一个 mixin 对象并添加一个公共方法： const myMixin {methods: {myMethod() {console.log(Hello from myMethod)}}
}然后，在你的 Vue 组…
uni-app 微信小程序发布时，主包超过2M限制
小程序发布时，提示超过2M，无法通过，此时可以尝试以下几种方法：
1、对图片做压缩
图片尽量放在服务器端，使用的时候，通过URL路径获取，若不得已放在本地时，可以对图片进行压缩&#…
解决uni-app微信小程序底部输入框，键盘弹起时页面整体上移问题
存在问题
做了一个记录页面（类似单方聊天页），输入框在底部；当弹出键盘时，页面整体上移，页面头信息会消失不见
需要实现效果：
比如一个记录页面，需要在键盘弹出时：
底…
uniapp Cannot find module ‘uni-read-pages‘解决方案
npm install uni-simple-router
突然uniapp无法运行启动了
报错
ERROR Error loading vue.config.js: ERROR Error: Cannot find module uni-read-pages
vue.config.js const TransformPages require(uni-read-pages) 找不到
是因为缺少了组件，目的对症下药…
uni-app uni.previewImage预览图片
使用uni.previewImage方法点击图片预览 <!-- 轮播图 --><swiper class"swiper" :circular"true" :indicator-dots"true" :autoplay"true" :interval"3000":duration"1000"><swiper-item v-for&quo…
uniapp修改字体
1.下载字体 2.将字体导入 3.在style中使用font-face注册字体
font-face{font-family:"bulingstyle";src: url(../../static/login/bulingstyle.ttf) format(truetype);
}4.再使用.类名{}来对字体引用
.bulingziti{font-family: bulingstyle;
}5.使用
<view>…
uni-app配置底部导航栏
https://uniapp.dcloud.io/collocation/pages?idtabbar
直接在page.json中进行配置，四个参数均需要配置，所需要的图片必须是英文名字。
{"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.…
uni-app引入阿里巴巴icon在线图标
引入方法采用weex的addRule方法，在这之前要确保在manifest.json中配置好 "app-plus"中的"renderer": "native", "nvueCompiler":"uni-app", //是否启用 uni-app 模式。
使用addRule方法时，fontfamil…
uniapp组件学习
https://uniapp.dcloud.io/component/
视图容器 <view> 基本属性——主要用于指示按钮效果，经常用到的有hover-class"自定义css样式"，点击之后则可将view渲染为自定义样式放开之后再自动复原。 属性名类型默认值说明hover-classStringn…
uniapp蓝牙连接操作详解
初始化蓝牙
openBluetoothAdapter() {uni.openBluetoothAdapter({ //打开蓝牙适配器接口success: (res) > { //已打开},fail: err > { //未打开 uni.showToast({icon: none,title: 查看手机蓝牙是否打开});}})
}开始搜索蓝牙设备
startBluetoothDeviceDiscovery() {uni…
uni-app小程序fixed定位自定义tabBar
pages.json里配置好tabBar "tabBar": { "color": "#fff", "selectedColor": "#f00", "borderStyle": "black", "backgroundColor": "#000", …
uni-app midButton的使用
midButton没有pagePath，需监听点击事件调用API：uni.onTabBarMidButtonTap
官方文档如下注：list必须是偶数 uni.onTabBarMidButtonTap只支持app，所以使用midButton需要跳转的话，记得加上条件判断
pages.json配置如下 …
uni-app跨平台前端框架介绍(终极跨平台解决方案)
1. 移动端跨平台开发方案介绍
(1) 流行框架比较
移动端跨平台方案对比—React Native、weex、Flutter几款移动跨平台App开发框架比较
(2) 框架共同点：每个框架几乎都包含以下特性
使用 HTML5 CSS JavaScript 开发；跨平台重用代码；丰富的…
uniapp获取屏幕宽度时 获取不到移动设备中内容盒子宽度
首先 ：我使用的是uniapp vue3语法： 问题： 我出现这个问题是IOS 设备发现的，data.boxWidth为0 代码： const initCreated () > {const query uni.createSelectorQuery().in(instance.proxy);const el query.select…
uni-app和springboot完成前端后端对称加密解密流程
概述
使用对称加密的方式实现。前端基于crypto-js。uni-app框架中是在uni.request的基础上，在拦截器中处理的。springboot在Filter中完成解密工作。
uni-app
项目中引入crypto-js。
npm install crypto-js加密方法
const SECRET_KEY CryptoJS.enc.Utf8.parse(…
【uniapp使用web-view点击返回报错后返回不了】
问题及解决 问题解决 问题
使用web-view跳转到别人的网站之后点击返回报错，返回不了
解决
使用以下方法
<template><view></view>
</template>
<script>
var wv;//计划创建的webview
export default {onLoad() {// #ifdef APP-PL…
uniapp实现自定义导航内容高度居中（兼容APP端以及小程序端与胶囊对齐）
①效果图如下
1.小程序端与胶囊对齐 2.APP端内容区域居中 注意：上面使用的是colorui里面的自定义导航样式。
②思路：
1.APP端和小程序端走不同的方法，因为小程序端要计算不同屏幕下右侧胶囊的高度。
2.其次最重要的要清晰App端和小程序端…
vue或uniapp使用pdf.js预览
一、先下载稳定版的pdf.js，可以去官网下载 官网下载地址 或 pdf.js包下载(已配置好，无需修改)
二、下载好的pdf.js文件放在public下静态文件里， uniapp是放在 static下静态文件里
三、使用方式 1. vue项目 注意路径 :src"static/pd…
uniapp支付宝微信支付功能实现
大纲： 具体实现逻辑如下： 页面初始化时，通过onLoad方法获取传入的钱包(wallet)信息。 用户输入充值金额，使用watch监听输入值的变化，并更新选中的充值金额选项。判断金额是否大于0，若是小于0，则…
uniapp 微信小程序实现监听屏幕左右滑动实现tab标签切换效果
需求背景： 实际的项目开发之中，有很多所谓的奇葩需求，当工程量相对较大的时候去更换组件会显得特别麻烦和费时。我这次的需求因为某些特殊原因，更换组件后也无法实现需要达到的效果，所以最后只能监听滑动事件ÿ…
【uniapp】原生子窗体subNvue的使用与踩坑
需求
最近接到个需求, 需要在video组件上弹出弹窗, 也就是覆盖video这个原生组件 未播放时, 弹窗可以覆盖, 但是当video播放时, 写的弹窗就覆盖不了了 因为video是原生组件, 层级非常高, 普通标签是覆盖不了的, map标签同理 覆盖原生组件, 官方给出解决办法一. 使用cover-view…
uni-app微信小程序开发自定义select下拉多选内容篇
分享-2023年资深前端进阶：前端登顶之巅-最全面的前端知识点梳理总结
*分享一个使用比较久的🪜 技术框架公司的选型：uni-app uni-ui vue3 vite4 ts 需求分析：微信小程序-uni-ui内容 1、创建一个自定义的下拉，支持多…
uniapp点击输入框时键盘不上推页面
adjust-position设置为false，然后监听键盘的高度赋值给输入框bottom
这里还一个非常重要的地方，在根元素设置touchmove.stop.prevent，这样在ios上页面就不会滚动，不影响其他组件内部滚动
onReady() {// 监听键盘高度变化&#x…
uniapp调查问卷评价功能
我本来用的是uniapp官方提供的组件uni-rate组件，但修改成我想要的样式有点麻烦，于是我就自己手写一个，比用组件简单一点； dom结构
<text class"formTit must">请您对本次活动进行评价</text>
<view cl…
【uniapp】封装一个全局自定义的模态框
【需求描述】 在接口401处，需要实现全局提示并弹出自定义模态框的功能。考虑到uni-app内置的模态框和app原生提示框的自定义能力有限，我决定自行封装全局自定义的模态框，以此为应用程序提供更加统一且个性化的界面。 【效果图】 【封装】 主…
uniapp 运用Promise实现多图片上传
使用业务场景，循环多个图片上传控件，每一个上传到指定字段；
dom结构如下：
<u-form :model"userForm" :rules"rules" ref"uForm" labelWidth"160"> <u-form-item v-for"…
uniapp uni-datetime-picker 日期和光标靠右
如果想在uni-datetime-picker组件中将日期和光标靠右，您可以使用自定义样式来实现。首先，您需要在页面的样式文件中定义一个类，用于定制uni-datetime-picker组件的样式。例如，你可以在App.vue或者页面的样式文件中添加以下代码&am…
uniapp文件下载并预览
大概就是这样的咯，文件展示到页面上，点击文件下载并预览该文件； 通过点击事件handleDownLoad(file.path)，file.path为文件的地址；
<view class"files"><view class"cont" v-for"(…
uniapp 扩展组件 uni-forms 的表单验证之 validateFunction 只响应一次
uniapp 扩展组件 uni-forms 的表单验证之 validateFunction 只响应一次 问题代码官方说明参考资料 问题代码
直接从官方示例中复制过来改的。为了演示
<template><view><uni-forms ref"form" :modelValue"formData" :rules"rules&qu…
uniapp 将标题背景更换背景图片 完美解决（附加源码+实现效果图）
问题描述
今天拿到小程序的设计效果图后，标题部分背景需要加背景图片，以往我做的都是标题背景更换颜色等，加背景图片还是第一次遇到，大家可以先看下我的效果图是否与你遇到的问题一致！ 首页标题的背景是个背景图片。 …
【uniapp 中使用uni-popup阻止左滑退出程序】
在uniapp中，可以使用uni-app插件uni-popup提供的阻止左滑退出程序的功能。具体步骤如下：
安装uni-popup插件：在HBuilderX编辑器中，打开manifest.json文件，找到“dependencies”字段，在其后添加：…
uniapp写一个随时间变化的预约日期列表
const today new Date(); const dateArray []; const dayOfWeekArray []; const yearMonthDayArray []; for (let i 0; i < 7; i) { // 获取时间戳 …
uniapp 使用canvas画海报（微信小程序）
效果展示： 项目要求：点击分享绘制海报，并实现分享到好友，朋友圈，并保存
先实现绘制海报
<view class"data_item" v-for"(item,index) in dataList" :key"index"click"goDet…
uniapp 格式化时间刚刚，几分钟前，几小时前，几天前…
效果如图： 根目录下新建utils文件夹，文件夹下新增js文件，文件内容：
export const filters {dateTimeSub(data) {if (data undefined) {return;}// 传进来的data必须是日期格式，不能是时间戳//将字符串转换成时间格式…
uniapp input输入框placeholder文本右对齐
input输入框placeholder文本右对齐
给input标签加上placeholder-class，这个是给placeholder设置样式，右对齐这就是text-align:right;字体颜色之类依次编辑即可。
uniapp 微信小程序 订阅消息
第一步，需要先去小程序官方挑选一下订阅模板拿到模板id 订阅按钮在头部导航上，所以
<u-navbar :bgColor"bgColor"><view class"u-nav-slot" slot"left" click"goSubscribe"><image :src"g…
微信小程序（原生）和uniapp预览电子文件doc/pdf/ppt/excel等
微信小程序原生预览文件
function previewFile(value) {const fileExtName ${value.ext};const randFile new Date().getTime() fileExtName;uni.showLoading({title: 加载中...})wx.downloadFile({url: value.url, // 文件的本身urlfilePath: wx.env.USER_DATA_PATH / r…
【uniapp 返回顶部】
返回顶部 参数说明示例官方链接 uni.pageScrollTo(OBJECT) 将页面滚动到目标位置。
参数说明
参数名类型必填说明scrollTopNumber否滚动到页面的目标位置（单位px）selectorString否选择器，App、H5、微信小程序2.7.3 、支付宝小程序1.20.0支持…
一键登录是如何在登录方式中脱颖而出的？
首先，我们先了解一下登录方式的演变过程，大致可以分为三个阶段。分别是账号密码登录、短信验证码登录和一键登录。
阶段一：账号密码登录
账号密码登录是一种常见的用户身份验证方式，用户需要输入一个唯一的账号和对应的密码来登…
uniapp使用uCharts及配置格式化
uniapp使用uCharts及配置格式化 祝大家元旦快乐！加油2023~~~ 文章目录uniapp使用uCharts及配置格式化效果图定义需要格式化的数据并配置DemohtmljsscssuCharts效果图 定义需要格式化的数据并配置
在config-ucharts.js内定义您想要的格式化数据 设置对应配置项格式化…
uniapp 开发 APP 使用 web-view 引入H5 app与 h5 页面通信
uniapp 可以同时兼容 APP 和 H5，但有时候有些功能在 APP 中实现不了而在 H5 中可以实现，就可以采用 web-view 的方式在 APP 模式下显示 H5 页面。但是 APP 和 H5 储存的参数是不能共享的，例如token，就涉及到 APP 与 H5 之间的参数…
uniapp微信授权登录
uniapp微信登录之app和微信小程序登录 以下介绍app微信登录和微信小程序登录，其他平台根据需求处理。 欢迎指教~ 文章目录uniapp微信登录之app和微信小程序登录效果图官方文档前提方式一： 常用方式方式二： 结合html5相关方法实现微信小程序直…
学习跨平台移动应用开发必须理解的一些概念
跨平台移动应用开发概念移动应用开发分类Native appWeb appHybrid app三者的区别关于native.js的理解典型跨平台移动APP开发框架H5与H5H5 appH5 appuni-app移动应用开发分类
Native app
即原生APP开发模式，利用iOS、Android开发平台官方提供的开发工具进行APP的开…
uniapp 自定义写底部导航栏
项目的需求是根据用户的权限判断，当前显示哪些菜单。
项目使用uniapp vue3.0
1 根据前端写的项目目录来判断当前返回的路由是否有相同的，因为是数组所以做了封装函数来判断当前的路由数组。
//函数封装
function resArr(arr1, arr2) {const appTabs …
uni-app：实现点击按钮，进行数据累加展示（解决数据过多，导致出错）
效果 代码
核心代码
一、标签显示
<!-- 加载更多 -->
<view class"load_more" v-if"info.length > pageNum * pageSize" tap"loadMore">加载更多
</view> v-if"info.length > pageNum * pageSize"…
web之移动端实现触底和触顶功能、微信小程序、置顶、置底、uniApp、onReachBottom、onPageScroll
文章目录 微信小程序uniApp 微信小程序
触底 /*** 上拉触底事件*/
onReachBottom() {console.log(上拉触底事件触发);
}onReachBottom 监听用户上拉触底事件。 可以在app.json的window选项中或页面配置中设置触发距离onReachBottomDistance。 在触发距离内滑动期间，…
uniapp+vue3项目中使用vant-weapp
创建项目 通过vue-cli命令行创建项目 Vue3/Vite版要求 node 版本^14.18.0 || >16.0.0 uni-app官网 (dcloud.net.cn) npx degit dcloudio/uni-preset-vue#vite my-vue3-project打开项目 点击顶部菜单栏终端/新建终端 执行安装依赖指令 yarn install 或 npm install
安装vant…
【解决】uniapp的全局公共组件(不用在每个页面引入组件标签)，各平台均可使用！！！！
感谢滚动君大佬提供的思路，但是此方法只适用于微信小程序
app端之所以不能用的关键原因在于不能找到resourcePath原始路径，不像小程序会提供一个路径区分哪些文件来自组件哪些文件来自页面，如果不做区分，那么页面栈就会超载&…
uni-app日期选择器
写个简单的日期选择器，还没搞样式，所以有点丑
大概长这样吧 首先是这个picker选择器，mode选择日期，end是写一个范围前日期，:end就是这个日期是动态变化的，还有change函数
<template><view>&l…
uniapp条件编译
uniapp条件编译 uni-app 将已经将可以跨平台兼容处理的组件及 API 等进行了封装，但是部分平台的特性无法跨平台。 由此，uni-app 提供了条件编译的方案，来处理不同平台的特定或差异。 写法
#ifdef： 仅在某平台存在#ifndef…
Uniapp使用腾讯地图并进行标点创建和设置保姆教程
使用Uniapp内置地图 首先我们需要创建一个uniapp项目 首先我们需要创建一个uniapp项目
我们在HBuilder左上角点击文件新建创建一个项目 然后下面这张图的话就是uniapp创建项目过程当中需要注意的一些点和具体的操作 然后我们创建完项目之后进入到项目pages文件夹下ÿ…
uniapp的UI框架组件库——uView
在写uniapp项目时候，官方所推荐的样式库并不能满足日常的需求，也不可能自己去写相应的样式，费时又费力，所以我们一般会去使用第三方的组件库UI，就像vue里我们所熟悉的elementUI组件库一样的道理，在uniapp中…
【uniapp】uniapp使用微信开发者工具制作骨架屏：
文章目录 一、效果：二、过程： 一、效果： 二、过程： 【1】微信开发者工具打开项目，生成骨架屏，将wxml改造为vue页面组件，并放入样式 【2】页面使用骨架屏组件 【3】改造骨架屏（去除…
HbuildX生成安卓签名证书
HbuildX生成安卓签名证书
安装和配置JRE环境
根据此链接安装和配置JRE环境
生成签名证书
keytool -genkey -alias testalias -keyalg RSA -keysize 2048 -validity 36500 -keystore test.keystoretestalias是证书别名，可修改为自己想设置的字符，建议…
探讨uniapp的生命周期问题
在uniapp中,生命周期函数分为应用生命周期函数、页面生命周期函数和组件生命周期函数.
1应用声明周期
应用生命周期函数只能在 App.vue 中监听有效，在其他页监听无效。
onLaunch：当uni-app 初始化完成时触发（全局只触发一次）on…
uniapp开发公众号，微信开发者工具进行本地调试
每次修改完内容都需要发行之后，再查看效果，很麻烦 ！！！ 下述方法，可以一边在uniapp中修改内容，一边在微信开发者工具进行本地调试 修改hosts文件 在最后边添加如下内容 修改前端开发服务端口
…
uniapp 自定义手机顶部状态栏（适配状态栏高度）
开启页面自定义导航栏功能
uniapp 在 pages.json 页面设置了全局的 globalStyle 的 "navigationStyle": "custom" 或单页面的 style 的 "navigationStyle": "custom" 之后页面顶部就没有自带的导航栏了，这时用户可自定义该…
探讨uniapp的navigator 页面跳转问题
navigator 页面跳转。该组件类似HTML中的<a>组件，但只能跳转本地页面。目标页面必须在pages.json中注册。 "tabBar": {"color": "#7A7E83","selectedColor": "#3cc51f","borderStyle": "bl…
Uniapp录音实时回调原生插件-YL-AudioRecorder
YL-AudioRecorder 插件地址：https://ext.dcloud.net.cn/plugin?id14028
升级版 YL-AudioRecorderPlus 支持mp3录制及实时回调：https://ext.dcloud.net.cn/plugin?id14047
插件说明：
由于uni提供的录音管理器uni.getRecorderManager()&am…
uniapp开发（由浅到深）
文章目录 1. 项目构建1.1 脚手架构建1.2 HBuilderX创建 uni-app项目步骤： 2 . 包依赖2.1 uView2.2 使用uni原生ui插件2.3 uni-modules2.4 vuex使用 3.跨平台兼容3.1 条件编译 4.API 使用4.1 正逆参数传递 5. 接口封装6. 多端打包3.1 微信小程序3.2 打包App3.2.1 自有…
uniapp项目如何运行在微信小程序模拟器上
在HbuilderX中的小程序写完后自己一定要保存，否则会出不来效果 那么怎么让uniapp项目运行在微信小程序开发工具中呢 1 在hbuilderx中点击运行到小程序模拟器 2 然后在项目目录中会生成一个文件夹 在微信小程序开发软件中的工具>安全设置>打开端口 或者在微…
uniapp 获取 view 的宽度、高度以及上下左右左边界位置
<view class"cont-box"></view>
/* 获取节点信息的对象 */
getElementRect() {const query uni.createSelectorQuery().in(this);query.select(".cont-box").boundingClientRect(res > {console.log(res);console.log(res.height); // 10…
【Spring Cloud +Vue+UniApp】智慧建筑工地平台源码
智慧工地源码 、智慧工地云平台源码、 智慧建筑源码支持私有化部署，提供SaaS硬件设备运维全套服务。 前言：互联网建筑工地，是将互联网的理念和技术引入建筑工地，从施工现场源头抓起，最大程度的收集人员、安全、环境、材…
uniapp实现自定义上传图片
目录 1、布局样式2、使用uniappAPI（uni.chooseImage）3、解决bug和添加功能3.1 bug13.2 bug23.3 bug33.4 点击图片进行预览3.5 删除图片 4、云函数上传到云存储 1、布局样式
在正式自定义上传前我们先将静态页面搭建好。 样式代码：
<temp…
uniapp-原生地图截屏返回base64-进行画板编辑功能
一、场景
vue写uniapp打包安卓包，实现原生地图截屏（andirod同事做的）-画板编辑功能
实现效果： 二、逻辑步骤简略
1. 由 原生地图nvue部分，回调返回 地图截屏生成的base64 数据，
2. 通过 uni插件市场 im…
uni-app弹窗列表滚动, 弹框下面的内容也跟随滚动解决方案
滑动弹窗里的列表，弹框下面的内容也会跟着滑动，导致弹窗中的列表不能正常滚动 1.弹窗组件代码，需要在最外层的view中加入touchmove.stop.prevent"moveHandle"，且弹窗中需要滚动的列表要使用scroll-view标签包裹起来&…
uniapp----分包
系列文章目录
uniapp-----封装接口
uniapp-----分包 目录 系列文章目录
uniapp-----封装接口
uniapp-----分包
前言
二、使用步骤
1.创建文件
编辑
2.min.js的修改
2.1 subPackages 代码如下（示例）： 2.2 preloadRule 代码如下&am…
【Uni-App】uview 开发多端应用，密码显示隐藏功能不生效问题
出现的问题：
使用uview组件u-input框密码绑定时会出现右侧密码显隐图标不显示的问题
思路：
1.看了下uview源码，发现这有一段注释，我们需要把源码修改一下，问题出在这里 这行代码修改为 :password"password || …
【uni-app】 .sync修饰符与$emit(update:xxx)实现数据双向绑定
最近在看uni-app文档，看到.sync修饰符的时候，觉得很有必要记录一下 其实uni-app是一个基于Vue.js和微信小程序开发框架的跨平台开发工具 所以经常会听到这样的说法，只要你会vue，uni-app就不难上手 在看文档的过程中，发…
uniapp+uview封装小程序请求
提要：
uniapp项目引入uview库 此步骤不再阐述 1.创建环境文件 env.js：
let BASE_URL;if (process.env.NODE_ENV development) {// 开发环境BASE_URL 请求地址;
} else {// 生产环境BASE_URL 请求地址;
}export default BASE_URL;
2.创建请求文件 该…
探讨uniapp的数据缓存问题
异步就是不管保没保存成功，程序都会继续往下执行。同步是等保存成功了，才会执行下面的代码。使用异步，性能会更好；而使用同步，数据会更安全。
1 uni.setStorage(OBJECT)
将数据存储在本地缓存中指定的 key 中&#x…
uniapp的逆地理编码 和地理编码
1.先打开高德地图api找到那个 地理编码 2.封装好我们的请求 3.逆地理编码 和地理编码 都是固定的 记住自己封装的请求 就可以了 这个 是固定的 方式 下面这个是固定的 可以复制过去 getlocation就是uniapp提供的 获取经纬度 然后 下面的 就是高德地图提供的 方法 要想使用我…
Uniapp Syntax Error: Error: Unbalanced delimiter found in string
报错 in ./src/pages/user/components/tasks.vue?vue&typescript&langjs&Syntax Error: Error: Unbalanced delimiter found in string...这边导致文件的原因：可能是条件编译语法不小心删了某个字符，导致不全，无法形成一对。 //…
探讨uniapp的网络通信问题
uni-app 中有很多原生的 API，其中我们经常会用到的肯定有：uni.request(OBJECT) method 有效值
注意：method有效值必须大写，每个平台支持的method有效值不同，详细见下表。 success 返回参数说明
data 数据说明
最终…
Java鹰眼轨迹服务 轻骑小程序 运动健康与社交案例
Java地图专题课 基本API BMapGLLib 地图找房案例 MongoDB 百度地图鹰眼轨迹服务 鹰眼轨迹服务概述 鹰眼是一套轨迹管理服务，提供各端SDK和API供开发者便捷接入，追踪所管理的车辆/人员等运动物体。 基于鹰眼提供的接口和云端服务，开发者可以迅…
uniapp-微信小程序篇
uniapp-微信小程序篇
一、创建项目(以Vue3TS 项目为示例) 可以通过命令行的方式创建也可以通过HBuilderX进行创建（通过HBuilderX创建的项目建议选择最简单的模板），个人建议使用命令行方式。 (1) 命令行方式：
npx degit dcloudio…
UNIAPP中开发企业微信小程序
概述
需求为使用uni-app开发企业微信小程序。希望可以借助现成的uni-app框架，快速开发。遇到的问题是uni-app引入jweixin-1.2.0.js提示异常: Reason: TypeError: Cannot read properties of undefined (reading ‘title’)。本文中描述了如何解决该问题，…
uniapp案例30余种实战项目
uniapp案例30余种实战项目
mpvue框架仿滴滴出行didi-masteruni-app自定义导航栏title-customvue-mpvue-ChatRobot聊天机器人vue-mpvue-ChatRobot-master一款播课类小程序, 基于 mpvue 构建mp-podcast-mpvue-mastermpVue高仿美团小程序教程mpvue-meituan-masteruni-app 二维码生…
uniapp微信小程序区分正式版，开发版，体验版
小程序代码区分是正式版，开发版，还是体验版
通常正式和开发环境需要调用不同域名接口，发布时需要手动更换 或者有些东西不想在正式版显示，只在开发版体验版中显示，也需要去手动隐藏 官方没有明确给出判断环境的方法&a…
uniapp微信小程序消息订阅快速上手
一、微信公众平台小程序开通消息订阅并设置模板 这边的模板id和详细内容后续前后端需要使用
二、uniapp前端
需要是一个button触发 js：
wx.getSetting({success(res){console.log(res)if(res.authSetting[scope.subscribeMessage]){// 业务逻辑}else{uni.request…
uni-app引入sortable列表拖拽，兼容App和H5,拖拽排序。
效果: 拖拽排序 背景：
作为一名前端开发人员，在工作中难免会遇到拖拽功能，分享一个github上一个不错的拖拽js库，能满足我们在项目开发中的需要，下面是我在uniapp中使用SortableJS的使用详细流程；
vue开发…
uniapp中map使用点聚合渲染marker覆盖物
效果如图：
一、什么是点聚合
当地图上需要展示的标记点 marker 过多时，可能会导致界面上 marker 出现压盖，展示不全，并导致整体性能变差。针对此类问题，推出点聚合能力。 点聚合官网教程
二、基本用法
template…
uniapp 上传比较大的视频文件就超时
uni.uploadFile，上传超过10兆左右的文件就报错err：uploadFile:fail timeout，超时 解决： 在manifest.json文件中做超时配置
uni.uploadFile({url: this.action,method: "POST",header: {Authorization: uni.getStorage…
uniapp项目APP云打包步骤
1.打开hbuilder工具，选择uniapp项目，从上方工具中选择发行 2.证书的生成，点击上面的如何生成证书的网址，按照步骤进行生成： 3.结果，点击打开所在目录，点击直接安装到手机，前提是手机…
uniapp开发小程序，上传图片和视频功能
1.需求：
可以上传图片和视频，并且都可以删除，图片可以预览。
2.效果图 3.代码： <template><!-- 上传start --><view style"display: flex; flex-wrap: wrap;"><view class"update-file&quo…
uniapp编写微信小程序遇到的坑总结
1、阻止事件冒泡
使用uniapp开发微信小程序的时候，发现使用click.stop来阻止事件冒泡没有作用，点击了之后发现仍然会触发父组件或者祖先组件的事件。 在网上查阅，发现使用tap.stop才能阻止事件冒泡。
2、二维码生成
在网上找了很多&…
【uniapp】使用permission获取录音权限及实现录音功能
需求
app获取录音权限权限, 实现录音并且播放功能
实现
一. 使用permission获取录音权限
原博 : https://www.wanjunshijie.com/note/uniapp/3203.html
1.1 manifest.json 配置权限 android.permission.RECORD_AUDIO 1.2 permision使用和下载 ( 自行百度搜索即可 )
1.3 获…
uni-app 自定义导航栏
uni-app 自定义导航栏 uni-app 自定义导航栏步骤uni-app 自定义导航栏实例 uni-app 自定义系统导航栏 uni-app 自定义导航栏
uni-app 自定义导航栏步骤
在 uni-app 中，可以通过修改页面的导航栏配置来实现自定义导航栏的效果。以下是实现自定义导航栏的一般步骤&a…
uni-app在组件中内嵌webView，实现自定义webView的大小，并处理页面中有webview时其他元素点击事件失效的问题
uni-app在组件中内嵌webView，实现自定义webView的大小，并处理页面中有webview时其他元素点击事件失效的问题
uni-app在组件中内嵌webView，实现自定义webView的大小
setWebviewTop() {// #ifdef APP-PLUSvar currentWebview this.$scope.$g…
uniapp 开发微信小程序使用echart的dataZoom属性缩放功能不生效！bug记录！
在本项目中使用的是这个echart库
在项目中添加了dataZoom配置项但是不生效，突然想到微信小程序代码大小的限制，之前的echarts.js是定制的，有可能没有加dataZoom组件。故重新定制echarts.js。之前用的echarts版本是5.0.0，这次也是…
uniapp 企业微信侧边栏开发网页授权 注入企业权限 注入应用权限 获取userid（2）
1、网页授权，获取code
代码：
oauthUrl() {const that thisuni.removeStorageSync(code)let REDIRECT_URI encodeURIComponent(window.location.href)let CORPID webConfig.appIdlet url https://open.weixin.qq.com/connect/oauth2/authorize?appi…
uni-app 经验分享，从入门到离职（二）—— tabBar 底部导航栏实战篇
文章目录 📋前言⏬关于专栏 🎯关于小程序 tabbar 的一些知识🎯创建一个基本的 tabBar📝最后 📋前言
这篇文章的内容主题是关于小程序的 tabBar 底部导航栏的入门使用和实战技巧。通过上一篇文章的基础，我们…
uniapp websocket机制 心跳 重连
在开发程序过程中通信功能还是比较常用到的，本文主要介绍的是uniapp中websocket的使用
websocket建立连接后，断开、心跳机制重新链接的一个过程。
关于uni.connectSocket可仔细阅读uniapp官网中的uni.connetSocket以及连接socket创建的实例SocketTask …
uniapp项目-配置store文件夹
1.创建store.js
说明：创建一个新的 Vuex Store 实例，配置 Store 中的模块。
import Vue from vue;
import Vuex from vuex;
// 导入两个 Vuex 模块：moduleCart 和 moduleUser
import moduleCart from /store/cart.js;
import moduleUser fr…
uniapp打包后开屏出现广告
最近的一次打包上线后，安卓端出现了开屏广告，这就比较离谱了，没有改啥，这广告来得莫名其妙，查阅了官方文档后，发现文档太老，也没有及时更新… 咱们在打包时，通常会发现广告这里的【开…
uni-app 打包生成签名Sha1
Android平台打包发布apk应用，需要使用数字证书（.keystore文件）进行签名，用于表明开发者身份。
可以使用JRE环境中的keytool命令生成。以下是windows平台生成证书的方法：
安装JRE环境（推荐使用JRE8环境&am…
uniapp scroll-view横向滚动无效，scroll-view子元素flex布局不生效
要素排查：
1.scroll-x属性需要开启，官方类型是Boolean，实际字符串也行。 2scroll-view标签需要给予一个固定宽度，可以是百分百也可以是固定宽度或者100vw。 3.子元素需要设置display: inline-block（行内块元素&#x…
关于uniapp组件的坑
关于uniapp组件的坑
我有一个组件写的没什么问题,但是报下面这个错误 is not found in path “components/xxx/xxxx” (using by “components/yyy/yyy”)
最后经过排除发现命名需要驼峰命名法
我原本组件命名: 文件夹名 test_tttt 文件名 test_tttt.vue 不行
最后改成文件…
uniapp踩坑合集
1、onPullDownRefresh下拉刷新不生效
pages.json对应的style中enablePullDownRefresh设置为true，开启下拉刷新
{"path" : "pages/list/list","style" :{"navigationBarTitleText": "页面标题名称","enable…
uniapp-滑块验证组件wo-slider
wo-slider是一款支持高度自定义的滑块验证组件，采用uniapp-vue2编写 采用touchstart、touchmove、touchend事件实现的滑块组件,支持H5、微信小程序（其他小程序未试过，可自行尝试）
可到插件市场下载尝试： https://ext.…
uniapp简单版语音播放
mounted() {this.ScanAudio(http://118.178.137.235:88/ipoker.mp3, 3); // 开始播放音频},ScanAudio(url, count) {// 递归终止条件：当循环次数小于等于 0 时，停止递归if (count < 0) return;// 创建内部音频上下文对象var music uni.createInnerAu…
uniapp微信小程序点击右上角菜单分享功能权限配置
个人项目地址： SubTopH前端开发个人站 （自己开发的前端功能和UI组件，一些有趣的小功能，感兴趣的伙伴可以访问，欢迎提出更好的想法，私信沟通，网站属于静态页面） SubTopH前端开发个人站…
uni-app集成mui-player
uni-app集成mui-player，仅说明集成方法，mui-player 相关配置请查看其官网 准备
在uniapp项目根目录新建hybrid目录在hybrid目录下新建html目录在html目录中新建css、js、img等目录，用于存放相关文件
集成
静态webview
在pages目录下新建v…
uni-app 编译报错 Error: pages.json解析失败，不符合 json 规范Unexpected token ‘)‘
问题
使用webstorm开发项目时，打开pages.json习惯性ctrlaltl把代码格式了，然后报错了。
接着使用HBuilder编译，但是一直显示在编译中，完全没有反映。重启编译器与重启电脑都没有用。 没管然后编译报错了。 加上逗号再运行还是报…
【uniapp 监听键盘弹起与收回】
在uniapp中，可以通过使用小程序提供的API来监听键盘弹起与收回。
首先，在页面的onLoad函数中注册监听事件：
onLoad() {uni.onKeyboardHeightChange(this.onKeyboardHeightChange);
},然后，在页面的onUnload函数中取消注册监听事…
uniapp scrollview 滚动最新位置
uniapp 效果是模拟发送聊天信息，需要scrollview在收到新消息时滚动到底部最新的位置
项目是vue2的，代码如下
scrollToBottom(selector) {this.$nextTick(() > {const dom uni.createSelectorQuery().in(this).select(selector)dom.boundingClientR…
uniapp 微信小程序 路由跳转
保留当前页面，跳转到应用内的某个页面，使用uni.navigateBack可以返回到原页面
//在起始页面跳转到test.vue页面并传递参数
uni.navigateTo({url: test?id1&name"lisa"
});
uni.redirectTo(OBJECT)
关闭当前页面，跳转到应用…
uniapp 禁止遮罩层下的页面滚动
使用 touchmove.stop.prevent"toMoveHandle" 事件修饰符
若需要禁止蒙版下的页面滚动，可使用 touchmove.stop.prevent"moveHandle"，moveHandle 可以用来处理 touchmove 的事件，也可以是一个空函数。将这个方法直接丢到弹…
uniapp-form表单
<template><view class"ptb-20 plr-30 bg min100"><view class"bg-white radius-20 pd-30"><view class"bold mt-30 mb-50 size-32">选择方式：</view><u--form labelPosition"left" :mod…
uniapp把城市换成26个字母和城市排序
后端返回的数据 我们要得效果
<template><view><view v-for"(value,key) in cities" :key"key"><view style"color: red;"> {{ key }} </view><view style"border: 1rpx solid black;"><tex…
反编译微信小程序，可导出uniapp或taro项目
微信小程序反编译（全网通用） 微信小程序反编译 反编译主要分为四个阶段 操作流程
1. node.js安装 2. node安装模块 3. 开始反编译 4. 导入到微信开发者工具既可运行
微信小程序反编译 当碰到不会写的小程序功能时，正好看到隔壁小程序有类似…
UniApp 使用命令创建页面的详细指南
系列文章目录 文章目录 系列文章目录前言一、安装Uni-CLI二、创建页面三、页面创建命令四、页面结构五、页面使用总结前言
UniApp是一款跨平台的前端框架，可以用于开发同时运行在多个平台（如微信小程序、H5、App等）的应用程序。本文将详细介绍如何使用命令来在UniApp中创建…
Uniapp当中使用腾讯位置路线规划插件保姆教学
首先我们在使用腾讯地图插件之前我们需要先做几点准备
1：我们需要在腾讯地图位置服务当中注册账号以及在控制台当中创建应用和创建key
这里在创建应用当中应用类型一定要选出行类型，否则后期可能会出现问题。 我们创建完应用之后，点击创建…
uniapp开发小程序-有分类和列表时，进入页面默认选中第一个分类
一、效果：
如下图所示，进入该页面后，默认选中第一个分类，以及第一个分类下的列表数据。
二、代码实现：
关键代码：
进入页面时，默认调用分类的接口，在分类接口里做判断ÿ…
uniapp Vue 使用 sip.js进行语音通话视频通话
下载或者安装 sip.js 到 uniapp 项目，APP 端在 menifest.json 中配置麦克风权限 menifest.json 中 app 权限配置选中： android.permission.RECORD_AUDIO android.permission.MODIFY_AUDIO_SETTINGS
sip.js 低版本 如 V0.13.0 版本的写法
<template&…
uniapp一套代码实现多端运行
一、为何使用uniapp
uni-app 是一个使用 Vue.js 开发所有前端应用的开源框架，开发者编写一套代码，可发布到 iOS、Android、Web（响应式）、以及各种小程序（微信/支付宝/百度/头条/飞书/QQ/快手/钉钉/淘宝）等…
uniapp上传图片 （uni-file-picker）
使用的是uniapp官方文档扩展组件
点击跳转
下面代码中详细参数请点击官方文档查看
<template><view><uni-file-pickerv-model"imageValue" fileMediatype"image" mode"grid"limit"1"select"select"progre…
uniapp 微信小程序：RecorderManager 录音DEMO
uniapp 微信小程序：RecorderManager 录音DEMO 简介index.vue参考资料 简介
使用 RecorderManager 实现录音。及相关的基本操作。（获取文件信息，上传文件） 此图包含Demo中用于上传测试的服务端程序upload.exe，下载后用…
uni-app-微信公众号静默授权
文章目录 前言一、onLoad钩子中调用二、使用步骤截取url中的code 前言
提示：：公司的公众号用户，与后台系统的账号系统做绑定，用以推送消息 公众号自定义菜单直接链接到以下页面，进行静默授权，然后用户输入…
uniapp使用sqlite 数据库
uniapp使用sqlite 数据库
傻瓜式使用方式，按步骤，即可使用。
1.开启sqlite 在项目中manifest.json该文件中配置 2.封装数据库的调用方法
const sqlName "zmyalh" //定义的数据库名称
const sqlPath "_doc/zmyalh.db" //定义数…
uniapp小程序位置信息配置
uniapp 小程序获取当前位置信息报错 报错信息： getLocation:fail the api need to be declared in the requiredPrivateInfos field in app.json/ext.json 需要在manifest.json配置文件中进行配置：
【RuoYi移动端】uniApp导入和引用uView2.0插件
一、打开uiew官网
安装 | uView 2.0 - 全面兼容 nvue 的 uni-app 生态框架 - uni-app UI 框架uView UI，是 uni-app 生态最优秀的 UI 框架，全面的组件和便捷的工具会让您信手拈来，如鱼得水https://uviewui.com/components/install.html 也可直…
基于Android的垃圾分类系统 微信小程序 uniapp
随着网络科技的发展，移动智能终端逐渐走进人们的视线，相关应用越来越广泛，并在人们的日常生活中扮演着越来越重要的角色。因此，关键应用程序的开发成为影响移动智能终端普及的重要因素，设计并开发实用、方便的应用程序…
探讨uniapp的路由与页面生命周期问题
1 首先我们引入页面路由 2 页面生命周期函数
onLoad() {console.log(页面加载)},onShow() {console.log(页面显示)},onReady(){console.log(页面初次显示)},onHide() {console.log(页面隐藏)},onUnload() {console.log(页面卸载)},onBackPress(){console.log(页面返回)}3 页面…
探讨uniapp的组件使用的问题
1 view
Flex是Flexible Box的缩写，意为“弹性布局”，用来为盒状模型提供最大的灵活性。 当设置display: flex后，继续给view等容器组件设置flex-direction:row或column，就可以在该容器内按行或列排布子组件。uni-app推荐使用flex布…
uniapp -- 在组件中拿到pages.json下pages设置navigationBarTitleText这个值？
1:在 pages.json 文件中设置 navigationBarTitleText，例如：
{"pages": [{"path": "pages/home/index","style": {"navigationBarTitleText": "首页",&
Uniapp中vuex的使用
vuex的学习笔记，很多地方还都不是很懂，先记下来再说，比小程序里自带的store复杂很多，看着头大，而且方法里面很多ES6的内容，头都看到爆炸
一、初始化vuex
新建store.js，挂载到main.js
1、在根…
uniapp的H5实现图片长按保存
实现图片预览
使用uniapp的api实现图片预览，可以缩放，关闭等操作
uni.previewImage({urls:[imageUrl],success:()>{this.controllTouch();}
})
imageUrl是图片地址，如https://www.111.com/abc/image.png
urls是字符串数组，…
2023最新任务悬赏平台源码uniapp+Thinkphp新款悬赏任务地推拉新充场游戏试玩源码众人帮威客兼职任务帮任务发布分销机
新款悬赏任务地推拉新充场游戏试玩源码众人帮威客兼职任务帮任务发布分销机制 后端是：thinkphpFastAdmin
前端是：uniapp 1.优化首页推荐店铺模块如有则会显示此模块没有则隐藏。
2修复首页公告，更改首页公告逻辑。（后台添加有公…
uniapp 封装自定义导航栏
简单适配小程序胶囊和APP
首先把要用的API搞一起，封装一手
主要用到两个，设备系统信息和胶囊按钮信息 uni.getSystemInfoSync() uni.getMenuButtonBoundingClientRect() 这里胶囊宽度我是直接用windowWidth减去left // 小程序胶囊/占位宽getMenuButton…
【uniapp】this有时为啥打印的是undefined?（箭头函数修改this）
😉博主：初映CY的前说(前端领域) ,📒本文核心：uniapp中this指向问题 前言：this大家知道是我们当前项目的实例，我们可以在这个this上面拿到我们原型上的全部数据。这个常用在我们在方法中调用其他方法使用。 …
uniapp启动微信小程序开发者工具报错Enable IDE Service (y/N) [27D[27C
下载安装好微信小程序开发者路径 配置好启动路径后
报错[微信小程序开发者工具] ? Enable IDE Service (y/N) [27D[27C
解决办法
因为微信开发者工具的服务端口号没有打开
uni-app开发小程序中遇到的map地图的点聚合以及polygon划分区域问题
写一篇文章来记录以下我在开发小程序地图过程中遇到的两个小坑吧，一个是点聚合，用的是joinCluster这个指令，另一个是polygon在地图上划分多边形的问题：
1.首先说一下点聚合问题，由于之前没有做过小程序地图问题&#…
uniapp微信小程序使用stomp.js实现STOMP传输协议的实时聊天
简介：
原生微信小程序中使用 本来使用websocket，后端同事使用了stomp协议，导致前端也需要对应修改。
如何使用
1.yarn add stompjs 2.版本 “stompjs”: “^2.3.3” 3.在static/js中新建stomp.js和websocket.js，然后在需要使用…
uniapp中使用原生canvas标签绘制视频帧来模拟拍照，拍照后将图绘制在另外一个canvas上编辑画图，这样反复操作
uniapp中使用原生canvas标签绘制视频帧来模拟拍照，拍照后将图绘制在另外一个canvas上编辑画图，这样反复操作会导致ios系统上白屏，canvas2d上下文为null,经查阅找到相关资料 IOS 创建Canvas过多导致getContext(‘2d’) 返回null 总 Canvas 内存…
微信小程序请求接口返回的二维码(图片)，本地工具和真机测试都能显示，上线之后不显示问题
请求后端接口返回的图片： 页面展示： 代码实现： :show-menu-by-longpress"true" 是长按保存图片 base64Code 是转为base64的地址 <image class"code" :src"base64Code" alt"" :show-menu-by-long…
vue、uniapp如何在js中获取scss的变量
举例：在uniapp中会有一个uni.scss文件，我这边声明了一个$my-nav-bgColor的变量 uni.scss已经预处理过了，我们不需要引入可以直接使用
如果要在js中使用
需要在uni.scss中导出 在你要用的页面引入 就可以正常使用了 自己定义的scss文件…
小程序隐私保护授权处理方式之弹窗组件
欢迎点击关注-前端面试进阶指南：前端登顶之巅-最全面的前端知识点梳理总结
*分享一个使用比较久的🪜
小程序隐私保护授权弹窗组件
调用wx.getUserProfile进行授权时，返回错误信息：{errMsg: “getUserProfile:fail api scope is…
uniapp 开发之仿抖音，上下滑动切换视频、点击小爱心效果
效果图： 功能描述：
上下滑动视频，双击暂停，然后第一个视频再往上滑显示”已经滑到顶了“
开始代码：
首先视频接口使用的公开的视频测试接口 开放API-2.0 官网展示 Swagger UI 接口文档 一…
uniapp-秋云图表 ucharts echarts 对比与关系
科普： 秋云图表库，包含二种配置属性对应二种js配置文件。 一种是 ：echarts.js,一种是 ： ucharts。 二者的配置属性不一样！ ucharts和echarts对比
ucharts和echarts都是用于数据可视化的开源JavaScript库，它…
html2canvas 截图空白 或出现toDataURL‘ on ‘HTMLCanvasElement或img标签没截下来 的所有解决办法
1.如果截图空白：
1.1以下的参数是必须要有的。 width: shareContent.offsetWidth, //设置canvas尺寸与所截图尺寸相同，防止白边height: shareContent.offsetHeight, //防止白边logging: true,useCORS: true,x:0,y:0,2，如果出现了报错 toData…
uniapp微信小程序隐私政策
使用wx.requirePrivacyAuthorize实现微信小程序隐私政策。
一、前言
微信小程序官方出了一个公告《关于小程序隐私保护指引设置的公告》。不整的话，后果很多授权无法使用，详见《小程序用户隐私保护指引内容介绍》 。 二、操作流程
1、在 微信小程序后…
一套成熟在用的Spring Cloud工程项目数字化管理云平台源码
技术架构：
微服务JavaSpring Cloud VueUniApp MySql
开发语言：Java
开发工具：Idea
前端框架：Vue
后端框架：Spring Cloud
数 据 库：MySql
移 动 端：UniApp
系统端口：PC端&…
解决小程序中textarea ios端样式不兼容的方法
问题描述 ，今天在调试小程序的时候有个需求需要textarea与标题对其，微信开发工具和安卓系统都没有问题 但是ios系统textarea存在内边距。出现不兼容的情况
解决方法：我们看官网的textarea的属性 textarea | uni-app官网
disable-default-p…
uni-app之android项目云打包
1，项目根目录，找到mainfest.json，如果appid是空的，需要生成一个appid 2，点击重新获取appid，这个时候需要登录，那就输入账号密码登录下 3，登陆后可以看到获取appid成功 4，…
uni-app之android离线自定义基座
一 为什么要自定义基座
1，基座其实就是一个app，然后新开发的页面可以直接在手机上面显示，查看效果。
2，默认的基座就是uniapp帮我们打包好的基座app，然后我们可以进行页面的调试。
3，自定义基座主要用来…
uniapp实现微信小程序全局可分享功能
uniapp实现微信小程序全局【发送给朋友】、【分享到朋友圈】、【复制链接】 主要使用 Vue.js 的 全局混入
1.创建一个全局分享的js文件。示例文件路径为：./utils/shareWx.js ，在该文件中定义全局分享的内容：
export default {data() {retur…
vue3+ts+uniapp实现小程序端input获取焦点计算上推页面距离
vue3tsuniapp实现小程序端input获取焦点计算上推页面距离 input获取焦点计算上推页面距离 1.先说我这边的需求2.发现问题3.解决思路4.代码展示 自我记录 1.先说我这边的需求
需求 1.给键盘同级添加一个按钮例如’下一步’ or ‘确认’ 这种按钮 2.初步想法就是获取input焦点时…
uniapp制作——交友盲盒
在小程序端可以有很多好玩的小玩意，目前网上比较有趣的就是有一个交友盲盒，能抽出和找出对象的一个有趣的小程序，所以今天给大家带来用uniapp搭建的交友盲盒，大家再根据自己的情况去搭建自己的后端和数据库来完成自己的一个小项目…
【uniapp】关于小程序输入框聚焦、失焦（输入法占位）的问题
聊天小程序，界面带有输入框，当输入框中聚焦后，底部自动谈起输入法。此时输入框也要随之出现在输入法上方。默认情况下，输入框此时会被输入法覆盖掉。
以下是亲自实践，解决这个问题的方法：
一、小程序大概…
uniapp移动端地图，点击气泡弹窗并实现精准定位
记录移动端地图map组件的使用
需求记录：
移动端地图部分需要展示两个定位点，上报点及人员定位点。通过右上角的两个按钮实现地图定位。点击对应定位气泡，弹出定位点的信息。
效果图如下： map在nvue中的使用。直接用nvue可以直接…
环信uni-app-demo 升级改造计划——单人多人音视频通话（三）
前序文章：
环信 uni-app Demo升级改造计划——Vue2迁移到Vue3（一）
环信即时通讯SDK集成——环信 uni-app-demo 升级改造计划——整体代码重构优化（二）
概述 在将声网 uni-app 音视频插件正式集成进入环信的 uni-app…
uniapp搜索功能
假设下方数据是我们从接口中获取到的，我们需要通过name来搜索，好我们看下一步。 data: [{"id": 30,"category_id": 3,"name": "日常家居名称","goods_num": 20,"integral_num": 20,&q…
uni-app语音转文字功能demo(同声传译)
目录
首先去微信开发者官网申请一下同声传译的插件 微信公众平台
在文件中开始引用： 首先去微信开发者官网申请一下同声传译的插件 微信公众平台 后续使用的时候可以看详情里面的信息进行使用
在文件中开始引用： 注意！！在这个…
酒庄网上购物商城系统 java+uniapp微信小程序
每个酒庄微信小程序也都将通过计算机进行整体智能化操作，对于酒庄微信小程序功能所牵扯的数据都是通过用户进行酒庄微信小程序等相关的数据信息内容、并且可以实现首页、个人中心、用户管理、酒庄文化管理、酒水信息管理、藏酒信息管理、品酒信息管理、预约品酒管理…
uniapp 在 onLoad 事件中 this.$refs 娶不到的问题
现象
本人想在主页面加载的时候调用子组件的方法。示例代码如下： 运行，发现 this.$refs 取不到。如下图所示： 解决方法，把onLoad 换为 onReady 就可以了。
用户促活留存新方式——在APP中嵌入小游戏
随着APP同类产品的不断出现，APP开发者们面临着激烈的竞争，很多APP下载后被新的APP取代，获客成本越来越高。同时开发者还会面临用户粘性差、忠诚度低、用完即走、留存困难，商业化价值被大大缩减。
在APP中植入小游戏来提高用户活跃…
基于HBuilder X平台下的 驾校报名考试管理系统 uniapp 微信小程序3n9o5
本课题研究的是基于HBuilder X系统平台下的驾校管理系统，开发这款驾校管理系统主要是为了帮助学员可以不用约束时间与地点进行查看教练信息、考场信息等内容。本文详细讲述了驾校管理系统的界面设计及使用，主要包括界面的实现、控件的使用、界面的布局和…
Uniapp中使用uQRCode二维码跳转小程序页面
下载插件 uQRCode官网地址 引入插件 文件如下
//---------------------------------------------------------------------
// github https://github.com/Sansnn/uQRCode
//---------------------------------------------------------------------let uQRCode = {};(functio…
uniapp 高度铺满全屏
问题：在有uni-tabbar的情况下，页面铺满剩下的部分
<template><view :style"{height:screenHeightpx}" class"page"></view>
</template>
<script>export default {data() {return {screenHeight: &q…
uni-app rich-text组件富文本图片展示不全问题
背景：phpfastadmin富文本插件上传富文本内容到数据库，uni-app渲染富文本内容。这里后端不需要特殊处理。uni-app的rich-text组件展示图片跑板。直接贴代码。
<template><view><title-bar title"会员动态" back backcolor"…
【已解决】uniapp使用vant-ui中的tab标签页的时候，发现底下红色的切换线不见了
问题截图 解决办法
按F12查看vant-ui源码你会发现他的Tab标签页里面有个width，但是我们引入到uniapp之后发现width没有了（不知道什么情况，可能是兼容问题吧） 所以我们解决的办法，只需要在App.vue中给全局.van-tabs__l…
uview indexList 按字母跳转不了
点击字母跳转不到位的问题：在<u-index-list>添加方法select“clickSelect“
锚点要加id，用对应的字母做为id值，
<u-index-anchor :id"key" :index"key"/>
<template><view><view class&qu…
前端uniapp块样式写法
<template><view class"block"><view class"block_box"><view class"block_box_content"><view class"block_box_left">左边</view><view class"block_box_right">右边</view…
【uniapp】uniapp 引用 js 组件
UniApp作为一款优秀的跨平台开发框架，它可以让我们使用一套代码，并在多个平台上进行编译，从而获得高性能、易扩展和可维护的应用程序。在UniApp开发过程中，我们不仅需要掌握各种UI组件的使用方法，还需要了解如何在项目…
uni-app运行到微信开发者工具-没有打印的情况
前言 到我们进场使用微信开发者工具时，就会发现它经常会有bug，特别是在软件更新，组件库更新之后 最近在更新微信开发者工具之后发现所有打印都不显示了，虽然是小问题-但对于强迫症很烦 以为是代码配置问题-结果是更新之后打印开…
uniapp的webview实现左滑返回上一个页面
uniapp默认左滑是关闭整个webview，而不是关闭当前页 实现思路：拦截webview的url跳转操作，将新url用webview组件重新打开，当左滑的时候，默认关闭的就是当前webview，继而跳转到上一次的页面中
<template&…
【uniapp/uview】u-datetime-picker 选择器的过滤器用法
引入：要求日期选择的下拉框在分钟显示时，只显示 0 和 30 分钟；
<u-datetime-picker :show"dateShow" :filter"timeFilter" confirm"selDateConfirm" cancel"dateCancel" v-model"value1&qu…
uni-app--》基于小程序开发的电商平台项目实战（一）
🏍️作者简介：大家好，我是亦世凡华、渴望知识储备自己的一名在校大学生 🛵个人主页：亦世凡华、 🛺系列专栏：uni-app 🚲座右铭：人生亦可燃烧，亦可腐败…
【RuoYi移动端】uni-app中实现生成二维码功能（代码示例）
完整示例：
<template><view><view class"titleBar">执法检查“通行码”信息</view><view class"twoCode"><canvas canvas-id"qrcode"></canvas></view></view>
</templat…
uniapp 实现多音频同时播放 解决sessionCategory = “ambient“不生效问题
1.1完整代码
<template><view></view>
</template><script>export default {data() {return {BGInnerAudioContext1: null, //背景1BGInnerAudioContext2: null, //背景2}},onLoad() {this.play1()this.play2()},methods: {//音频1play1() {//背…
使用webpack-bundle-analyzer分析uni-app 的微信小程序包大小（HbuilderX运行）
1、找到vue.config.js 文件。如果找不到，则在项目根目录下（跟pages.json同一个目录下）创建一个JS文件，命名为vue.config.js
2、安装webpack-bundle-analyzer，官方网站：https://github.com/webpack-contrib…
uni-app开发小程序时ucharts图表如何使用
在此不会具体告诉大家怎么做，我只告诉大家方法：
第一步，推荐使用组件方法进行绘图，首先去官网下载这个ucharts的插件：
秋云 ucharts echarts 高性能跨全端图表组件 - DCloud 插件市场 下载完毕导入到所需要用到的项目…
![[uni-app] iOS/Android端 禁止单个页面侧滑返回的处理记录](https://img-blog.csdnimg.cn/316ddc95c3924bb7974291aa8b4fd3cd.png)
[uni-app] iOS/Android端 禁止单个页面侧滑返回的处理记录
需要禁止部分页面侧滑返回
iOS端
popGesture 但是实测后, 其实设置popGesture:none 是无效的 真正可以用的是这个 disableSwipeBack
android端
别的方案没有逐一尝试, 这边可以在需要禁止的页面的 onBackPress onBackPress() {// 禁止侧滑(但注意也会禁止导航返回,导航返…
uni-app--》基于小程序开发的电商平台项目实战（二）
🏍️作者简介：大家好，我是亦世凡华、渴望知识储备自己的一名在校大学生 🛵个人主页：亦世凡华、 🛺系列专栏：uni-app 🚲座右铭：人生亦可燃烧，亦可腐败…
windows打包uniapp应用p12证书和证书profile文件的制作方法
参考文章1：
uniapp打包ios app所需的证书的制作流程-腾讯云开发者社区-腾讯云使用uniapp进行开发，既可以打包小程序，也可以打包app，假如需要打包app，需要p12格式的证书和一个证书profile文件，这个在uniapp…
uniapp的配置文件、入口文件、主组件、页面管理部分
1.配置文件 manifest.json： UniApp 项目的配置文件是 manifest.json，它包含了项目的基本配置信息，如应用名称、appid（小程序）、启动页、路由配置、页面配置等。这个文件位于项目的根目录下，你可以根据项目需…
vite + react + typescript + uni-app + node 开发一个生态系统
简介
使用 vite react typescript uni-app node 来开发一个简易的生态系统案例，包含 APP，H5，微信小程序，控制台，服务端
开发
admin
技术栈：vite react typescript初始化控制台项目选择自定义预设…
uniapp基于微信小程序的历史课程在线学习系统
中学历史学习系统的系统项目的概述设计分析，主要内容有今日历史、题库练习体分析，进行数据库的是设计，数据采用mysql数据库，并且对于系统的设计采用比较人性化的操作设计，对于系统出现的错误信息可以及时做出处理及反馈…
uniapp——实现电子签名功能——基础积累
话说，2020年刚来杭州的时候，有用到过uniapp，距今已有三年时间了，果然全忘了，哈哈[笑中带泪]
昨天遇到一个需求：就是要实现pdf文件的预览，着实费了我很多的时间，连晚饭都没有吃好。。…
微信小程序的在线课外阅读打卡记录系统uniapp
本文从管理员、学生和教师的功能要求出发，中学课外阅读记录系统中的功能模块主要是实现学生、教师、阅读任务、阅读打卡、提醒信息、阅读排行、任务计划、阅读类型、在线考试等。经过认真细致的研究，精心准备和规划，最后测试成功，…
uniapp 轮播列表左右滑动，滑动到中间放大
html <!-- 轮播 --><view class"heade"><swiper class"swiper" display-multiple-items3 circulartrue previous-margin1rpxnext-margin1rpx current0 change"swiperChange" ><block v-for"(item,index) in list"…
uni-app 分包
一、何为uni-app
uni-app 是一个使用 Vue.js 开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、Web（响应式）、以及各种小程序（微信/支付宝/百度/头条/飞书/QQ/快手/钉钉/淘宝）、快应用等…
uniapp引入小程序原生插件
怎么在uniapp中使用微信小程序原生插件，以收钱吧支付插件为例
1、在manifest.json里的mp-weixin中增加插件配置 "mp-weixin" : {"appid" : "你的小程序appid","setting" : {"urlCheck" : false},"usingCom…
【uni-app】uni-app内置组件和扩展组件
内置组件和扩展组件的关系
先引用uni-app官网原文： uni-app是有内置组件的。这和web开发不一样。 web开发基本上不用基础组件，都是找一个三方ui库，全套组件都包含。那是因为html的基础组件默认样式不适配手机风格。 但uni-app体系不是这样&a…
uniapp风险等级（三级）
代码
<template><view><view class"riskGrade"><label>风险等级: </label><span v-if"flag 0 || flag 1 || 2" class"item":style"[{background:flag0?color:flag1?color:flag2?color:}]"…
uniapp-提现功能(demo)
页面布局
提现页面 有一个输入框 一个提现按钮 一段提现全部的文字 首先用v-model 和data内的数据双向绑定 输入框逻辑分析
输入框的逻辑 为了符合日常输出 所以要对输入框加一些条件限制
因为是提现 所以对输入的字符做筛选,只允许出现小数点和数字 这里用正则实现的小数点…
uniapp vue 页面传参问题encodeURIComponent
页面传参objet json序列化后可能会报错 Uncaught SyntaxError: missing ) after argument list 但不一定是数据有问题，而是json成字符串后，字符串中有特殊字符，所以导致parse的时候格式不对。所以解决方案如下
如果传递参数为对象的时候&…
uniapp：APP开发，后台保活
前言：
在ios中，软件切换至后台、手机息屏，过了十来秒软件就会被系统挂起，APP内的任务就不能继续执行；在android中，默认情况下，软件在后台运行的时候，触发某些特定条件的情况下&…
uni-app 新增 微信小程序之新版隐私协议
一、manifest.json中配置
"__usePrivacyCheck__": true
二、编写封装后的组件
<template><view class"privacy" v-if"showPrivacy"><view class"content"><view class"title">隐私保护指引</…
uni-app:实现条件判断展示图片（函数判定+三目运算）
一、多条件判断（通过函数进行图片展示）
效果 代码
在data中定义图片信息和要传递的数据信息，在src中写入函数并携带要传递的数据，通过传递的数据在函数中进行判断，并返回对应的图片信息
<template><view&…
uniapp微信小程序用户隐私保护指引弹窗组件
<template><view v-if"showPrivacy" :class"privacyClass"><view :class"contentClass"><view class"title">用户隐私保护指引</view><view class"des">感谢您选择使用我们的小程序&am…
微信小程序的疫苗接种预约设计与实现vue+uniapp
对于本小程序的疫苗预约的设计来说，系统开发主要是采用java语言，在整个系统的设计中应用MySql数据库来完成数据存储，具体根据疫苗预约信息的现状来进行开发的，具体根据现实的需求来实现疫苗预约网络化的管理，各类信息有…
基于安卓Java试题库在线考试系统uniapp 微信小程序
本文首先分析了题库app应用程序的需求，从系统开发环境、系统目标、设计流程、功能设计等几个方面对系统进行了系统设计。开发出本题库app，主要实现了学生、教师、测试卷、试题、考试等。总体设计主要包括系统功能设计、该系统里充分综合应用Mysql数据库、…
【HBuilderX】解决黑色主题中的注释颜色太浅的问题（代码示例）
打开后，搜索Comment，修改，一个是//的颜色，一个是注释内容的颜色
分享一个springboot+uniapp开发的线上马拉松报名小程序源码 lw 调试
💕💕作者：计算机源码社 💕💕个人简介：本人七年开发经验，擅长Java、Python、PHP、.NET、微信小程序、爬虫、大数据等，大家有这一块的问题可以一起交流！ 💕&…
uniapp 模糊搜索(小白必看)
实现模糊搜索很简单,按照下面的步骤:
1. 搜索栏
<view class"search-box"><uni-search-bar class"uni-mt-10" radius"100" placeholder"请输入移交信息" clearButton"auto" bgColor"#F8F8F8"cancelBut…
uniapp video全屏 cover-view 失效
查看官方文档 video | uni-app官网 确定自己开发的是app端 还是 微信小程序，我开发的是app端，所以在nvue文件写，同时cover-view组件要在video组件内容。 我写了一个简单的视频组件，可以看我另一篇博客。
uniapp video（…
uni-app 之 NoticeBar 滚动通知，横向滚动，竖/纵向滚动
uni-app 之 NoticeBar 滚动通知，横向滚动，竖/纵向滚动 image.png <template><view class"content"><view style"width: 50%;"><u-notice-bar :text"text1" direction"column"></u-n…
uni-app使用CSS实现无限旋转动画
本来想用uni.createAnimation创建一个旋转动画，发现转完一圈后就不动了，没法循环旋转，
后来又用setInterval每隔一个周期就把旋转角度加180度，发现运行一段时间后动画逐渐崩坏，应该是动画的周期和定时器的周期时间没有…
Uniapp 解决组件在官方文档不支持的事件上，接收小程序原生组件事件
现在需要在抖音小程序上使用加粉丝群功能，官方 button 有自带这个功能，但是 Uniapp 官网并没有支持，一个是 open-type 类型，一个是回调事件 bindjoingroup： <buttonopen-type"joinGroup"group-id"xx…
uniapp 触底加载
方式一
onReachBottomDistance 缺点：需要整个页面滑动，局部滑动触发不了
{
// pages.json
// 路由下增加 onReachBottomDistance
"path": "detailed/detailed","style": {"navigationBarTitleText": "收…
【uniapp】Dcloud的uni手机号一键登录，具体实现及踩过的坑，调用uniCloud.getPhoneNumber(),uni.login()等
一键登录Dcloud官网请戳这里，感兴趣的可以看看官网，有很详细的示例，选择App一键登录，可以看到一些常用的概述 比如： 1、调用uni.login就能弹出一键登录的页面 2、一键登录的流程，可以选择先预登录uni.prelo…
thinkphp:查询本周中每天中日期的数据，查询今年中每个月的数据，查询近五年每年的总数据
一、查询本周中每天中日期的数据
结果：
以今天2023-09-14为例，这一周为2023-09-11~2023-09-07 代码
后端thinkphp:
//查询本周每天的的总金额数
//获取本周的起始日期和结束日期
$weekStart date(Y-m-d, strtotime(this week Monday));
$weekEnd …
基于Java+SpringBoot+Vue+uniapp点餐小程序（包含协同过滤算法和会员系统，强烈推荐！）
校园点餐小程序 一、前言二、我的优势2.1 自己的网站2.2 自己的小程序（小蔡coding）2.3 有保障的售后2.4 福利 三、开发环境与技术3.1 MySQL数据库3.2 Vue前端技术3.3 Spring Boot框架3.4 微信小程序 四、功能设计4.1 系统功能结构设计4.2 主要功能描述 五…
基于Java+SpringBoot+Vue+uniapp点餐小程序（亮点：协同过滤算法、会员系统，购物车结算、在线聊天）
校园点餐小程序 一、前言二、我的优势2.1 自己的网站2.2 自己的小程序（小蔡coding）2.3 有保障的售后2.4 福利 三、开发环境与技术3.1 MySQL数据库3.2 Vue前端技术3.3 Spring Boot框架3.4 微信小程序 四、功能设计4.1 系统功能结构设计4.2 主要功能描述 五…
适配uniapp的图表插件——Lime UI
一款基于 uniapp 的多端兼容组件，支持nvue，详情可参考 官方地址
使用注意事项：插件用到了 css 预编译器 stylus 要先安装对 echarts 内部的方法和样式做过改动，只是使其兼容uniapp件使用了 webview 支持 nvue。
安装
在uniapp …
uniapp iOS离线打包——原生工程配置
uniapp iOS离线打包，如何配置项目工程？ 文章目录 uniapp iOS离线打包，如何配置项目工程？工程配置效果图DebugRelease 配置工程配置 Appkey应用图标模块及三方SDK配置未配置模块错误配置模块TIP: App iOS 离线打包 前提：…
uniapp项目实践总结(十六)自定义下拉刷新组件
导语：在日常的开发过程中，我们经常遇到下拉刷新的场景，很方便的刷新游览的内容，在此我也实现了一个下拉刷新的自定义组件。 目录
准备工作原理分析组件实现实战演练内置刷新案例展示
准备工作
在components新建一个q-pull文件夹…
小程序和uniapp中scroll-view触底加载
scroll-view使用懒加载：
属性：
scroll-xBooleanfalse允许横向滚动scroll-yBooleanfalse允许纵向滚动
事件：
scrolltoupperEventHandle滚动到顶部/左边，会触发 scrolltoupper 事件scrolltolowerEventHandle滚动到底部/右边&…
uniapp——生成一个签字板
在开发项目中有签名/签字的需求，以下实现： <template><view class"new_file" v-if"showAutograph"><view class"popupBox"><view class"popupTopBox">签字板</view><canvas c…
分享一个springboot+uniapp基于微信小程序的校医务室健康服务系统源码 lw 调试
💕💕作者：计算机源码社 💕💕个人简介：本人七年开发经验，擅长Java、Python、PHP、.NET、微信小程序、爬虫、大数据等，大家有这一块的问题可以一起交流！ 💕&…
uniapp解决h5跨域问题
我是用的最简单的方法进行去代理 在配置文件配置manifest.json 文件进行配置 "h5": {"devServer": {"port": 8080, //端口号"disableHostCheck": true,"proxy": {"/dev-api": {"target": "http://…
uniApp初体验-从零开始注意事项
根据官网下载uni-app的项目
1.设置默认代码片段 我使用的是vs 在左下角设置按钮找到代码片段，找到vue.json文件，并添加代码片段。在页面中输入vue3就会有提示
2.使用tabBar
根据官方配置在pages.json中配置tabBar之后，并未显示。原因是在p…
uni-app H5使用 tabbars切换,echartst图表变小 宽度只有100px问题解决
问题：
跳转到别tabbars页面之后，再回来，echarts图显示缩小小团子。 原因分析：
在tabs切换中有echarts的话，我们会发现初始化的那个echarts是有宽度的，当点击tabs切换之后，切换过来的echarts只…
uni-app：showModal消息提示（确认、取消）
效果 代码
<template><view><button longpress"handleLongPress">点我出现删除消息</button></view>
</template><script>export default {data() {return {};},methods: {handleLongPress(e) {//删除设备uni.showModal(…
uni-app：跨页面传递数组
A页面：
JSON.stringify() 是一个 JavaScript 内置的方法，用于将 JavaScript 对象或值转换为 JSON 字符串。
//查看详细信息
details(e){// console.log(e.currentTarget.dataset.id)var device JSON.stringify(e.currentTarget.dataset.id)uni.naviga…
uni-app上传文件
在uni-app中上传文件可以通过使用uni.uploadFile接口来实现
uni.chooseImage({success: function (res) {var tempFilePaths res.tempFilePaths;uni.uploadFile({url: https://example.com/upload,filePath: tempFilePaths[0],name: file,success: function (res) {console.l…
uniapp 封装request请求
在request 文件夹 新建request.js
import main from "main.js"
export const request (options) > {return new Promise((resolve, reject) > {let token uni.getStorageSync(authorization)// 在登录的时候需要储存 token uni.setStorageSync("author…
uniapp如何实现路由守卫、路由拦截，权限引导
因为uniapp路由的实现方式和以往vue开发的router路由时不太一样，故官方这么说： 经过一番网上冲浪发现，有两种方式可以实现，
第一种方式： 在上述代码中，我们通过监听beforeRouterEnter事件来实现路由守卫。…
uniapp滑动事件
在Uniapp中，可以通过touchstart、touchmove和touchend等事件来监听滑动操作。以下是对这些事件的简要说明： touchstart：当手指触摸屏幕时触发该事件。可以通过event.touches属性获取到触摸点的信息。 touchmove：当手指在屏幕上滑…
uniapp----微信小程序 日历组件（周日历 月日历）【Vue3+ts+uView】
uniapp----微信小程序 日历组件（周日历&& 月日历）【Vue3tsuView】 用Vue3tsuView来编写日历组件；存在周日历和月日历两种显示方式；高亮显示当天日期，红点渲染有数据的日期，点击显示数据 1. calenda…
在uniapp中使用 秋云ucharts图表，运行到小程序
步骤一：通过使用 HBuilderX 直接导入项目（uni_modules 版本）
步骤二：在uCharts官网 - 秋云uCharts跨平台图表库 演示中，先弄个demo试着运行， 步骤三：查看自己需要的配置， 下面是我的…
uni-app scroll-view设置scrollTop为0返回顶部不生效
组件属性设置不生效解决办法： 每次将scroll-view组件的scroll-top属性值设置为0，只有第一次能顺利返回顶部。 这和props的单向数据流特性有关，组件内部scroll-top的实际值改动后，其绑定的属性并不会一同变化。 场景： 左…
uni-app：通过三目运算动态增加样式效果（class）
效果 代码
第一条：当变量line的值等于abc时，class就等于yes,反之class等于no（显然等于abc，执行yes,前景色为红色）
第一条：当变量line1的值等于abc时，class就等于yes,反之class等于noÿ…
swiper动态渲染视图，解决答题问题
最近做项目碰到这样一个需求，当当前题目没答的时候，不能进入下一题，而我用的组件是swiper，swiper没有类似阻止滑动的属性，于是只能自己想了.......问题的解决思路就是动态渲染题目，并且过滤掉第一道题&…
uniapp项目实践总结(十九)版本更新和热更新实现方法
导语：当一个 APP 应用开发完成以后，就要上架应用商店，但有时候修改一些小问题或者推出一些活动，又不想频繁地提交应用商店审核，那么就可以使用应用内更新功能来进行应用的版本升级更新或热更新，下面就介绍一下实现的方法。 目录 准备工作原理分析实战演练案例展示准备工作…
uniapp数据点击的时候将数据存入同一个本地存储中并且最大限度5个
比如你想要存储信息最大限度5个，当然也可以存入更多，更改一下设置即可
让他this.storedData.length > 数值即可
data部分 data() {return {storedData: [], // 用于存储点击获取的数据list: [{ name: 张三, id: 1 },{ name: 李四, id: 2 },{ name: …
uniapp解决scroll滑动之后被u-sticky挡住的问题
问题：页面触底加载之后，回到头部，顶部数据被遮挡
将<swiper class"swiper-list"></swiper>上的swiper-list样式高度调整成90vh
<view class"main"><u-sticky bgColor"#fff"><u-…
uniapp实时获取当前位置
首先我们需要先下载一个插件（高德地图官网插件）
（插件主要作用是获取当前地理定位或者是自身的位置，并且可以返回名称name）
相关下载-微信小程序插件 | 高德地图API (amap.com)https://developer.amap.com/api/wx/do…
uniapp 微信小程序之隐私协议开发
uniapp 微信小程序之隐私协议开发 官网通知：https://developers.weixin.qq.com/miniprogram/dev/framework/user-privacy/PrivacyAuthorize.html 1、配置 __usePrivacyCheck__: true；位置 manifest.json :
"mp-weixin":{"__usePrivacyCh…
uni-app获取元素具体位置获取失败
场景：想要通过链接跳转传递catid&catid2类别id,商品类别id 跳到这一页左侧对应的类别栏上面,同时跳到右侧列表滚动到对应商品那一块区域。 遇到的问题：在for循环中通过绑定id获取不到商品列表的具体位置。 原因：在onReady函数和mounted函…
Uni-app 调用微信地图导航功能【有图】
前言
我们在使用uni-app时，有时候会遇到需要开发地图和导航的功能，这些方法其实微信小程序的API已经帮我们封装好了 详见：微信小程序开发文档 接下来我们就演示如何用uni-app来使用他们
使用
<template><view><button type…
【uniapp】小程序开发：3 分包配置
分包加载配置，此配置为小程序的分包加载机制。
因小程序有体积和资源加载限制，各家小程序平台提供了分包方式，优化小程序的下载和启动速度。
所谓的主包，即放置默认启动页面/TabBar 页面，以及一些所有分包都需用到公…
分享一个基于uniapp+springboot技术开发的校园失物招领小程序（源码、lw、调试）
💕💕作者：计算机源码社 💕💕个人简介：本人七年开发经验，擅长Java、Python、PHP、.NET、微信小程序、爬虫、大数据等，大家有这一块的问题可以一起交流！ 💕&…
uniapp后台播放音频功能制作
在UniApp中，你可以使用uni.getRecorderManager()方法来创建一个录音管理器实例。但是，请注意，录音管理器并不直接用于后台音频播放功能，而是用于录制音频。如果想要在后台播放音频，你需要使用uni.getBackgroundAudioMa…
❤Uniapp报npx update-browserslist-db@latest
❤ Uniapp报npx update-browserslist-dblatest 按照提示先更新一下
npx update-browserslist-dblatest然后打开一下端口
uniapp 离线打包 plus.runtime.install 安装页面不弹起
uniapp 离线打包 plus.runtime.install 安装页面不弹起
updateVersion(webview : any, eventTitle : string, eventContent : string) {const loading plus.nativeUI.showWaiting(准备下载);var dtask plus.downloader.createDownload(eventContent,{method: GET,timeout: 5…
uniapp项目实践总结(十七)实现滚动触底加载
导语：在日测的开发过程中，经常会碰到页面需要渲染大量数据的情况，这时候就需要用到滚动加载功能，下面总结一下方法。 目录
原理分析实战演练案例展示
原理分析
使用scrolltolower事件来监听滚动到底部，然后加载下一…
uniapp 可输入可选择的........框
安装
uniapp: uni-combox地址 vue页面
<uni-combox :border"false" input"selectname" focus"handleFocus" blur"handleBlur" :candidates"candidates" placeholder"请选择姓名" v-model"name"&g…
智思Ai企联系统去授权版本+uniapp前后端（内含教程）
智思AI企联系统是一款企业级AI系统，与普通版AI产品相比具备显著差异。该系统允许企业按需选择和定制二开任意功能，以满足不同企业的个性化需求和场景要求。企业可以根据实际业务需求扩展和改进系统功能模块，使之更好地适应企业独特需求。
uni-app获取地理位置
在uni-app中，可以通过uni.getLocation()方法获取地理位置。具体步骤如下：
在uni-app项目中的manifest.json文件中，添加需要获取地理位置的权限：
{"mp-weixin": {"appid": "...","permission…
uniapp：配置动态接口域名，根据图片访问速度，选择最快的接口
common.js // 动态测速选择的域名
// h5直接返回默认第一个域名
// vue文件用到域名的话用this.$baseURL
let domains [{uri:192.168.31.215:9523, speed:0},{uri:api.ceshi.org, speed:0},
]export const protocol {api: http://,//本地// api: https://api.,//正式h5Url: h…
uniapp 音视频应用及注意事项
1.音频
uniapp 音频控制组件uni.createInnerAudioContext()
使用方法，建议在data声明创建，避免创建多个音频时闪退，单个音频可参考官方在script下直接创建，和import同级 export default {components: {draggable},data() {retu…
基于Java+SpringBoot+Vue+Uniapp培训机构小程序设计与实现(源码+lw+部署文档+讲解等)
文章目录 前言学生微信小程序端的主要功能有：教师微信小程序端主要功能有：管理员的主要功能有：具体实现截图详细视频演示为什么选择我自己的网站自己的小程序（小蔡coding）有保障的售后福利 代码参考论文参考源码获取 前…
uniapp使用uv-vi组件创建表单，收集信息
在 UniApp 中使用 uv-vi 组件创建表单可以收集用户信息和单选框的值，你可以按照以下步骤进行操作： 确保你已经安装了 UniApp，并在项目中引入了 Vue.js。 在项目的页面文件（例如 pages/index/index.vue）中，…
uni-app实现获取未来七天时间和星期几功能
例子如下：
HTML： <viewstyle"margin-top: 3%;width: 100%;height: 10vh;display: flex;justify-content: space-around;"><div v-for"(item,index) in same_week" :class"[same_dayitem.date? activ :,dis]"cl…
uni-app监听页面滚动
在uni-app中可以通过监听页面滚动事件来实现滚动效果或响应滚动事件
在需要监听滚动的页面或组件中，添加一个scroll元素，用于容纳内容并实现滚动效果。 <template><view class"container"><scroll-view scroll-y scroll"…
uniapp中vue3使用uni.createSelectorQuery().in(this)报错
因为VUE3中使用setup没有this作用域，所以报错
解决办法：使用getCurrentInstance()方法获取组件实例
import { getCurrentInstance } from vue;const instance getCurrentInstance(); // 获取组件实例
const DOMArr uni.createSelectorQuery().in(ins…
uniapp图片上传制作
Uniapp 支持多种方式上传图片，以下是其中几种常用方式：
使用 uni.uploadFile() 上传图片，示例代码：
uni.chooseImage({success: function (chooseImageRes) {uni.uploadFile({url: http://example.com/upload,filePath: chooseI…
uniapp项目实践总结(二十一)日常开发方法汇总
导语：在跨端应用的日常的开发过程中|经常要用到一些全局通用方法|下面就整理一下我经常用的方法|仅供参考。 目录 路由拦截数据处理文本转换禁用手势缓存管理权限列表系统通知案例展示路由拦截
主要是uni.addInterceptor添加拦截器和uni.removeInterceptor移除拦截器两个 API…
uniapp麦克风授权窗口
在UniApp中，你可以使用uni.authorize方法来进行麦克风授权，并触发麦克风授权弹窗。具体步骤如下：
调用uni.authorize方法请求用户麦克风授权：
uni.authorize({scope: scope.record,success() {console.log(麦克风授权成功);},fa…
uniapp中websocket的使用单个长连接
1、新建js文件封装websocket.js
const WEBSOCKET {//是否打开连接socketOpen: false,//连接socket/* url：链接地址 wss://xxxxxxxx.comsocketMessageFunc：收到服务器内容回调*/connectSocket(url, socketMessageFunc null) {try {//连接socketuni.con…
uniapp选择地址弹窗组件
1.效果 2.子组件在components里面创建组件AddreessWindow
<template><view style"position: relative;z-index: 999999 !important;"><view class"address-window" :class"value true ? on : "><view class"title…
uni-app：canvas-绘制图形4（获取画布宽高，根据画布宽高进行图形绘制）
效果 代码 var width ; var height ; const query uni.createSelectorQuery(); //获取宽度 query.select(#firstCanvas).fields({ size: true }, (res) > { width res.width; height res.height; }).exec(); console.log(宽度width); console.log(高…
uniapp实现大气质量指标图（app端小程序端均支持，app-nvue不支持画布）
效果图如下： 思路：
1.首先我想到的就是使用图标库echarts或ucharts，可是找了找没有找到类似的。
2.其次我就想用画布来实现这个效果，直接上手。（app-vue和小程序均可以实现，但是在app-nvue页面不支持画布…
uniapp 微信小程序使用echarts
本文目的：通过分包的方式，尽可能在微信小程序中使用最新的echarts。 当然你也可以直接使用现成的uchart或者市场里别人封好的echarts. 准备工作 下载echarts-for-weixin源码。 复制ec-canvas文件夹以及下属文件，在uniapp项目中与pages同级的地…
启动uniapp小程序报错：Error:app.json:在项目根目录中未找到app.json
如图所示：将代码从仓库中拉下来在开发者工具中直接启动后报错 产生原因：uniapp小程序不能直接被微信开发者工具解析编译，需要先生成unpackage文件夹再进行编译。
解决方案共有两种（任选其一即可）：
方案一…
【uniapp+vue3 】页面加载时根据不同角色设置导航栏标题
uniapp 页面加载时根据不同角色设置导航栏标题
其实很好实现，第一次开发uniapp项目，所以什么都不懂，绕了一点点的弯路
在对应页面的onLoad中获取到跳转过来传的参数中的判断角色字段，我这里传的是getRole uni.setNavigationBarT…
uni-app：实现密码框内容展示与隐藏
效果 代码
<template><view class"container"><view class"item_left"><view>密码</view><view class"eye_position" taptoggleShowPassword><image :srceye v-ifisShowPassword /><image :srcey…
uniapp仿微信实时通信
在uniapp中，可以做很多有趣的app，最近也是想起要做一个通信功能的app，于是联想到了微信的通信功能，想通过这个项目来了解通信的原理是什么。 看一下最终的两人聊天的效果： 大家可以看上面的图，就大概知道双…
通过uni.chooseImage返回的临时路径转为base64
uniapp官方API文档：https://uniapp.dcloud.net.cn/api/media/image.html#chooseimage
代码在后面 chooseimage的succes函数中的res.tempFilePaths，是图片的一个临时路径，没法直接传给后端接口使用，且接口需要的是base64格式的 ge…
uni-app实现图片预览
uni.previewImage预览图片
使用方法：
<image class"poster" :src"imageUrl" mode"" click"previewImg(imageUrl)"></image>const previewImg (e) > {uni.previewImage({current: e,urls: image});
}
官…
uni-app 之 获取input输入内容
uni-app 之 获取input输入内容
定义名称 v-model"logon_phone" 获取内容 console.log("111 111 logon_phone 打印 ", this.logon_phone) <template><view style"width: 100%; display: flex; flex-direction:column; align-items:center;&q…
uniapp封装http请求
一、目录结构 二、env.js
let BASE_URL
let dev_url 1
//开发环境中
if (dev_url 1) {// 开发环境BASE_URL http://192.168.120.22:9999 //开发环境请求地址
} else {// 生产环境BASE_URL https://xxxx //生成环境请求地址
}export default BASE_URL三、request.js
imp…
uni-app：循环数据点击事件获取每行指定数据（获取参数）
效果
页面样式 点击首行控制台输出信息 代码 :data-id"item.id"：定义id信息，在点击事件时e.currentTarget.dataset.id获取点击行的id :data-index"index"：定义index信息，在点击事件时e.currentTarget.datase…
uniapp 如何动态切换应用图标、名称
有时候我们需要实现类似百度网盘、淘宝APP这种可以动态切换 但是呢这种需求平常非常少见 很多人不知道如何操作 今天就教大家如何实现
这里我们需要用到一款插件Ba-ChangeIcon
Ba-ChangeIcon 是一款uniapp动态切换应用图标、名称的插件。可实现过年、过节动态切换应用图标的效…
uniapp-vue3-标签选择器wo-tag
采用uniapp-vue3实现, 是一款支持高度自定义的标签选择器组件，支持H5、微信小程序（其他小程序未测试过，可自行尝试） 可到插件市场下载尝试： https://ext.dcloud.net.cn/plugin?id14960
使用示例
<template>&…
uniapp瀑布流：他的数据是纵向渲染，怎么实现动态上拉加载数据？
不喜勿喷，非常感谢
准备数据：首先，你需要有一些数据，这些数据将会在瀑布流中渲染。你可以将这些数据存储在一个数组中，或者从服务器请求获取。
创建页面：在UniApp中创建一个页面，用于展示纵向…
uni-app：获取元素宽高
效果 代码 这里我定义的宽为500px,高为200排序,控制台输出的结果是502,202。原因是我设置了上下左右宽度各为1px的border边框导致 核心代码分析 // const query uni.createSelectorQuery();表示创建了一个选择器查询实例。通过这个实例，你可以使用不同的方法来选择…
前端uniapp防止页面整体滑动页面顶部以上，设置固定想要固定区域宽高
解决：设置固定想要固定区域宽高 目录 未改前图未改样式改后图改后样式 未改前图 未改样式
.main {display: flex;flex-direction: row;// justify-content: space-between;width: 100vw;// 防止全部移动到上面位置！！！！…
uni-app使用iconfont字体图标
先iconfont选择好自己需要的图标 添加至项目 下载字体文件到本地 将下载的文件解压缩到工程目录static文件夹下 定义好iconfont.css文件的font-face声明,修改好引入的url地址 打开App.vue文件 ,引入static下刚才修改的iconfont.css字体图标文件 完成上线的步骤后就可以全局使用…
uniapp实现上传文件功能
UniApp是一款跨平台的开发框架，可用于开发微信小程序、H5、Android和iOS等多种平台应用。实现上传文件功能需要以下步骤：
引入uni.uploadFile API，代码如下：
uni.uploadFile({url: your upload url,filePath: your file path,na…
geecg-uniapp 同源策略 数据请求 页面渲染 ui库安装（3）
一，同源策略
（1）要是没有env 需要创建一个替换成后端接口 （2）因为他封装了 先找到http请求位置 一级一级找 然后进行接口修改 都改完运行即可 （3）appUpdata 二，数据请求 &…
uniapp项目实践总结(二十五)苹果 ios 平台 APP 打包教程
导语：当你的应用程序开发完成后，在上架 ios 应用商店之前，需要进行打包操作，下面就简单介绍一下打包方法。 目录 准备工作注册账号生成证书打包配置准备工作
在打包之前，请保证你的 uniapp 应用程序编译到 ios 模拟器或者是真机调试基座环境下是可以正常运行的，苹果打包…
uni-app：showModal中实现弹窗中文本框输入
效果 代码
<template><view><!-- 显示弹窗的按钮 --><button click"showInputDialog">显示弹窗</button></view>
</template><script>
export default {methods: {showInputDialog() {uni.showModal({title: 请完成…
CRMEB商城源码开源标准版v5.2.0+后端+前端uni-app开源包安装教程
CRMEB打通版是一款全开源支持商用的PHP多语言商城系统,系统支持微信公众号端、微信小程序端、H5端、PC端多端账号同步，可快速打包生成APP；
播播资源整合格安装测试了CRMEB商城系统功能非常全，官方的文档教程也非常多，包括如何打包…
uniapp项目实践总结(二十六)安卓应用商店上架教程
导语：之前介绍了如何打包一个安卓安装包文件，如果想要上架安卓应用商店，那么就来这里学习一下方法吧。 目录
准备材料应用商店注册账号上架步骤审核事项
准备材料
基本信息
安装包：需要 32 或 64 位；包名ÿ…
uniapp实现微信小程序隐私协议组件封装
uniapp实现微信小程序隐私协议组件封装。 <template><view class"diygw-modal basic" v-if"showPrivacy" :class"showPrivacy?show:" style"z-index: 1000000"><view class"diygw-dialog diygw-dialog-modal bas…
踩坑日记 《正确的使用Vuex》基于 uniapp Vue3 setup 语法糖 vuex4 项目 太多坑了要吐了
踩坑日记 《正确的使用Vuex》基于 uniapp Vue3 setup 语法糖 vuex4 项目 太多坑了要吐了 完美解决页面数据不刷新 或者数据慢一步刷新 页面使用html
<template><view><template v-if"cartData.data.length>0"><!-- 自定义导航栏 --><…
uniapp uni.showToast 一闪而过的问题
问题：在页面跳转uni.navigateBack()等操作的前或后，执行uni.showToast，即使代码中设置2000ms的显示时间，也会一闪而过。
解决：用setTimeout延后navigateBack的执行。
2023【建议收藏】uniapp( vue3)使用canvas生成海报并保存，taro/微信小程序也适用
有段时间没写vue了，有点生疏了......
1、代码有注释，完整代码如下
<template><view class"page"><canvas class"canvas" v-if"isShow" :style"{width:${canvasWidth}px,height:${canvasHeight}px}&…
springboot+Uniapp+redis智能导诊系统源码，支持以公众号、小程序、App 等形式接入
AI医疗的智能导诊系统源码 智慧导诊系统全套源码 什么是智能导诊系统？
智能导诊系统是一种基于人工智能和大数据技术开发的医疗辅助软件，它能够通过对患者的症状、病史等信息进行计算分析，快速推荐科室和医生。通过简单的描述自身症状&#…
uniapp进行表单效验
在uniapp中进行表单效验可以采用以下两种方法： 使用uni-app官方提供的表单校验组件：uni-validate。这个组件提供了很多现成的校验规则，比如必填、手机号、邮箱等等，可以轻松实现表单的效验。具体使用可以参考官方文档：…
uni-app：实现当前时间的获取，并且根据当前时间判断所在时间段为早上，下午还是晚上
效果图 核心代码
获取当前时间 toString()方法将数字转换为字符串 padStart(2, 0)：padStart()方法用于在字符串头部填充指定的字符，使其达到指定的长度。该方法接受两个参数：第一个参数为期望得到的字符串长度，第二个参数为要填充…
uniapp echarts 适配H5与微信小程序
文章目录 前言一、修改 ec-canvas组件1.1 在ec-canvas组件methods中定义一个initChart方法1.2 用initChart全局替换this.ec.onInit1.3 监听数据变化1.4 ec-canvas完整代码参考 二、H5 echarts组件三、供外部调用的组件外部调用组件 uni-chart代码使用uni-chart 前言 接上文&…
【uniapp+vue3+ts】请求函数封装，请求和上传文件拦截器
1、uniapp 拦截器 uni.addInterceptor(STRING,OBJECT) 拦截器中包括基础地址、超时时间、添加请求头标识、添加token
utils文件夹下新建http.ts 拦截uploadFile文件上传，rquest请求接口
cosnt baseUrl xxxx// 添加拦截器
const httpInterceptor {//拦截前触发i…
uni-app 经验分享，从入门到离职（实战篇）——模拟从后台获取图片路径数据后授权相册以及保存图片
文章目录 📋前言⏬关于专栏 🎯需求描述🎯前置知识点🧩uni.showLoading()🧩uni.authorize()🧩uni.downloadFile()🧩uni.saveImageToPhotosAlbum() 🎯演示代码🧩关于图片接…
vue3+vite+uniapp 封装一个省市区组件
一、预览图 二、使用前的一些注意事项 只支持在 uniapp vue3 项目中使用支持微信小程序和h5 (app端没有测试过)ui库用的 uview-plus省市区数据用的是 vant-ui 提供的一个赖库 vant/area-data 三、组件代码
<template><u-popup :show"show" type"botto…
提交 App Store 审核所需材料记录（ appstoreconnect 截图）
年龄分级定价版权信息App提供主要类别App信息中提供内容版权信息 提供所选择语言的：关键词描述 提供查看隐私政策的网址（所选的所有语言的） 已提交：
基于vue框架的uniapp小程序开发发现了新大陆
项目场景：
在基于vue框架的uniapp小程序开发中，在页面跳转时，当前页路径带参数，在跳转页中接受数据除了用官方推荐的保留当前页面，跳转到应用内的某个页面，使用onLoad(option)接受数据，但是我发…
uniapp 条件编译 APP 、 H5 、 小程序
一、#ifdef、#ifndef、 #endif三者的区别、
标识作用#ifdef仅在某个平台上使用#ifndef在除了这个平台的其他平台上使用(非此平台使用）#endif结束条件编译
二、平台标识
标识平台APP-PLUS5AppMP微信小程序/支付宝小程序/百度小程序/头条小程序/QQ小程序MP-WEIXIN微…
【uniapp】小程序开发6：自定义状态栏
一、自定义状态栏
可以设置某个页面的状态栏自定义或者全局状态栏自定义。
这里以首页状态栏为例。
1）pages.json 中配置"navigationStyle": "custom"，代码如下：
{"pages": [ {"path": "pa…
geecg-uniapp 源码下载运行 修改端口号 修改tabBar 修改展示数据
APP体验： http://jeecg.com/appIndex技术官网： http://www.jeecg.com安装文档： 快速开始 JeecgBoot 开发文档 看云视频教程： 零基础入门视频官方支持： http://jeecg.com/doc/help
一，下载安装
源码下载…
uniapp之ios开发及支付整体流程爬坑记录
前言
在写这篇记录的时候，关于ios的支付已经对接的差不多了，下一步就是测试好了直接发版，总共花了好几周的时间，从0到1对于首次做ios支付来说，确实很多坑。
其实业务层面很简单，甚至比安卓支付还简单&…
uniapp iosApp H5+本地文件操作(写入修改删除等)
h5 地址 html5plus 以csv文件为例，写入读取保存修改删除文件内容，传输文件等
1.save 文件保存
function saveCsv(data,pathP,path){// #ifdef APP-PLUSreturn new Promise((resolve, reject) > {plus.io.requestFileSystem( plus.io.PUBLIC_DOCUMEN…
【uniapp】subnvue组件数据更新视图未更新问题
背景 : 页面中的弹窗使用了subnvue来写, 根据数据依次展示一个一个的弹窗, 点击"关闭"按钮关闭当前弹窗, 显示下一个弹窗
问题 : 当点击关闭时( 使用的splice() ), 数据更新了 , 而视图没有更新, 实际上splice() 是不仅更新数据, 也可以更新视图的
解决 : this.$fo…
uniapp 显示icon异常
按照文档创建的uni-ui项目，仿照示例程序写的代码中icon显示异常

异常情况： 正常情况： 通过比对代码发现，示例程序的App.vue中 有一个引用是问题的关键 正是因为多了这一个引用文件，图表的显示才能正常 …
uniapp物理键/右滑多次退出应用，再次进入显示白屏的问题
复现方式：安卓多次使用物理返回键或右滑退出应用后， 再次进入有很大机率显示白屏。但是手动杀进程的方式不会出现白屏和后台驻留的方式也不会出现白屏 解决思路：利用后台驻留的方式进行假退出应用，把应用隐藏至后台，这…
UniApp项目实践HelloUni继续快速小步快跑中，前面是大上海吗
效果镇楼 本来想着稍微刷点课程就完活的，结果还是到这个点了。宝贵的时间啊 直接代码干就是了，参考如下链接； UniApp实践业务项目
uniapp：swiper-demo效果
单元格轮播 <swiper class"swiper1" :circular"true" :autoplay"true" interval"3000" previous-margin"195rpx" next-margin"195rpx"><swiper-item v-for"(item,index) in 5" :key"inde…
uniapp快速入门系列（4）- 微信小程序开发
第四章 微信小程序开发 4.1 微信小程序开发与uniapp的融合4.2 微信小程序API在uniapp中的使用4.3 微信小程序常见问题的解决方法问题1: 如何获取用户信息？问题2: 如何获取当前位置？问题3: 如何发送网络请求？ 在本章中，我们将学习如…
uniapp快速入门系列（2）- Vue基础知识
章节二：Vue基础知识 Vue的介绍和特性Vue的简单易用Vue的灵活高效 Vue的常用指令和组件v-bind指令v-on指令Vue组件的通信方式父子组件通信兄弟组件通信 总结 Vue的介绍和特性
Vue是一款轻量级的JavaScript框架，用于构建用户界面。它的特点是简单易用、灵…
uni-app 实现考勤打卡功能
一、在页面中引入地图组件 <map id"map" style"width: 100%; height: 100%" :latitude"myLatitude" :longitude"myLongitude" :circles"circles" :markers"markers"> </map>属性名类型说明longitudeN…
uniapp上echarts地图钻取
1: 预期效果
通过切换地图 , 实现地图的钻取效果
2: 实现原理以及核心方法/参数
一开始是想利用更换地图数据的形式进行地图钻取 , 这就意味着我们需要准备全国30多个省份的地图数据 , 由于一开始考虑需要适配小程序端 , 如此多的地图文件增加了程序的体积 , 如果使用接口调…
uni-app：实现view元素强制换行（解决长字符和英文字符不换行问题）
效果
换行前 换行后 核心代码 word-wrap: break-word; 或 word-break: break-all; 完整代码demo
<template><view><view class"all_style"><view class"line1">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</view>…
uniapp四个元素点击那个哪个变色，其他的还变原来的颜色
在UniApp中，可以使用CSS伪类选择器和动态样式绑定来实现点击某个元素时改变其颜色的效果。假设有四个元素分别为A、B、C和D。
首先，为这四个元素添加一个共同的类名，例如"item"。
然后，在页面的样式中定义两种颜色&am…
前端-uniapp-开发指南
美团外卖微信小程序开发 uniapp-美团外卖微信小程序开发P1 成果展示P2外卖小程序后端，学习给小程序写http接口P3 主界面配置P4 首页组件拆分P13 外卖列表布局筛选组件商家 布局测试数据创建样式 请求商家外卖数据封装请求并发请求 uni-app框架调用https接口 开发小程…
uniapp获取公钥、MD5，‘keytool‘ 不是内部或外部命令，也不是可运行的程序 或批处理文件。
获取MD5、SHA1、SHA256指纹信息
通过命令的形式获取 winr调出黑窗口cd到证书所在目录输入keytool -list -v -keystore test.keystore,其中 test.keystore为你的证书名称加文件后缀按照提示输入你的证书密码，就可以查看证书的信息 通过uniapp云端查看(证书是在DClou…
uni-app 在已有的数据对象中动态添加更多的数据对象
原数据对象
flowData: {list: [], // 数据值column: 2, // 瀑布列数columnSpace: 2 // 瀑布列宽间距
}
动态添加后的数据对象
flowData: {list: [], // 数据值column: 2, // 瀑布列数columnSpace: 2, // 瀑布列宽间距column_1: [],column_2: []
}
动态添加更多的数据对象的…
uni-app：实现简易自定义下拉列表
效果 代码
<template><view><view class"dropdown-trigger" tap"showDropdown">{{ selectedItem }}</view><view class"dropdown-list" v-if"showList"><view class"dropdown-item" v-f…
uniapp-vue3微信小程序实现全局分享
uniapp-vue3微信小程序实现全局分享 文章目录 uniapp-vue3微信小程序实现全局分享微信小程序官方文档的分享说明onShareAppMessage(Object object)onShareTimeline() uniapp 官方文档的分享说明onShareAppMessage(OBJECT) 实现全局分享代码结构如下share.js文件内容main.js注意…
uniapp-vue3-弹出选择组件wo-pop-selector
wo-pop-selector弹出选择组件采用uniapp-vue3实现, 支持H5、微信小程序（其他小程序未测试过，可自行尝试） 可到插件市场下载尝试： https://ext.dcloud.net.cn/plugin?id14879
使用示例
<template><view><view c…
uni-app：本地缓存的使用
uni-app 提供了多种方法用于本地缓存的操作。下面是一些常用的 uni-app 本地缓存方法： uni.setStorageSync(key, data): 同步方式将数据存储到本地缓存中，可以使用对应的 key 来获取该数据。 uni.setStorage({key, data}): 异步方式将数据存储到本地缓存…
uniapp小程序中给web-view页面添加授权弹窗（使用cover-view组件覆盖实现该功能）
效果图： web-view是承载网页的容器。会自动铺满整个小程序页面，个人类型的小程序暂不支持使用。 再看下面一个提示： 每个页面只能有一个 web-view，web-view 会自动铺满整个页面，并覆盖其他组件。 也就是说，…
uniapp pc端和移动端列表上拉刷新加载分页
效果图：
tips: 实现了pc端和移动端兼容
代码实现：
html:
<view v-if"answerList.length > 1" style"padding:30rpx 0;color:#888;text-align: center;"><view>{{loadMore}}</view>
</view>data:
…
【uniapp微信小程序+springBoot（binarywang）
uniapp前端代码
<template><view><page-head :title"title"></page-head><view class"uni-padding-wrap"><view style"background:#FFF; padding:50rpx 0;"><view class"uni-hello-text uni-cente…
uniapp 小程序实现图片宽度100%、高度自适应的效果
因为image组件默认是有宽度跟高度的，所以这个高度不怎么好写 通过load事件来控制图片的高度 话不多说，直接上代码，
<image class"img" src"/static/image.png" :style"{ height: imgHeight px }"mode&q…
uniapp 在android手机上运行tab栏页面跳转问题
【问题描述】：
使用uniapp写的项目，在tab页面，无论使用哪种方式的跳转，只要是在url后面拼接参数，在打包成apk文件后，在手机上面安装使用，都是获取不到susIndex参数的，而在浏览器上面…
uni-app 瀑布流布局的实现
方式一：使用纯 CSS 实现 使用 flex 布局方式
<!-- 瀑布流布局 -->
<template><view class"container"><viewclass"cont-box":style"{ --layout-width: 100 / flowData.column - flowData.columnSpace % }"v-f…
在uniapp中开发年份弹出选择组件
多层组件嵌套
<template><view class""><view class"zq-imitate-input" click"toggleContent"><text v-if"valueStr.length > 0">{{ valueStr }}</text><text v-else>{{ datePlaceholder }}&…
uniapp使用uQRCode绘制二维码，下载到本地，调起微信扫一扫二维码核销
1.效果 2.在utils文件夹下创建uqrcode.js
// uqrcode.js
//---------------------------------------------------------------------
// github https://github.com/Sansnn/uQRCode
//---------------------------------------------------------------------let uQRCode {…
小程序原生代码转uniapp
写了一份小程序原生代码，想转为uniapp 再转为其他平台发布 1、在命令行里，运行【 npm install miniprogram-to-uniapp -g 】进行安装，因为这个包是工具，要求全局都能使用&#x…
uni-app：js二维数组与对象数组之间的转换
一、二维数组整理成对象数组
效果 [ ["前绿箭","DI10","RO1"], ["前红叉","DI2","RO2"], ["后绿箭","DI12","RO3"], ["后红叉","DI4","RO6"] ] …
go + uniapp 通过 微信 code 获取 appid 等信息 无废话
go uniapp 通过 微信 code 获取 appid 等信息 无废话
login.vue 通过 uni.login 获取 code
uni.login({"provider": "weixin","onlyAuthorize": true, // 微信登录仅请求授权认证success: (event) > {// 登录成功console.log(event);const…
uniapp图片加水印
1、uniapp加水印
1.1、创建画布容器
<canvas class"watermark-canvas" id"watermark-canvas" canvas-id"watermark-canvas":style"{ width: canvasWidth, height: canvasHeight }" />
1.2、获取水印内容
async getLocation(…
uniapp开发h5引入第三方js（sdk）
manifest.json 应用配置 | uni-app官网
根据文档上描述需要自定义模板的场景为： 起初以为是在原有的index.html基础上再新建一个html文件，最后发现不是，而是赋值文档里面的hmlt模板基础代码覆盖之前的index.html中的所有代码。
之前uniapp创…
uniapp如何处理图片加载过程中的错误
在uni-app中，处理图片加载过程中的错误可以采用以下几种方法：
新版本的 ChatGpt 助手 微信搜搜 文客微创
1. 使用网络请求拦截器：
uni-app提供了一个网络请求拦截器，可以在请求之前或之后进行拦截和处理。可以在请求拦截器中捕…
uniapp下载附件保存到手机（文件、图片）ios兼容
downloadFile(file)，其中file为下载的文件地址uni.downloadFile图片使用uni.saveImageToPhotosAlbum【安卓、ios都合适】文件使用uni.openDocument【安卓图片也可以用这个，ios会失败】
// 下载文件
export function downloadFile(file) {let acceptArr …
uniapp接入萤石微信小程序插件
萤石官方提供了一些适用于uniapp / 小程序的方案 如 小程序半屏 hls rtmp 等 都TM有坑 文档写的依托答辩 本文参考了uniapp小程序插件 以及 萤石微信小程序插件接入文档 效果如下 1. 插件申请
登录您的小程序微信公众平台，点击左侧菜单栏，进入设置页…
Uniapp 酷炫钱包页面模板 直接引用
使用教程
直接引用Vue页面 即可
<template><view><TCqianbao></TCqianbao></view>
</template>
<script>import TCqianbao from /uni_modules/TC-qianbao/pages/index.vueexport default {components:{TCqianbao},}
</script&…
uni-app 小宠物 - 会说话的小鸟
在 template 中
<view class"container"><view class"external-shape"><view class"face-box"><view class"eye-box eye-left"><view class"eyeball-box eyeball-left"><span class"…
浅谈uniapp中开发安卓原生插件
其实官方文档介绍的比较清楚而且详细,但是有时候他太墨迹,你一下子找不到自己想要的,所以我总结了一下开发的提纲,也是为了自己方便下次使用。
1.第一步,下载官方提供的Android的示例工程,然后倒入UniPlugin-Hello-AS工程请在App离线SDK中查找,之后Android studio,编译运行项目…
2023 uniapp( vue3 + TS )使用canvas生成海报并保存，taro/微信小程序也适用
有段时间没写vue了，有点生疏了......
1、代码有注释，完整代码如下
<template><view class"page"><canvas class"canvas" v-if"isShow" :style"{width:${canvasWidth}px,height:${canvasHeight}px}&…
uniapp map polygons 区域填充色（fillColor）在ios显示正常，但在安卓手机显示是黑色的,怎么解决？
uniapp map polygons 区域填充色（fillColor）在ios显示正常，但在安卓手机显示是黑色的,怎么解决？ <MapPage :longitude"item.centerCoord[0]" :latitude"item.centerCoord[1]":polygons"[{ points: it…
uni-app：实现picker下拉列表的默认值设置
效果 分析
1、在data中将index8的初始值设置为-1，表示未选择任何选项： index8: -1, //选择的下拉列表下标 2、在bindPickerChange8事件处理函数中添加条件判断。如果选择的值是-1，则将this.index8设置为"请输入"，否则将…
使用 @antfu/eslint-config 配置 eslint (包含兼容uniapp方法)
安装 pnpm i -D eslint antfu/eslint-config创建 eslint.config.js 文件
// 如果没有在 page.json 配置 "type": "module"
const antfu require(antfu/eslint-config).default
module.exports antfu()// 配置了 "type": "module" …
美食论坛大全订阅交流系统 uniapp+vue 微信小程序设计与实现
美食大全订阅小程序在系统的智能手机上可以运行，主要实现了首页、个人中心、用户管理、菜系管理、口味管理、美食分类管理、美食信息管理、美食论坛、系统管理等主要功能模块的操作和管理。 后端：java(springbootssm)/python/php/nodejs/ 开发运行&…
uniapp跨页面传递数据的几种方式
跨页面传递数据是在移动应用开发中非常常见和重要的功能。UniApp作为一个跨平台框架，提供了多种方式来实现数据的传递。下面将介绍几种常见的跨页面传递数据的方式，并给出相应的示例代码。
URL参数传递：
在源页面（例如pages/ind…
uniapp原生插件之安卓USB摄像头插件
插件介绍
安卓USB摄像头，支持拍照，录像，停止预览，开启预览，支持多摄像头切换 插件仅支持nvue页面 插件地址
安卓USB摄像头插件 - DCloud 插件市场
超级福利
uniapp 插件购买超级福利
详细使用文档地址
uniapp 安…
UNI-APP_nvue踩坑
踩坑1
1.nvue里面的样式不可以用预编译语言，只能用css； 2.不能随心所欲地使用选择器，nvue只支持单类选择器（不可以使用交集选择器和后代选择器，但可以使用并集选择器）； 3.div是容器，…
解决Hbulider 按F11不能退出免打扰模式
原因：F11快捷键并不是退出免打扰模式，需要覆盖配置
右侧如下图👇 [{"key":"ctrlf11","command":"workbench.action.distanceFreeMode"}
]
uniapp黑马优购
配置tabbar 使用 npm install escook/request-miniprogram 进行http请求
挂载到 uni.$http 上 uniapp小程序分包 访问的时候 携带分包目录 /subpkg/goods_detail/goods_detail git分支使用
# 创建并使用分支
git checkout -b home
git commit
# 推送到远程的home分支…
uniapp(uncloud) 使用生态开发接口详情1(创建项目)
开发接口对比时间: 用java开发接口周期太长, 大概5-6个月左右 用php 开发接口周期同样太长, 大概3-4个月左右 用node.js 开发接口周期相对短一点, 大概1-2个月左右 用uniapp 开发接口, 可以不到 1-2周的时间
这里我使用 uniapp 开发接口, 废话不多说了,直接开干 HBuilder官网(…
promise返回值多层嵌套
实际上打印的是promise的res不是api接口返回值
因为用apifox测试开发服务器的代理接口，和不加代理测试返回值相同： http://localhost:3030是vue开发代理。 "D:\code\jeecg\vue\job-app-master\manifest.json" "proxy" : {"/ap…
uni-app：js实现数组中的相关处理
一、查询数组中，某一项中的某个数据为指定值的项（find() 方法）
使用分析 使用数组的 find() 方法来查询 id 为 0 的那一项数据。这个方法会返回满足条件的第一个元素，如果找不到符合条件的元素，则返回 undefined。使用…
【uniapp/uView】解决消息提示框悬浮在下拉框之上
需要实现这样的效果，即 toast 消息提示框在 popup 下拉框之上： 解决方法，把 <u-toast ref"uToast" /> 放在 u-popup 里面即可，这样就可以提升 toast 的优先级：
<!-- 弹出下拉框 --><u-popu…
uni-app结合laravel实现免登陆
最近发现一个挺好玩的东西，免登陆积分商城，仔细研究分析后得出结论，无论是商城还是其他，免登录都可以玩玩的。原理也很简单，浏览器都有指纹ID，APP有设备唯一标识，最终选择使用uni-app与laravel写…
uniapp实现登录组件之外区域置灰并引导登录
实现需求 每个页面需要根据用户是否登录决定是否显示登陆组件,登录组件半屏底部显示,登录组件之外区域置灰,功能按钮点击之后引导提示登录.页面效果如下:
实现思路说明 设置登录组件背景颜色为灰色,将页面分成登录区域(底部)和非登陆区域(上面灰色显示部分), 置灰区域添加…
uniapp开发小程序—picker结合后台数据实现二级联动的选择
一、效果图 二、完整代码
<template><view><picker mode"multiSelector" change"bindMultiPickerChange" columnchange"bindMultiPickerColumnChange":value"multiIndex" :range"multiArray"><view c…
♥ uniapp 环境搭建
♥ uniapp 环境搭建
开发uniapp需要用到的工具有两个：
1、用到的平台和地址：
需要了解的几个平台以及地址：
（1）微信公众平台
https://mp.weixin.qq.com/
（2）微信开发文档
https://develo…
微信小程序 人工智能志愿者服务活动报名系统uniAPP+vue
基于java语言设计并实现了人工智能志愿者服务APP。该APP基于B/S即所谓浏览器/服务器模式，应用SpringBoot框架与HBuilder X技术，选择MySQL作为后台数据库。系统主要包括用户、志愿活动、活动报名、活动签到、服务职责、服务排行等功能模块。 本文首先介绍…
jeecg-uniapp 杂七杂八数据
uniapp 点击事件
tap: 单击事件
confirm: 回车事件
blur:失去焦点事件
touchstart: 触摸开始事件
touchmove: 触摸移动事件。
touchend: 触摸结束事件。
longpress: 长按事件。
input: 输入框内容变化事件。
change: 表单元素值变化事件。
submit: 表单提交事件。
scroll: 滚动…
uniapp-自定义表格，右边操作栏固定
uniapp-自定义表格，右边操作栏固定
在网上找了一些，没找到特别合适的，收集了一下其他人的思路，基本都是让左边可以滚动，右边定位，自己也尝试写了一下，有点样式上的小bug，还在尝试修…
【uniapp】顶部和底部导航栏无法正常显示
关于顶部导航栏不显示的问题： 顶部导航栏在配置了 navigationBarTitleText 还是无法显示，如果是使用他人的项目结构，需要检查是否已经被配置了自定义导航栏： "navigationStyle": "custom" "globalStyle&…
uniapp原生插件之无预览静默拍照
插件介绍
无预览静默拍照，在用户无感觉情况下调用摄像头拍照
插件地址
无预览静默拍照 - DCloud 插件市场
超级福利
uniapp 插件购买超级福利
插件申请权限
存储卡读写权限摄像头权限
manifest.json权限列表
/* android打包配置 */"android" : {…
基于uniapp与uview做一个按拼音首字母排序的通讯录页面
效果图： 第一步导入pinyin库并应用，用于区分汉字的拼音首字母
npm i pinyin
import pinyin from "pinyin"
完整算法：
function getListByPinyinFirstLetter(data) {const newList {};for (const item of data) {let firstLett…
uni-app 微信小程序 搜索关键字后 结果中的关键字变色
如图：想实现搜索关键字，搜索到的内容中把包含的此字变为蓝色。 实现方式如下：此方式是uniapp开发运行到微信小程序的代码。
第一种方法：小程序自己实现
1.布局写法
*[HTML]: 没有使用花括号渲染,所以需要 $options.filters 来…
UNI-APP apk使用io流进行文件操作
一、manifest.json中增加权限
"<uses-permission android:name\"android.permission.WRITE_SETTINGS\"/>","<uses-permission android:name\"android.permission.WRITE_EXTERNAL_STORAGE\"/>","<uses-permission…
uniapp写一个计算器用于记账（微信小程序，APP）
提要：自己用uniapp写了一个记账小程序（目前是小程序），写到计算器部分，在网上找了别人写的计算器，大多数逻辑都是最简单的，都不能满足一个记账计算器的基本逻辑。与其在网上找来找去，…
uniapp在APP端使用swiper进行页面不卡顿滑动
uniapp在APP端使用swiper进行页面会卡顿，主要是渲染的数据有点多，这里只渲染三个数据就不好那么卡顿了，每次滑动后更新数据
<view><swiper change"changePoint" circular :disable-touch"disableTouch"><…
命令行创建uni-app 项目（vue3+ts）
一，通过HBuilderX创建 创建 vue3vite 工程 //创建以 javascript 开发的工程
npx degit dcloudio/uni-preset-vue#vite my-vue3-project //创建以 typescript 开发的工程
npx degit dcloudio/uni-preset-vue#vite-ts my-vue3-project 如果出现报错，!…
uni-app离线打包在android studio创建的.jks证书，签名文件获取MD5问题
获取证书信息
keytool -list -v -keystore test.keystore
获取的信息中没有md5信息 可以使用以下方式获取md5.
先创建签名文件，放到项目目录下 配置build.gradle文件 在android studio 打开终端输入以下命令
./gradlew signingReport 等待生成签名。 生成的内容…
前端uniapp提交表单调用接口方法最新
目录 源码1源码2最后 源码1
<template><view class"my-add-bank-card"><!-- name"bank_name" form表单提交的input里面一定要加name绑定要传的参数 name"bank_name" type"text" v-model"address.bank_name"…
uniapp原生插件之安卓华为统一扫码HMS Scan Kit
插件介绍
华为统一扫码服务（Scan Kit）提供便捷的条形码和二维码扫描、解析、生成能力
插件地址
安卓华为统一扫码HMS Scan Kit - DCloud 插件市场
超级福利
uniapp 插件购买超级福利
详细使用文档
详细使用文档
插件申请权限
android.permi…
【uniapp】proxy 代理切换至线上测试地址调试接口
本地测试地址形如：http://192.168.124.x:xxxx 线上测试地址形如：https://xxxx.xxxx.com 使用线上地址之后需要修改配置项 secure 为 true
const constant require(./src/utils/constant)
module.exports {devServer: {proxy: {/api: {target: constan…
使用命令行cli脚手架创建uniapp项目（微信小程序、H5、APP）
除了使用HBuilderX工具可视化搭建项目外，DCloud官方还提供了一个脚手架用于命令行搭建项目。
uni-app项目支持 uni cli和 HBuilderX cli两种脚手架工具： uni cli：面向非HBuilderX的用户（如习惯使用vscode/webstorm的开发者&#…
一个使用uniapp+vue3+ts+pinia+uview-plus开发小程序的基础模板
uniappuviewPlusvue3tspiniavite 开发基础模板
使用 uniapp vue3 ts pinia vite 开发基础模板，拿来即可使用，不要删除 yarn.lock 文件，否则会启动报错，这个可能和 pinia 的版本有关，所以不要随意修改。
拉取代码…
uni-app---- 点击按钮拨打电话功能点击按钮调用高德地图进行导航的功能【安卓app端】
uniapp---- 点击按钮拨打电话功能&&点击按钮调用高德地图进行导航的功能【安卓app端】
先上效果图： 1. 在封装方法的文件夹下新建一个js文件，然后把这些功能进行封装
// 点击按钮拨打电话
export function getActionSheet(phone) {uni.showAct…
uni-app华为审核被拒，驳回原因：您的应用在运行时，未见向用户告知权限申请的目的
华为审核被拒： 您的应用在运行时，未见向用户告知权限申请的目的，向用户索取(相机存)等权限，不符合华为应用市场审核标准。 <uni-popup ref"perpopup" type"center" :mask-clickfalse><view class&qu…
uniapp 设置 editor 默认值
dom 元素长这样
<editor id"editor" value12323 class"ql-container container" placeholder"开始输入..." ready"onEditorReady" blur"submit"></editor>
注意赋值必须要用 data 里面变量数据 不要let 定义…
uniapp 实现路线规划
UniApp是一个跨平台的应用开发框架，可以帮助开发者快速地在多个平台上构建应用程序。其中，实现路线规划是一个常见的需求，特别是对于地图类应用或者出行类应用来说，路线规划功能是非常重要的。
首先引入QQMapWX； impo…
Uniapp小程序MBG 开发踩坑日记
最近开发一套微信音乐小程序框架使用vue3，但还是要吐槽一下，有时候会突然报错，怎么也调试不好，过段时间自己又好了，这让开发者体验极差。下面说下遇到的一些问题
Extraneous non-emits event listeners (close) were …
移动端表格分页uni-app
使用uni-app提供的uni-table表格 网址：https://uniapp.dcloud.net.cn/component/uniui/uni-table.html#%E4%BB%8B%E7%BB%8D
<uni-table ref"table" :loading"loading" border stripe type"selection" emptyText"暂无更多数据…
开发知识点-uniapp微信小程序-开发指南
uniapp uni.chooseLocationgetCurrentPages美团外卖微信小程序开发uniapp-美团外卖微信小程序开发P1 成果展示P2外卖小程序后端，学习给小程序写http接口P3 主界面配置P4 首页组件拆分P13 外卖列表布局筛选组件商家 布局测试数据创建样式 请求商家外卖数据封装请求并…
tab栏切换，路径传参写死的情况，切换一次路径随之改变
tab栏，使用uview提供的tabs 网址：https://uviewui.com/components/tabs.html
<u-tabs :list"tabsList" :scrollable"false" change"tabsChange" :current"tabsCurrent"></utabs>
<view class&q…
uniapp+vue+Springboot 公司网站0~1搭建 前端前期设计篇
原型图
client
https://www.xiaopiu.com/h5/byId?typeproject&id653bc791940bbb14e4feeecf
admin
客户端
apph5
页面
首页展示 经典用户案例轮播图设计师轮播图 经典用户案例 经典案例搜索详情经典案例详情 设计师查询（待定）
后台管理
…
uni-app:前端实现心跳机制（全局）+局部页面控制心跳暂停和重新心跳
一、App.vue全局中写入心跳 在data中定义变量heartbeatTimer，便于暂停心跳使用在onLaunch中引用开始心跳的方法startHeartbeat()写入开始心跳方法写入暂停心跳方法写入请求后端刷心跳机制 定义变量
// 在全局设置的心跳机制中添加一个变量来保存定时器的标识
data(…
![[uni-app]记录APP端跳转页面自动滚动到底部的bug](https://img-blog.csdnimg.cn/53bc21c0fbc94bc1b450a3c9fa432ee3.png)
[uni-app]记录APP端跳转页面自动滚动到底部的bug
文章目录 bug描述原因分析: 处理方案 bug描述
1.点击的A页面, 跳转到了B页面, 第一次页面正常显示 2.从B页面返回A页面 3.A页面不进行任何操作,再次点击A页面进入B页面 4.B页面自动滚动到底部.
原因
看一段A页面代码 let that thisthis.defaultScrollTop uni.getStorageSy…
Uniapp矩阵评分组件
uniapp矩阵评分组件支持自定义图标、选择颜色、评分等级。
<template><view style"width: 100%;overflow: hidden;"><view class"flex-sub flex-table flex flex-direction-column":style"{ --table-border-color: tableBorderColor…
vue和uni-app的递归组件排坑
有这样一个数组数据，实际可能有很多级。
tree: [{id: 1,name: 1,children: [{ id: 2, name: 1-1, children: [{id: 7, name: 1-1-1,children: []}]},{ id: 3, name: 1-2 }]},{id: 4,name: 2,children: [{ id: 5, name: 2-1 },{ id: 6, name: 2-2 }]}
]要渲染为下面…
九宫格 图片 自定义 路径
<image :src" ../../static/img/ item.urlname .png " class"u-w-82 u-h-82 u-p-t-36"></image>使用场景：九宫格里含有多张图片 html
<view class"u-p-b-46 u-p-x-35"><u-grid :border"false" c…
【开题报告】基于uni-app的恋爱打卡app的设计与实现
1.选题背景
如今，随着移动互联网的普及和人们对生活品质的追求，恋爱已经成为了许多人关注的焦点。然而，在恋爱过程中，由于种种原因，往往会忽略掉一些重要的时刻和细节，导致感情降温甚至破裂。因此…
windows电脑连接Android和iPhone真机调试
windows电脑连接Android和iPhone真机调试 目前用的是Hbuilder X编辑器，在正常情况下，Android手机需要在 "设置 ----> 更多设置 ----->关于手机 ------> 版本号（手指点击5-7下即可打开开发者模式）"(我的是vivo的…
【uniapp】本地资源图片无法通过 WXSS 获取，可以使用网络图片，或者 base64，或者使用image标签
uniapp开发 微信小程序 本地资源图片无法通过 WXSS 获取，可以使用网络图片，或者 base64，或者使用image标签。_uniapp 中的本地资源图片无法通过 wxss 获取,可以使用网络图片,或者 base64,或者_芒果大胖砸的博客-CSDN博客
【bug】uniapp的image组件渲染gif图，只有第一次点击的时候有动效，需要每次点击都有gif效果，已解决
前两天遇到的问题，暂时没有解决，就搁置了。 不解决又难受，还好今天解决了，记录下
需求： 两个gif图，分别代表点击之后的男生和女生，并且有两个静态的男生和女生图片
当男生静态图被点击的时候切…
uni-app - 弹出框
目录 1.基本介绍 2.原生uinapp 通过uni.showActionSheet实现
3.使用组件 Popup 弹出层 ③效果展示 1.基本介绍 弹出框让我们在需要时在屏幕底部弹出一个菜单，它通常用于在各种应用程序中进行选择操作。Uniapp为我们提供了基本的底部弹出框组件，但它也有…
基于Android个人理财家庭收支系统uniAPP+vue -hbuiderx-微信小程序vj9n8
摘 要 个人理财APP设计的目的是为用户提供对活动信息和提醒信息管理等方面的平台。 与PC端应用程序相比，个人理财的设计旨在为用户提供一个个人理财信息的管理。用户可以通过APP及时收入信息和支出信息，并对提醒消息进行查看等。 个人理财APP是在Androi…
uni-app开发微信小程序 vue3写法添加pinia
说明
使用uni-app开发，选择vue3语法，开发工具是HBliuderX。虽然内置有vuex，但是个人还是喜欢用Pinia，所以就添加进去了。 Pinia官网连接
添加步骤
第一步：
在项目根目录下执行命令： npm install pinia …
uniapp 下载文件到手机
下载后端传递过来的文件
let thil this
uni.showLoading({title: 下载中,mask:true
})
uni.downloadFile({url: 接口地址, //仅为示例，并非真实的资源header: {"Authorization": token},responseType: blob,success: (res) > {if (res.statusCode 2…
uniapp：人脸识别功能，已测试，直接复制源码，支持H5，APP安卓。不依赖任何js，SDK。
先看效果图H5： APP效果图： H5：H5端代码用.html实现，uniapp打包H5拉相机有问题，不多赘述。 时间原因没有适配，直接用的px单位， 注意：本地无法测试，必须传到线上之后，通过https访问才能正常开启摄像头！！！ <!DOCTYPE html>
<html lang="en">…
uniapp的启动页、开屏广告
uniapp的启动页、开屏广告 启动页配置广告开屏 启动页配置
在manifest.json文件中找到APP启动界面配置，可以看到有Android和iOS的启动页面的配置 ，选择自定义启动图即可配置
广告开屏
在pages中新建一个广告开屏文件并在pases.json的最顶部配置这个页…
uniapp - 开关按钮
目录 1.运行代码如下：
2.运行效果
3.switch属性 1.运行代码如下：
<template><view class"switchBox"><switch change"switchChange" color"#F21177" :checked"form.checked" /></view&…
【开题报告】基于uni-app的校园活动签到APP的设计与实现
1.选题背景与意义
1.1选题背景
随着校园活动的日益丰富多彩，学校和组织频繁举办各类活动，如讲座、比赛、社团活动等。而这些活动通常都需要进行签到管理，以便对参与人数进行统计、管理活动流程等。传统的纸质签到方式存在诸多问题ÿ…
如何在uni-app小程序端实现长按复制功能
在开发小程序应用中，常常需要使用到长按复制功能。本文将介绍如何在uni-app小程序端实现长按复制功能。
uni-app是一个跨平台的开发框架，可以基于vue.js语法开发小程序、H5、APP等多个平台的应用。uni-app提供了一些内置组件和API，可以方便地…
uniapp+vue3+ts+vite+echarts开发图表类小程序，将echarts导入项目使用的详细步骤，耗时一天终于弄好了
想在uniapp和vue3环境中使用echarts是一件相当前卫的事情，官方适配的还不是很好，echarts的使用插件写的是有些不太清晰的，这里我花费了一天的时间，终于将这个使用步骤搞清楚了，并且建了一个仓库，大家可以直…
uni-app开发微信公众号 H5打开扫一扫功能
<!--引入微信sdk-->
<script src"http://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>let url location.href.split(#)[0];newApi.getSignature({ url }).then(res > {if (res.code 0) {this.sdk.config({beta: true, // 必须这么写&a…
uni-app基于vite和vue3创建并集成pinia实现数据持久化
一、uni-app基于Vite和Vue3创建并集成pinia实现数据持久化 文章目录 一、uni-app基于Vite和Vue3创建并集成pinia实现数据持久化1.如何创建基于Vite和Vue3的uni-app项目？2.选择其中一个分支，就是一个脚手架 二、以下都是基于vite-ts版本创建和配置1.目录结…
【uniapp】 video视频层级、遮挡其他弹窗或顶部导航 使用nvue覆盖
uniapp 顶部导航和弹窗被video遮挡解决办法 第一步：配置 subNVues {"path": "pages/index/index","style": {"navigationBarTitleText": "uni-app","navigationStyle": "custom","app-…
uview-plus中二级菜单左右联动更改为uni-app+vue3+vite写法
uview-plus3.0重磅发布，全面的Vue3移动组件库 该插件使用的vue2写法，但支持vue3引用，在此基础上修改为uni-appvue3vite; <template><view class"u-wrap mainClass"><!-- <back-header :title"pageTitle&quo…
Java 实现uniapp本机手机号一键登录
这里简单的贴一下后端的解析代码 其他配置项参照uniapp的官方文档配置就好了 这里的accessToken和openid是前端请求uCloud获取的 Data
public class UniAppLoginVO {private Integer code;private String message;private ResultDataVO data;private Boolean success;private R…
uniapp heckbox-group实现多选
文章目录 html 代码JS 代码 混了业务逻辑，谨慎观看 html 代码
<view><!--可滚动视图区域。用于区域滚动 --><scroll-view :style"{ height: clientHeight px }" :scroll-top"scrollTop" scroll-y"true"scrolltouppe…
利用百度地图api获取经纬度和uniapp定位计算距离
获取百度地图api，成为开发者，去控制台创建应用得到一个ak就可以了 百度地图开放平台网址：百度地图开放平台 | 百度地图API SDK | 地图开发 后端是node
// 根据百度api地址获取经纬度 https://lbsyun.baidu.com/async getLocation(val) {try …
uni-app——項目day01
配置uni-app開發環境
uni-app快速上手 | uni-app官网 创建项目
图中四个划线就是要配置的地方.
选择vue2还是vue3看个人选择。 目录结构
但是现在新版本创建的项目已经没有components目录了，需要自己创建。 项目运行到微信开发者工具 使用git管理项目
node-mod…
使用android studio开发flutter应用，10分钟环境配置
1.安装flutter sdk
安装中文官网配置环境即可：安装和环境配置 - Flutter 中文文档 - Flutter 中文开发者网站 - Flutter
然后如果你的网络不好的话，可以修改flutter的源地址，将下面的变量创建成新的环境变量
FLUTTER_STORAGE_BASE_URLhttp…
Uniapp 中，能够同时兼容H5、web、app、微信小程序的引入高德地图的语法格式
在 Uniapp 中，可以通过使用 uni-app 统一的 API 来同时兼容 H5、web、App 和微信小程序，而引入高德地图则有以下两种语法格式供选择：
使用 Vue.js 的语法格式：
<template><view><map :longitude"longitude&…
【uniapp】签名组件，兼容vue2vue3
网上找了个源码改吧改吧，清除了没用的功能和兼容性，基于uniapp开发的 样子 vue2 使用方法，具体的可以根据业务自行修改 <signature ref"signature" width"100%" height"410rpx"></signature>confi…
uniapp本地存储的几种方式
在uniapp开发中，本地存储是一个常见的需求。本地存储可以帮助我们在客户端保存和管理数据，以便在应用程序中进行持久化存储。本文将介绍uniapp中本地存储的几种方式，以及相关的代码示例。 介绍
在移动应用开发中，我们经常需要将一…
带你用uniapp从零开发一个仿小米商场_3.animate.css动画库在uniapp中的使用
这篇文章仅做简单介绍animate.css动画库在uniapp中如何使用
animate.css动画库引入
怕有人没看专栏前面的文章,所以这里重新介绍一边animate.css动画库的引入,知道的可以跳过
可以在这里下载
animate.css动画库官网http://www.animate.net.cn/
下载好animate.css后在项目根…
uniapp蓝牙搜索设备并列表展示
1.需求：3.0的桩可以值扫码通过蓝牙名字直接绑定，2.0的桩二维码无蓝牙名称则需通过蓝牙列表来绑定 2.碰到问题 1.0 蓝牙列表需要去重（蓝牙列表通过deviceId去重再放进展示列表） 2.0页面会卡顿（调用my.stopBluetoothDevi…
uniapp原生插件之安卓TCP原生插件
插件介绍
安卓TCP插件支持自定义心跳数据，自定义心跳时间，断开连接时返回自定义数据等
插件地址
安卓TCP原生插件 - DCloud 插件市场
超级福利 uniapp 插件购买超级福利
详细使用文档
uniapp 安卓TCP原生插件使用文档
用法
在需要使用插件…
uniapp: 前端利用百度云OCR实现文字识别（身份证识别功能，别的功能类似）
第一章 前言
介绍如何使用百度智能云实现我们想要的效果，需要在下面这个网址注册账号： 百度智能云-云智一体深入产业 使用文档在该网址上： 简介 - 文字识别OCR 请求成功的效果，如下图： 搜索产品（例如文字…
uni-app android js判断数值是否是数组
判断是否是数组有的方法不适用，如instanceof
推荐的解决方式：
Object.prototype.toString.call(value) [object Array]
Uniapp使用AES128加解密16进制
在对接低功耗蓝牙时，我们需要对蓝牙传输数据进行加解密，由于我们对接的命令是16进制，如5500020101aa00，每个16进制表示特定的含义，所以直接对16进制加解密
import CryptoJS from crypto-js// AES128 加密函数
functio…
【开题报告】基于uni-app的污水处理厂的工单处理APP的设计与实现
1.研究背景
污水处理厂是城市环境管理中非常关键的一环，它们负责处理城市生活污水和工业废水，保障了城市环境的清洁和健康。在污水处理厂的日常运营中，工单处理是一个不可或缺的环节，它涉及到设备维护、故障修复、数据记录等多个…
uniapp使用v-for页面不刷新解决办法
项目场景：
做一个项目，v-for循环数据库数据，使用uni-load-more，结果发现...
DOM中的列表却没有更新 解决方案：
根据网上教程，加了一个触底函数onReachBottom，结果发现无论如何也更新不了DOM中…
基于Java+Vue+uniapp微信小程序商品展示系统设计和实现
博主介绍：✌全网粉丝30W,csdn特邀作者、博客专家、CSDN新星计划导师、Java领域优质创作者,博客之星、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和毕业项目实战✌ 🍅文末获取源码联系🍅 👇🏻 精彩专…
uni-app多端开发
uni-app 多端开发 一、命令创建uni-app 项目二、在微信小程序后台找到 appId 填写 appId三、运行项目四、使用 uni-ui4-1、下载4-2、自动导入4-3、ts项目下载类型校验 （uni-ui 组件库）4-3-1、下载4-3-2、配置 五、持久化 pinia六、数据请求封装七、获取组…
nodejs express vue uniapp电影购票系统源码
开发技术：
node.js，vscode，HBuilder X
express vue elementui uniapp
功能介绍：
用户端：
登录注册
首页显示搜索电影，轮播图，电影分类，最近上架电影
点击电影进入电影详情&am…
【uniapp】通用列表封装组件
uniapp页面一般都会有像以下的列表页面，封装通用组件，提高开发效率； （基于uView前端框架）
首先，通过设计图来分析一下页面展示和数据结构定义 w-table组件参数说明
参数说明类型可选值默认值toggle列表是…
uni-app微信小程序如何开发蓝牙功能
一. 前言。
蓝牙功能在我们日常软件中的使用率还是蛮高的----譬如各类共享单车/电单车。正因此，我们开发中接触蓝牙功能也是日渐增长。对于很多从未开发过蓝牙功能的童鞋来说，当PM小姐姐扔过来一个蓝牙协议要你接入时，简直一头雾水ÿ…
Uniapp开发 购物商城源码 在线电商商城源码 适配移动终端项目及各小程序
lilishop电商商城系统 商城移动端，使用Uniapp开发，可编译为所有移动终端项目及各小程序 源码下载：https://download.csdn.net/download/m0_66047725/88487579
源码下载2：关注我留言
如何绕过某讯手游保护系统并从内存中获取Unity3D引擎的Dll文件
某讯的手游保护系统用的都是一套，在其官宣的手游加固功能中有一项宣传是对比较热门的Unity3d引擎的手游保护方案，其中对Dll文件的保护介绍如下， “Dll加固混淆针对Unity游戏，对Dll模块的变量名、函数名、类名进行加密混淆处理&…
uniapp使用u-checkbox
当使用uni-app开发时，可以使用u-checkbox组件来实现复选框功能。以下是一个更详细的例子，展示如何在uni-app中使用u-checkbox组件，并介绍一些相关的API用法。
首先，确保已经安装并引入了u-checkbox组件。可以通过在页面的<tem…
uniapp项目笔记
1.生成二维码 import uqrCode from /static/erweima.js uqrCode.make({canvasId: qrcode,componentInstance: this,text: JSON.stringify(item.id),size: 150,margin: 0,backgroundColor: #ffffff,foregroundColor: #000000,fileType: jpg,errorCorrectLevel: uqrCode.errorCor…
uni-app 微信小程序之自定义圆形 tabbar
文章目录 1. 自定义tabbar效果2. pages新建tabbar页面3. tabbar 页面结构4. tabbar 页面完整代码 1. 自定义tabbar效果 2. pages新建tabbar页面
首先在 pages.json 文件中，新建一个 tabbar 页面
"pages": [ //pages数组中第一项表示应用启动页ÿ…
uniapp小程序分包页面引入wxcomponents(vue.config.js、copy-webpack-plugin)
实例：小程序添加一个源生小程序插件，按照uniapp官方的说明，要放在wxcomponents。后来发现小程序超2m上传不了。 正常的编译情况 会被编译到主包下 思路：把wxcomponents给编译到分包sub_package下
用uniapp的vue.config.js自定义…
uniapp-距离distance数字太长，截取保留前3为数字
1.需求 将接口返回的距离的字段，保留三位数显示。 2.实现效果 3.代码：
1.这是接口返回的数据： 2.调取接口，赋值前先处理每条数据的distance <view class"left">距你{{item.distance}}km</view>listFun() …
uni-app 微信小程序之自定义navigationBar顶部导航栏
文章目录 1. 实现效果2. App.vue3. pages.json 配置自定义4. 顶部导航栏 使用 微信小程序自定义 navigationBar 顶部导航栏，兼容适配所有机型 1. 实现效果 2. App.vue
在App.vue 中，设置获取的 StatusBar，CustomBar 高度（实现适配…
uniapp长按图片识别二维码
引用：https://blog.csdn.net/weixin_48596030/article/details/125405779
<image :src"url" mode"widthFix" click.self"previewImage" show-menu-by-longpress"true" style"width: 350rpx;"></image…
uniapp刻度尺的实现（swiper）滑动打分器
实现图（百分制）：滑动swiper进行打分，分数加减 <view class"scoring"><view class"toggle"><view class"score"><text>{{0}}</text><view class"scoreId&quo…
【uniapp uview】u--textarea组件custom validator check failed for prop “confirmType“
加一行：confirmType"done"即可。<UTextarea> at node_modules/uview-ui/components/u-textarea/u-textarea.vue<UTextarea> at node_modules/uview-ui/components/u--textarea/u--textarea.vueat pages/notice/noticeDetail.vueuview 文档地址…
Uniapp-小程序自定义导航栏
一、项目背景
制作小程序页面时候发现原生导航栏有一定的高度是没有背景渲染的会出现这种情况 但是我们需要的是 二、原因
小程序的原生导航栏存在。一般可以使用 纯色填充顶部栏
可以直接使用navigationBarBackgroundColor完成
在style中添加 "navigationBarBackgrou…
uni-app 蓝牙打印, CPCL指令集使用
先上代码:
GitHub - byc233518/uniapp-bluetooth-printer-demo: 使用uniApp 连接蓝牙打印机 Demo, CPCL 指令简单实用示例
(内含 芝珂,佳博,精臣 多个厂家指令集使用文档)
文件结构:
├── App.vue ├── CPCL 指令手册.pdf // 指令集参考手册 ├── LICENSE ├── R…
uniapp+vue3使用pinia，安卓端报错白屏
报错内容：
reportJSException >>>> exception function:createInstanceContext, exception:white screen cause create instanceContext failed,check js stack ->at useStore2 (app-service.js:1487:15)at (app-service.js:1714:17)at (app-serv…
uni-app - 日期 · 时间选择器
目录
1.基本介绍
2.案例介绍 ①注意事项： ②效果展示
3.代码展示 ①view部分
②js部分
③css样式 1.基本介绍 从底部弹起的滚动选择器。支持五种选择器，通过mode来区分，分别是普通选择器，多列选择器，时间选择器&a…
小程序Tab栏与页面滚动联动
小程序tab栏切换与页面滚动联动 tab栏与页面滚动联动点击tab栏页面跳到指定位置滚动页面时切换tab栏 tab栏与页面滚动联动
在进行小程序开发时，需要实现点击tab栏页面滚动到某一指定位置，并且滚动页面时，小程序的tab栏进行切换。 在一开始&a…
uniapp项目开发的功能点
一.手机
判断什么手机 const platform uni.getSystemInfoSync().platform;//platform ios什么机型
const model uni.getSystemInfoSync().model //model.toindex(iPhone)二.授权登录
授权登录有2种方式
（一）静默授权
就直接通过uni.login 获取c…
【uni-app】设置背景颜色相关
1. 全局页面背景色设置：
在App.vue的style样式表中设置
<style>
page {background-color: #F0AD4E;
}
</style> 2. 顶部导航栏背景色设置：
在pages.json页面路由中，globalStyle设置
"globalStyle": {"navi…
uniapp实现表单弹窗
uni.showModal({title: 删除账户,confirmColor:#3A3A3A,cancelColor:#999999,confirmText:确定,editable:true,//显示content:请输入“delete”删除账户,success: function (res) {console.log(res)if(res.confirm){if(res.contentdelete){console.log(123123123213)uni.setSto…
uniapp大概是怎么个开发法（前端）
写在前面，博主是个在北京打拼的码农，从事前端工作5年了，做过十多个大大小小不同类型的项目，最近心血来潮在这儿写点东西，欢迎大家多多指教。 对于文章中出现的任何错误请大家批评指出，一定及时修改。有任何…
前端uniapp列表下拉到底部加载下一页列表【下拉加载页面/带源码/实战】
目录 一. 图片1.2. 二.list.vue三.uni-load-more.vue最后 一. 图片
1. 2. 二.list.vue
<template><view><!--列表--><scroll-view scroll-y"true" class"scroll-Y" :style"height: scrollviewHigh px;" lower-threshol…
uniapp-轮播图点击预览功能
实现效果 点击后打开预览图 实现代码
<swiper v-if"this.bannerList.length > 1" class"swiper" autoplay"true" duration"500" interval"2000" change"changeSwiper"><swiper-item class"swip…
中级程序员——uniapp和小程序面试题
😄博主：小猫娃来啦 😄文章核心：uniapp和小程序面试题 文章目录 用uniapp有遇到一些兼容性问题吗？uniapp最大的优点是什么？uniapp如何实现多端兼容？uniapp是如何做跨端适配的？常用的u…
【uniapp】Google Maps
话不多说 直接上干货 提前申请谷歌地图账号一、新建地图 使用h5获取当前定位或者使用三方uniapp插件 var coords ""navigator.geolocation.getCurrentPosition(function(position) {coords {lat: position.coords.latitude,lng: position.coords.longitude};lats …
uniapp的Vue2，Vue3配置跨域（proxy代理）
vue2
找到manifest.json文件，通过源码视图的方式打开文件：在文件中添加一下代码即可完成代理：
"h5": {"devServer": {"disableHostCheck": true, //禁止访问本地host文件"port": 8000, //修改项目…
【uniapp】确认弹出框，选择确定和取消
代码如下：
<view style"display: flex; justify-content: space-around;"><button class"button" click"submit">t提交</button>
</view>submit(){let thatthisuni.showModal({title: 提示：,con…
uniapp+vite+vue3开发跨平台app，运行到安卓模拟器调试方法
因为没有使用hbuilder开发uniapp，而是使用了vscode和vite来开发的，所以怎么将这个程序运行到安卓模拟器调试开发呢？其实方法很简单，使用android studio创建一个模拟器或者其他mumu模拟器，然后将项目使用hbuilder打开&a…
uniapp 开发微信小程序，列表页面超出设置的高度，页面超出边距后页面晃动，在样式page{}下尝试以下属性
overflow: hidden;
touch-action: none;
uniapp 打包后各静态资源加载失败的问题(背景图,字体等)
原因:
1.部署地址不在域名根目录下 解决办法(推荐办法2):
办法1.如果部署在域名的文件夹下(例如h5), 则运行的基础路径修改为/h5/ 且注意路由模式
办法2.不修改运行的基础路径(还是./), 将代码中涉及背景图(background-image)和字体资源的路径前统一加,如图:
nodejs express vue uniapp新闻发布系统源码
开发技术：
node.js，mysql5.7，vscode，HBuilder
nodejs express vue uniapp
功能介绍：
用户端：
登录注册
首页显示搜索新闻，新闻分类，新闻列表
点击新闻进入新闻详情࿰…
uniapp开发断小程序-如何判断小程序是在手机端还是pc端打开
官方说明
https://developers.weixin.qq.com/miniprogram/dev/devtools/pc-dev.html
小程序如何判断是 PC 平台？
通过 getSystemInfo 官方接口（platform 是 windows） 通过 UA（PC UA 包含 MiniProgramEnv/Windows）
…
uni-app小程序 swiper 分页器样式修改
小程序中使用 wx-swiper-dot和wx-swiper-dot-active选择器 H5中使用uni-swiper-dot和uni-swiper-dot-active选择器 .swiper {height: 408px;margin-bottom: 28rpx;::v-deep .uni-swiper-dot {background: #e7e7e7;&.uni-swiper-dot-active {background: #b1b1b1;}}// #ifde…
uniapp开发小程序-pc端小程序下载文件
fileName包含文件名后缀名，比如test.png这种格式 api.DownloadTmtFile后端接口返回的是文件的二进制流 值得注意的是，微信开发者工具中是测试不了wx.saveFileToDisk的，需要真机或者体验版测试 handleDownload(fileName) {if (!fileName) retu…
【uniapp】部分图标点击事件无反应
比如：点击这个图标在h5都正常，在小程序上无反应 css：也设置z-index，padding
页面上也试过click.native.stop.prevent"changePassword()" 时而可以时而不行，
最后发现是手机里输入键盘的原因，输…
uni-app，nvue中text标签文本超出宽度不换行问题解决
复现：思路： 将text标签换为rich-text，并给rich-text增加换行的样式class类名解决：
UniApp 组件 u-tabs 详细讲解
基本用法
u-tabs 是一个选项卡组件，通过在 <u-tabs> 标签中插入多个 <u-tab> 标签来实现多个选项卡之间的切换。每个 <u-tab> 标签作为一个选项卡，可以设置标题和对应的内容。
下面是一个基本的示例： <u-tabs :curren…
uniapp高德、百度、腾讯地图配置 SHA1
uniapp高德、百度、腾讯地图配置 SHA1 当winr弹出cmd弹框后输入 keytool -list -v -keystore debug.keystore 显示keytool 不是内部或外部命令，也不是可运行的程序或批处理文件。可以先看看是否有下载jdk且配置了环境变量，具体操作如下：keyto…
带你用uniapp从零开发一个仿小米商场_8. 配置pages.json从而实现头部搜索框
通过观察小米商城的头部导航栏的时候可以发现,它是由一个文字图标,和一个输入框,还有一个扫描二维码的按钮
有两种实现方式,一种是自己写一个自定义导航,还有一种是用官方的
这里使用官方的,实现去到pages.json文件,找到index这个页面配置 可以通过给它设置app-plus app-pl…
uniapp在H5端实现PDF和视频的上传、预览、下载
上传 上传页面 <u-form-item :label"(form.ququ3 1 ? 参培 : form.ququ3 2 ? 授课 : ) 证明材料" prop"ququ6" required><u-button click"upload" slot"right" type"primary" icon"arrow-upward" t…
uniapp设置手机通知权限
提醒用户开启通知权限，与unipush功能联用 效果图： 方法： 直接使用即可，在真机或模拟器运行
setPermissions() {// #ifdef APP-PLUS if (plus.os.name Android) { // 判断是Androidvar main plus.android.runtimeMainActivity…
app上架一直显示审核中状态要怎么处理？
当你提交一个应用到App Store上时，它会经历一个审核过程。在这个过程中，苹果的审核人员会检查你的应用是否符合苹果的规定和标准。这个过程通常需要几天的时间，但是如果你的应用一直显示“审核中”状态，那么可能会有一些原因。
1…
uniapp 导航分类
商品分类数据，包括分类名称和对应的商品列表点击弹出 列表的内容
展示效果如下： 代码展示
①div部分 <view class"container"><view class"menu-bar"><view class"menu"><view class"menu-sc…
微信小程序 老年人心血管健康知识科普系统
本系统的功能有管理员：个人中心，用户管理，热点信息管理，疾病管理，疾病类型管理，治疗管理，治疗类型管理，护理管理，护理类型管理，科普管理，科普类型…
UniApp项目中 使用微信小程序原生语言 进行开发
看效果 wxcomponents 下放的是微信小程序原生代码写的组件。我进行了封装 上干货 在你下uniApp 项目的根目录创建一个 wxcomponents 名字千万不要错 京东、支付宝灯参考下面图片 官方文档也有介绍 然后在你需要引入原生功能的页面里面引入你的组件（我这里提前已经放…
vue+uniapp校园寻物失物招领平台 微信小程序1f6z5
系统中的核心用户是管理员，管理员登录后，通过管理员菜单来管理后台系统。主要功能有：首页、个人中心、用户管理、物品分类管理、物品信息管理、物品归还管理、留言板管理、系统管理等功能。管理员用例如图3-7所示。 对于本网上失物招领小程序…
uni-app x生成的安卓包，安装时，提示不兼容。解决方案
找到 manifest.json
进入：源码视图
代码
{"name" : "xxx康养","appid" : "__xxx6","description" : "xxx康养","versionName" : "1.0.12","versionCode" : 100012,&…
uniapp搭建内网映射测试https域名
搭建Https域名服务器
使用github的frp搭建，使用宝塔申请免费https证书，需要先关闭宝塔nginx的反向代理，申请完域名后再开启反向代理即可。
教程
新版frp搭建教程
启动命令
服务器端
sudo systemctl start frps本地
cd D:\软件安装包\f…
uniapp实战 —— 分类导航【详解】
效果预览 组件封装 src\pages\index\components\CategoryPanel.vue
<script setup lang"ts">
import type { CategoryItem } from /types/index
defineProps<{list: CategoryItem[]
}>()
</script><template><view class"category&…
uni-app实现返回刷新上一页
方案一
通过监听器实现 page1
uni.$on("refresh", function(data) {if(data.page "page2") {this.reload()}
})page2
methods: {handleBack() {uni.$emit("refresh", {page: "page2"})uni.navigateBack()}
}方案二
通过页面实例实…
uniapp-获取手机型号
要获取当前设备的手机型号，您可以使用uni-app提供的uni.getSystemInfo() API来实现此目的。
代码示例：
uni.getSystemInfo({success: function(res) {console.log("手机型号：" res.platform)}
})该方法会返回一个包含设备信息的…
uniapp：录音权限检查，录音功能
1.可以使用：plus.navigator.checkPermission检查运行环境的权限 2.如果是"undetermined"表示程序未确定是否可使用此权限，此时调用对应的API时系统会弹出提示框让用户确认：plus.audio.getRecorder()
<template><view cla…
微信小程序其他环境都能显示在正式环境显示不出来
踩坑日记 用了uni.getImageInfo 用了uni.getImageInfo
本地开发环境，测试环境全都可以，就是更新到正式环境不显示。后面看代码百度了这个api发现图片所涉及的地址需要在小程序配置download域名白名单
https://uniapp.dcloud.net.cn/api/media/image.ht…
flutter，uni-app开发调试ios
一、申请ios开发者账号
二、ios开发者配置
ios 开发者需要配置的地方 https://developer.apple.com/account/resources/certificates/list
Certificates（证书）:
作用： 证书用于对应用程序和开发者进行身份验证，确保安全性和可…
关于unicloud云对象或云函数获取时间不对的问题
话不多说，直接上代码：
function timeWeekFormat() { //定义一个日期对象; var dateTime getOffsetDate(8); //获得系统年份; var year dateTime.getFullYear(); //获得系统月份; var month dateTime.getMonth() 1; //获…
案例022:基于微信小程序的行政复议在线预约系统
文末获取源码 开发语言：Java 框架：SSM JDK版本：JDK1.8 数据库：mysql 5.7 开发软件：eclipse/myeclipse/idea Maven包：Maven3.5.4 小程序框架：uniapp 小程序开发软件：HBuilder X 小程序…
微信小程序uni-app：常用Form表单组件使用示例
目录 input 输入框picker 选择器 input 输入框
https://developers.weixin.qq.com/miniprogram/dev/component/input.htmlhttps://uniapp.dcloud.net.cn/component/input.html
<inputclass"input-class"type"text"v-model"value"placeholde…
uni-app 微信小程序之好看的ui登录页面（一）
文章目录 1. 页面效果2. 页面样式代码 更多登录ui页面 uni-app 微信小程序之好看的ui登录页面（一） uni-app 微信小程序之好看的ui登录页面（二） uni-app 微信小程序之好看的ui登录页面（三） uni-app 微信小程…
【Vue】【uni-app】实现发起工单页面
修改了上次的导航栏为二级导航 <template><view class"leftNav"><div class"logo">显鹅易见</div><uni-collapse class"item" accordion"true"><uni-collapse-item title"养殖场总部">…
uniappios请求打开麦克风 uniapp发起请求
第一种 ajax请求方式
uni.request(OBJECT) 参数名类型必填默认值说明平台差异说明urlString是开发者服务器接口地址dataObject/String/ArrayBuffer否请求的参数App（自定义组件编译模式）不支持ArrayBuffer类型headerObject否设置请求的 header，header 中不能设置 Referer。…
uniapp版本更新ios无效
uniapp小程序实现更新操作提示用户升级 引言获取小程序版本是否需要更新以及更新操作1.App.vue文件中实现获取更新方法2.在App.vue的 onShow 里面运行3.App.vue中使用到的提示框封装方法引言
小程序更新时，为了防止小程序由于热启动或者需要在登录时候添加新的缓存，无法获取…
带你用uniapp从零开发一个仿小米商场_10.开发一个占剩余窗口的滚动区域
首先是一个头部的tag切换栏,这个很简单,就不多说 源码奉上
<scroll-view scroll-x class"border scroll-row" style"height: 80rpx;"><view class"scroll-row-item" style"height: 80rpx;line-height: 80rpx;" v-for"(…
uniapp 蓝牙小程序-兼容安卓和iOS
withTimeout方法可以在搜寻设备时等待指定的秒数，如果30秒内未搜索到则取消搜索
/*** 超时控制函数* param {Promise} promise 回调函数* param {number} timeout 超时时间, 默认10s*/
export function withTimeout(promise, timeout 10000) {let timeoutEvent …
uniapp的subnvue苹果适配(ios)谷歌地图问题
谷歌地图，google地图，调整宽度。这个适配花了点时间，苹果IOS宽度一直无效失灵，赶紧记录分享，很坑。可能所有的ios的subnvue适配都这样。看了网上很多方法无效，最终找到试出答案。
pages.json的配置宽度无效…
案例049:基于微信小程序的校园外卖平台设计与实现
文末获取源码 开发语言：Java 框架：SSM JDK版本：JDK1.8 数据库：mysql 5.7 开发软件：eclipse/myeclipse/idea Maven包：Maven3.5.4 小程序框架：uniapp 小程序开发软件：HBuilder X 小程序…
uni-appcss语法
锋哥原创的uni-app视频教程：
2023版uniapp从入门到上天视频教程(Java后端无废话版)，火爆更新中..._哔哩哔哩_bilibili2023版uniapp从入门到上天视频教程(Java后端无废话版)，火爆更新中...共计23条视频，包括：第1讲 uni…
案例053:基于微信小程序的乐室预约系统
文末获取源码 开发语言：Java 框架：SSM JDK版本：JDK1.8 数据库：mysql 5.7 开发软件：eclipse/myeclipse/idea Maven包：Maven3.5.4 小程序框架：uniapp 小程序开发软件：HBuilder X 小程序…
uniapp+unicloud：unipay（v3支付）
v3安全性很高，需要签名，unipay解决了签名，所以直接用就可以
先看文档： const path require(path); // 引入内置的path模块const unipayIns unipay.initWeixinV3({appId: your appId,mchId: your mchId,v3Key: you parterner ke…
案例026:基于微信小程序的原创音乐系统的设计与实现
文末获取源码 开发语言：Java 框架：SSM JDK版本：JDK1.8 数据库：mysql 5.7 开发软件：eclipse/myeclipse/idea Maven包：Maven3.5.4 小程序框架：uniapp 小程序开发软件：HBuilder X 小程序…
css弹窗动画效果，示例弹窗从底部弹出
从底部弹出来，有过渡动画效果 用max-height可以自适应内容的高度，当内容会超过最大高度时可以在弹窗里加个scroll-view 弹窗不能用v-if来隐藏，不然transition没效果，transition只能对已有dom元素起效果，所以用透明和v…
uni-app 微信小程序之好看的ui登录页面（三）
文章目录 1. 页面效果2. 页面样式代码 更多登录ui页面 uni-app 微信小程序之好看的ui登录页面（一） uni-app 微信小程序之好看的ui登录页面（二） uni-app 微信小程序之好看的ui登录页面（三） uni-app 微信小程…
查看IOS游戏FPS
摘要
本篇技术博客将介绍如何使用克魔助手工具来查看iOS游戏的帧率（FPS）。通过克魔助手，开发者可以轻松监测游戏性能，以提升用户体验和游戏质量。
引言
在iOS游戏开发过程中，了解游戏的帧率对于优化游戏性能至关重要…
从零开始学UniApp微信小程序开发：头部适配技巧让你事半功倍！
在 UniApp 中，在微信小程序开发中，头部适配可以通过修改 pages.json 中的 navigationStyle 配置项来实现，具体操作步骤如下：
1.进入 pages.json 文件
在 UniApp 项目的根目录中找到 pages.json 文件，打开该文件。
2…
uniapp实现地图电子围栏功能
该功能使用uniapp中内置组件map实现 效果图预览： 实现过程：
1.文档： 2.代码： <template><view><map :style"width: 100%; height:screenHeight" :latitude"latitude" :longitude"longit…
HbuilderX使用Uniapp+Vue3安装uview-plus
如果你是vue2版本想使用uniapp去配置uviewui库可以参考之前的文章 小程序的第三方ui库推荐较多的还是uview的，看起来比较美观，功能也比较完善，下面将提一下Vue3安装uview-plus库的教程
创建项目 安装
首先进入官网 uView-Plus 直接下载并导…
uniapp，点击选中并改变颜色，第二次点击取消选中状态
一、效果图 二、代码实现 字符串的indexOf和数组的indexOf用法一致！ arr.indexOf(item) 该方法返回某个元素在数组中的位置。若没检索到，则返回 -1。 关键代码：(通过:class绑定)
:class"selectList.indexOf(sub.type) ! -1 ? right_ite…
uniapp多行文本展开或收起（兼容h5、微信小程序，其它未测试）
文章目录 一、效果图展示1、收起2、展开3、文本过短时隐藏按钮【查看更多、收起】 二、代码实现原理：判断文本是否过短1、html2、css3、 js（1）data数据定义（2）获取文本高度（3） 获取行数…
uni-app 微信小程序之swiper轮播图
1. 实现效果 2. 完成代码
<template><view class"components-home"><view style"margin-top:-50rpx;height: 486rpx; position: relative;margin-bottom: 80rpx;"><image srchttps://xxx.com/img/wccQQP.png modewidthFix classpng …
踩坑记录：uniapp中scroll-view的scroll-top不生效问题；
情景描述： 最近在uniapp项目中用到scroll-view内置组件，有需求是在页面下拉刷新后，让scroll-view组件区域的显示内容置顶，也就是scroll-view区域的内容恢复不滑动的状态； 补充：下拉刷新操作scroll-view组件…
【开题报告】基于uniapp的家庭记账小程序的设计与实现
1.研究背景
随着社会经济的发展和人们生活水平的提高，家庭财务管理变得越来越重要。家庭记账是一种重要的财务管理方式，通过记录和分析家庭的收入和支出情况，可以帮助家庭成员更好地理解和掌握自己的财务状况，合理规划和管理家庭…
SDK，但未在应用内的隐私政策/在AppGallery Connect上提交的隐私政策内容中进行明示，不符合华为应用市场审核标准。
（暂时用不到的也建议收藏一下，因为文章持续更新中）
最新更改时间：20023-12-10
第三方SDK合集列表
为了确保用户个人信息的安全，我们对使用到的第三方提供的软件开发包（SDK）进行了严格的安全检…
uniapp - 简单版本自定义tab栏切换
tab切换是APP开发最常见的功能之一，uniapp中提供了多种形式的tab组件供我们使用。对于简单的页面而言，使用tabbar组件非常方便快捷，可以快速实现底部导航栏的效果。对于比较复杂的页面，我们可以使用tab组件自由定义样式和内容 目录…
uniapp（微信小程序）聊天实例，支持图片，语音，表情（附源码）
效果预览 安装教程
配置 请参考Dome
会话配置
{info:{// 用户关键字userKey:2666,// 用户手机userPhone:15252156614,// 用户昵称userName: 健健,// 头像headImg: http://d.hiphotos.baidu.com/image/h%3D300/sign0defb42225381f3081198ba999004c67/6159252dd42a2834a75bb01…
uni-app 一些实用的页面模板
时间倒计时 <!-- 时间倒计时 -->
<template><view class"container"><view class"flex-row time-box"><view class"time-item">{{ laveTimeList[0] }}</view><text>天</text><view class&qu…
小程序禁止滚动穿透，page-meta
使用场景：页面中有弹窗，并且弹窗里数据超过弹窗的高，要在弹窗做滑动操作，当弹窗滑动到底部的时候，继续划动会导致底层页面的滚动，这就是滚动穿透。这种情况对于体验感很不友好。 解决办法：使用p…
flex-shirnk 与 flex-grow
1.shrink shrink就是告诉子元素当父元素宽度不够用时,自己调整自己所占的宽度比 flex-shrink：1时,表示所有子元素大家同时缩小来适应总宽度。 flex-shrink：0时,表示大家都不缩小适应。 给父元素设置了flex布局后,若要其子元素的width有效…
Uniapp小程序通过camera组件实现视频拍摄
uni中可以通过调用api的方式去拍摄或者是选择相册的视频，但是在这里我们不采取这种方式，因为调用api的方式，必须跳转，而我们需要在页面中实现，下面看下具体步骤吧... <camera v-if"!srcUrl && showCam…
uniapp使用uview报错Cannot find module ‘@/uni_modules/uview-ui/components
参考：https://github.com/umicro/uView 记录使用uniapp报的错 注意uview目前只支持vue2
按照教程引入uview，然后执行的时候还是会报Cannot find module /uni_modules/uview-ui/components意思是找不到uview的组件，然后我反复对比官网配置的东…
【合成数字】合成类游戏-uniapp项目开发流程详解
以前玩过2048游戏，从中发现规律，想到跟合成类游戏相似，知道为什么很相似吗，在这里，做一个数字合成游戏玩玩吧，感兴趣的话可以看看，这里给大家讲一讲数字合成游戏的开发过程。 文章目录 创建项目…
springboot代码混淆及反混淆代码工具
springboot代码混淆及反混淆代码工具
目录
介绍
什么是混淆
为什么用混淆？
基础混淆
高级混淆工具
#0x1 ipaguard Tool - springboot混淆工具
ipaguard界面概览
ipaguard启动界面
ipaguard代码混淆界面
资源文件混淆界面
重签名界面 尽管到目前为止&a…
uni-app 中使用定时器和取消定时器
uni-app 中使用定时器和清除定时器
uni-app 中我们应该如何使用定时器呢？在结束后我们该如何让清除定时器？ 下面我们就来分享一下吧。
1、 定义一个
data(){return{timer: null}
} 2、设置定时器
//选择适合需求的定时器
this.timer setTimeout( ()…
vue3 uniapp定时器 每天定时触发任务
最近在uniapp中遇到了一个定时器的功能，需要每天定时00:00:00触发接口请求，用到了timeOutTimer和intervalTimer，结合实例来讲一下实现步骤： 首先了解一下这两个方法的含义
setTimeout：用于在一段时间后执行一次函数。…
uniapp-安卓APP开发时使用手机调试
调试
1. 手机打开开发者模式: 华为手机举列-->设置-->关于手机-->版本号，多次连续点击“版本号”，就会提示已打开开发者模式
2. 华为手机举列-->设置-->系统和更新-->开发人员选项-->打开 USB调试，进入调试模式
3. 先…
UniApp H5 跨域代理配置并使用（配置manifest.json、vue.config.js）
UniApp 运行到浏览器的时候，接口会跨域报错，这里通过两种方式解决，第一：修改Uniapp自带的manifest.json 源码视图并进行配置h5设置。第二：在项目根目录新建vue.config.js并配置代理。 二选一即可。 修改或调整配置文件…
uniapp-使用返回的base64转换成图片
在实际开发的时候 需要后端实时的给我返回二维码 他给我返回的是加密后的base64字符串
我需要利用这个base64转换到canvas画布上展示 或者以图片的形式展示在页面内 在canvas画布上展示
使用官方的uni.getFileSystemManager().writeFile()方法可将base64码转成的二维码显示在…
uni-app获取指定时间为周几，日期格式化为 “YYYY-MM-DD“ 的形式
在 uni-app 中，你可以使用 JavaScript 的 Date 对象来获取指定时间是星期几。以下是一个简单的示例代码，演示了如何在 uni-app 中实现这一功能：
// 假设有一个指定的日期时间
const specifiedDate new Date(2023-12-25);// 获取这个指定日期…
Uniapp + Vue3 封装请求工具挂载全局
新建request.js工具类
const http {// baseUrl 地址baseUrl: http://localhost:8080,// 请求方法request(config) {// config：请求配置对象，具体参照uniapp文档config beforeRequest(config)// 请求地址拼接config.url this.baseUrl config.url// 异…
uniapp纯CSS实现圆形进度条组件
uniapp纯CSS实现圆形进度条组件。圆形进度条组件组合做一个步骤进度组件是非常常见。 纯 CSS 实现圆形进度条组件有以下几个好处：
轻量级：由于纯 CSS 实现，无需额外的 JavaScript 或图像资源，所以组件的文件大小相对较小…
uniapp使用colorUI
colorUI
微动画 | ColorUI 使用文档
1：把colorui里三个文件复制到自己项目中去 App.vue
</script>
<style>
import url(colorui/icon.css);
import url(colorui/main.css);
import url("colorui/animation.css");-webkit-keyframes show {…
记录为 uni-app的扩展组件（uni-ui）和 微信小程序标签 添加行内样式的正确做法
如题，首先，正确为微信小程序标签添加行内样式，其做法是：（以view为例）
<view style"width: 400rpx; height: 400rpx; background-color: green;">goods_list</view>也就是说…
随机问卷调查数据的处理（uniapp）
需求：问卷调查 1.返回的数据中包含单选、多选、多项文本框、单文本框、图片上传 2.需要对必填的选项进行校验 3.非必填的多项文本框内容 如果不填写 不提交
表单数据格式
res{"code": 0,"msg": null,"data": [{"executeDay&…
uniapp使用腾讯地图标点
在uniapp中使用腾讯地图标点，可以按照以下步骤进行： 在腾讯地图开放平台上注册账号，并获取到开发者密钥（key）。 在uniapp项目中引入腾讯地图插件，可以使用uni-app官方提供的uni-modules插件管理器来搜索并…
uniapp自定义头部导航怎么实现？
一、在pages.json文件里边写上自定义属性
"navigationStyle": "custom"
二、在对应的index页面写上以下：
<view :style"{ height: headheight px, backgroundColor: #24B7FF, zIndex: 99, position: fixed, top: 0px, width: 100% …
uni-app之HelloWorld实现
锋哥原创的uni-app视频教程：
2023版uniapp从入门到上天视频教程(Java后端无废话版)，火爆更新中..._哔哩哔哩_bilibili2023版uniapp从入门到上天视频教程(Java后端无废话版)，火爆更新中...共计23条视频，包括：第1讲 uni…
uniapp使用腾讯地图进行地理定位
在uniapp中使用腾讯地图进行地理定位，你需要先在腾讯地图开放平台申请API密钥，然后可以使用uniapp的插件来访问腾讯地图API。
首先，在项目的 manifest.json 文件中配置需要的插件。在 uni-app 节点下添加 permission 节点，并在其…
uniapp开发日期预约表的方法和优化
如图所示，最近在开发预约时间表 但是设计稿看起来排列比较灭有规律，而uniapp的插件图表其实并没有类似的，因此只能自己想办法了， 直接就按前端实现的路子，仿造了一个时间表
uniapp 底部导航栏 tabBar
在 static 文件夹中新建文件夹 tabBar，放入标签图片 源素材如下： 在 pages.json 中添加 // 底部导航"tabBar": {// tab默认文字颜色"color": "#bfbfbf",// tab选中后的文字颜色"selectedColor": "#153c65&…
uniapp怎么存储用户登录的所有数据？
在登录页面请求成功的地方使用uni.setStorageSync方法
uni.setStorageSync(userinfo, res.data.data);
怎么取 在要用的页面的onLoad周期里面
const res uni.getStorageSync(userinfo);
怎么用 需要用到哪一个东西 就在header里面接收哪个参数
header: {token: this.user…
uni-app 安卓 快速安心打包
证书生成
生成网址
MockLib - Android证书https://www.mocklib.com/keystore
证书私钥密码 在打包时需要用到
使用这个网址，无需jre环境，
或 官网给的
Android平台签名证书(.keystore)生成指南 - DCloud问答https://ask.dcloud.net.cn/article/35…
uniapp中用户登录数据的存储方法探究
Hello大家好！我是咕噜铁蛋！作为一个博主，我们经常需要在应用程序中实现用户登录功能，并且需要将用户的登录数据进行存储，以便在多次使用应用程序时能够方便地获取用户信息。铁蛋通过科技手段帮大家收集整理了些知识&am…
uniapp微信小程序投票系统实战 (SpringBoot2+vue3.2+element plus ) -后端鉴权拦截器实现
锋哥原创的uniapp微信小程序投票系统实战：
uniapp微信小程序投票系统实战课程 (SpringBoot2vue3.2element plus ) ( 火爆连载更新中... )_哔哩哔哩_bilibiliuniapp微信小程序投票系统实战课程 (SpringBoot2vue3.2element plus ) ( 火爆连载更新中... )共计21条视频…
uni-app 从入门到精通 3天快速掌握 文字版 学习专栏
大家好，我是java1234小锋老师。
近日锋哥又卷了一波课程，uni-app 从入门到精通 3天快速掌握教程，文字版视频版。三天掌握。
2023版uniapp从入门到上天视频教程(Java后端无废话版)，火爆更新中..._哔哩哔哩_bilibili2023版uniapp从…
uniapp中uview组件库的DatetimePicker 选择器的用法
目录 基本使用
#年 月 日
#格式化
#限制最大最小值
API
#Props
#Events
#Methods 基本使用
通过show绑定一个布尔值变量，用于控制组件的弹出与收起。通过mode配置选择何种日期格式。
<template><view><u-datetime-picker:show"show&qu…
【教程】cocos2dx资源加密混淆方案详解
1,加密,采用blowfish或其他 2,自定是32个字符的混淆code 3,对文件做blowfish加密,入口文件加密前将混淆code按约定格式(自定义的文件头或文件尾部)写入到文件 4,遍历资源目录,对每个文件做md5混淆,混淆原始串“相对路径”“文件名”混淆code, 文件改名并且移动到资源目录根…
uni-app uni-file-picker文件上传实现拍摄从相册选择获取图片上传文档服务器（H5上传-微信小程序上传）
前言 最近在使用uni-app写H5移动端，有一个从手机拍摄从相册选择获取图片上传到文档服务器功能。 查阅uni-app发现关于上传图片，uni-file-picker文件上传，uni.chooseImage，uni.uploadFile H5上传时它和pc端原理差不多，…
【uniapp】Uniapp cli 自动化打包脚本实现
一、前言
通常使用uniapp开发app时，大多数会使用项目的云服务打包，否则的话再借助原生会变得极其复杂，还要去安装对应大内存的环境。如果恰好此时，你有一个需求是，可以随意的更换logo和封面、标题切换成另外一个app&a…
uniapp微信小程序接入友盟
一、登录友盟官网，按照引导注册友盟账号 二、在友盟平台新建小程序应用（建好之后会得到appkey）
进入小程序统计后台创建Appkey，按要求填写小程序名称及类型： 三、在微信小程序中接入SDK ---- 以下是npm 配置
1. 安装…
41.坑王驾到第七期：uniapp开发微信小程序引用组件时报错！
一、错误再现
页面login引用了一个组件register，运行至小程序开发工具报错。 xxx.js 已被代码依赖分析忽略，无法被其他模块引用。
二、解决办法
在微信小程序的配置文件中找到setting节点，增加两个配置项。 “ignoreDevUnusedFiles”: fa…
uniapp上传图片，上传头像，多张图片上传，图片回显，图片删除，图片预览
效果图： 上代码不废话：
<template><view class"familyCreateMemory"><view class"box"><view class"title"><view>文字：</view><textarea :maxlength"-1"/…
uniapp 之 图片 视频 文件上传
<view class"" style"padding: 24rpx 0"><text>相关资料 <text class"fs-26 color-666">（图片、视频、文档不超过9个）</text> </text><view class"flex align-center" style&…
uniapp中组件库的丰富NumberBox 步进器的用法
目录 基本使用
#步长设置
#限制输入范围
#限制只能输入整数
#禁用
#固定小数位数
#异步变更
#自定义颜色和大小
#自定义 slot
API
#Props
#Events
#Slots 基本使用
通过v-model绑定value初始值，此值是双向绑定的，无需在回调中将返回的数值重…
小兔鲜儿 uniapp - 项目打包
目录
微信小程序端
核心步骤
步骤图示
条件编译
条件编译语法
打包为 H5 端
核心步骤
路由基础路径
打包为 APP 端 微信小程序端
把当前 uni-app 项目打包成微信小程序端，并发布上线。
核心步骤
运行打包命令 pnpm build:mp-weix…
使用uni-app editor富文本组件设置富文本内容及解决@Ready先于onload执行，无法获取后端接口数据的问题
开始使用富文本组件editor时，不知如何调用相关API设置富文本内容和获取内容，本文将举例详解 目录
一.了解editor组件的常用属性及相关API
1.属性常用说明 2.富文本相关API说明
1）editorContext
2） editorContext.setContents…
uniapp项目如何引用安卓原生aar插件（避坑指南三）
官方文档说明：uni小程序SDK 【彩带- 避坑知识点】 如果引用原生aar插件，都配置好之后，云打包，报不包含此插件，除了检查以下步骤流程外，还要检查一下是否上打包的原生插件aar流程有问题。 1.第一步在uniapp项…
uniapp 无限级树形结构面包屑、单选-多选、搜索、移除功能插件，基于【虚拟列表】高性能渲染海量数据，加入动态高度、缓冲区
hyq-tree-vtw
无限级树形结构面包屑、单选-多选、搜索、移除功能
示例项目 单选-user 单选-任意一项 多选-关联下级 多选-任意一项 已选择数据弹框 说明
本插件需要使用uni-popup、uni-transition用于已选择数据弹框，因此需要有这些依赖,请自行导入本插件基于【虚…
陪诊小程序独立版| uniapp前端 |fastadmin后端
应用介绍 基于FastAdmin 原生微信小程序开发的陪诊陪护小程序，支持多运营区，陪护师、推广者等完整闭环功能，快速搭建陪护业务平台。 前端演示： 后端演示： https://tthz001.com/dkYNHvEfXu.php/index/login 介绍&#…
uniapp微信小程序投票系统实战 (SpringBoot2+vue3.2+element plus ) -小程序端TabBar搭建
锋哥原创的uniapp微信小程序投票系统实战：
uniapp微信小程序投票系统实战课程 (SpringBoot2vue3.2element plus ) ( 火爆连载更新中... )_哔哩哔哩_bilibiliuniapp微信小程序投票系统实战课程 (SpringBoot2vue3.2element plus ) ( 火爆连载更新中... )共计21条视频…
uniapp websocket 消息队列 例子
UniApp的localStorage可以用来存储和读取数据，但它本身并不是一个消息队列。消息队列是一种用于在应用程序之间传递消息的技术，它具有特定的特性，如消息的持久化、消息的顺序性、消息的消费等。
如果你想在UniApp中实现类似消息队列的功能&a…
uniapp交互反馈api的使用示例
官方文档链接：uni.showToast(OBJECT) | uni-app官网 1.uni.showToast({}) 显示消息提示框。
常用属性： title:页面提示的内容 image：改变提示框默认的icon图标 duration：提示框在页面显示多少秒才让它消失 添加了image属性后。 注…
【uniapp小程序-生成二维码+多个图片文字合并一张图】
<!-- 二维码 --><canvas id"qrcode" canvas-id"qrcode" width"120" ></canvas><!-- 生成带小程序码的分享图片 --><canvas canvas-id"shareCanvas" class"share-canvas"></canvas>#qrc…
uni-app使用WebSocket
uni-app 是一个使用 Vue.js 开发所有前端应用的框架，可以编译到 iOS、Android、H5、小程序等多个平台。在 uni-app 中使用 WebSocket，你需要先引入 uni-websocket 模块，然后创建一个 WebSocket 实例，设置相关参数，并监…
uni-app模版（扩展插件）
锋哥原创的uni-app视频教程：
2023版uniapp从入门到上天视频教程(Java后端无废话版)，火爆更新中..._哔哩哔哩_bilibili2023版uniapp从入门到上天视频教程(Java后端无废话版)，火爆更新中...共计23条视频，包括：第1讲 uni…
uni-app pages.json之globalStyle全局页面样式配置
锋哥原创的uni-app视频教程：
2023版uniapp从入门到上天视频教程(Java后端无废话版)，火爆更新中..._哔哩哔哩_bilibili2023版uniapp从入门到上天视频教程(Java后端无废话版)，火爆更新中...共计23条视频，包括：第1讲 uni…
【uniapp】多规格选择
效果图
VUE
<template>
<view><view class"wp-80 pd-tb-40 mg-auto"><button type"warn" click"showDrawer(showRight)">筛选</button></view><!-- 筛选-uni-drawer --><uni-drawer ref"s…
uniapp中使用axios、uniapp中封装axios
根据官方文档，我们知道axios支持nodejs、浏览器环境，但不支持uniapp、小程序，所以要想在uniapp中使用axios就要自定义实现。axios文档对自定义实现，作了说明。
// adapter allows custom handling of requests which makes testi…
uni-app 设置当前page界面进入直接变为横屏模式
首先 我们打开项目的 manifest.json 在左侧导航栏中找到 源码视图 然后找到 app-plus 配置 在下面加上
"orientation": [//竖屏正方向"portrait-primary",//竖屏反方向"portrait-secondary",//横屏正方向"landscape-primary",//横屏…
uniapp中uview组件库丰富的LoadingIcon 加载动画
目录 基本使用
#动画文字
#模式类型
#排列类型
#动画模式
#动画运行时间
#图标颜色
#图标尺寸
#显示或隐藏动画
API
#Props 基本使用
通过mode设定动画的类型，circle为圆圈的形状，flower为经典类似花朵的形状
<template><view>&…
uniapp 安装插件 uView （多平台快速开发的UI框架）
1. 下载并导入插件 打开链接 https://ext.dcloud.net.cn/plugin?id1593 导入成功后，可见 2. 添加配置 main.js
import uView from /uni_modules/uview-ui
Vue.use(uView)uni.scss
import /uni_modules/uview-ui/theme.scss;App.vue
<style lang"scss&qu…
uniapp中uview组件库丰富的Calendar 日历用法
目录 基本使用
#日历模式
#单个日期模式
#多个日期模式
#日期范围模式
#自定义主题颜色
#自定义文案
#日期最大范围
#是否显示农历
#默认日期 基本使用
通过show绑定一个布尔变量用于打开或收起日历弹窗。通过mode参数指定选择日期模式，包含单选/多选/范围…
使用命令行方式搭建uni-app + Vue3 + Typescript + Pinia + Vite + Tailwind CSS + uv-ui开发脚手架
使用命令行方式搭建uni-app Vue3 Typescript Pinia Vite Tailwind CSS uv-ui开发脚手架 项目代码以上传至码云，项目地址：https://gitee.com/breezefaith/uniapp-vue3-ts-scaffold 文章目录 使用命令行方式搭建uni-app Vue3 Typescript Pinia V…
uniapp 【专题详解 -- 时间】云数据库时间类型设计，时间生成、时间格式化渲染（uni-dateformat 组件的使用）
云数据表的时间类型设计 推荐使用时间戳 timestamp
"createTime": {"bsonType": "timestamp","label": "创建时间："
}时间生成 获取当前时间 Date.now()
.add({createTime: Date.now()
})时间格式化渲染 下载安…
uniapp 创建组件组件
组件：用于将某个功能的 HTML、CSS、JS 封装到一个文件中，提高代码的复用性和可维护性。
创建组件
一、在根目录中创建 components 文件夹，右键点击新建组件。 二、输入组件名称、选择默认模板、点击创建组件。 三、在组件中正常编写内容即可…
uniapp中uview组件库的Input 输入框 的使用方法
目录
#平台差异说明
#基本使用
#输入框的类型
#可清空字符
#下划线
#前后图标
#前后插槽
API
#Props
#Events
#Methods
#Slots 去除fixed、showWordLimit、showConfirmBar、disableDefaultPadding、autosize字段
此组件为一个输入框，默认没有边框和样式…
uniapp知识大杂烩？
UniApp是一个基于Vue.js框架的跨平台开发框架，可以用于同时开发iOS、Android和Web应用程序。下面是一些UniApp的知识点大杂烩： 跨平台开发：UniApp采用了一套代码多端运行的原则，可以使用一种语言（通常是Vue.js…
uniapp上传文件时用到的api是什么？格式是什么？
在UniApp中，你可以使用uni.uploadFile()方法来上传文件。这是一个异步方法，用于将本地资源上传到服务器。
该方法的基本格式如下：
uni.uploadFile({url: 上传接口地址,filePath: 要上传的文件路径,name: 后端接收的文件参数名,formData: {/…
uniapp点击跳转传对象
目录 传对象传对象传送组件接受组件 最后 传对象 传对象
传送组件
点击传给组件
<view class"dki-tit-edit" click"gotificatedit(item)">编辑
</view>gotificatedit(item){console.log(item,item);let options JSON.stringify(item);uni.…
微信小程序 引导地址授权 获取位置信息 uniapp
概述 获取位置信息，需要保证是否授权位置信息，有几个条件是导致无法授权的原因 （1）微信应用未授权定位设置 （2）首次进入小程序未授权位置信息 （3）小程序之前阻止过授权位置信息 &…
uniapp微信小程序投票系统实战 (SpringBoot2+vue3.2+element plus ) -全局异常统一处理实现
锋哥原创的uniapp微信小程序投票系统实战：
uniapp微信小程序投票系统实战课程 (SpringBoot2vue3.2element plus ) ( 火爆连载更新中... )_哔哩哔哩_bilibiliuniapp微信小程序投票系统实战课程 (SpringBoot2vue3.2element plus ) ( 火爆连载更新中... )共计21条视频…
uniapp获取手机当前信息及应用版本
appVersion 是app端查询的数据信息
appWgtVersion 是浏览器端查询的数据信息
onLoad() {const systemInfo uni.getSystemInfoSync();console.log(systemInfo);// #ifdef H5const uniAppVersion systemInfo.appVersion;// #endif// #ifndef H5const uniAppVersion systemIn…
uniapp微信小程序投票系统实战 (SpringBoot2+vue3.2+element plus ) -后端架构搭建
锋哥原创的uniapp微信小程序投票系统实战：
uniapp微信小程序投票系统实战课程 (SpringBoot2vue3.2element plus ) ( 火爆连载更新中... )_哔哩哔哩_bilibiliuniapp微信小程序投票系统实战课程 (SpringBoot2vue3.2element plus ) ( 火爆连载更新中... )共计21条视频…
uniapp打包后图片资源会重复
hbuildx打包后文件过大，多方优化后，发现会生成重复的图片，如图：
临时解决方法： lib.zip chain-webpack.js_.zip 解压 lib.zip 替换到 HBuilderX根目录/plugins/uniapp-cli/node_modules/dcloudio/uni-cli-shared/lib…
【uniapp】调用阿里云OCR图片识别文字：
文章目录 一、效果：二、实现： 一、效果： 二、实现：
【阿里官方】高精版OCR文字识别【最新版】-云市场-阿里云
<template><view class"container"><!-- 选择图片 --><button click"imageO…
uniapp微信小程序投票系统实战 (SpringBoot2+vue3.2+element plus ) -投票创建页面实现
锋哥原创的uniapp微信小程序投票系统实战：
uniapp微信小程序投票系统实战课程 (SpringBoot2vue3.2element plus ) ( 火爆连载更新中... )_哔哩哔哩_bilibiliuniapp微信小程序投票系统实战课程 (SpringBoot2vue3.2element plus ) ( 火爆连载更新中... )共计21条视频…
uniapp微信小程序投票系统实战 (SpringBoot2+vue3.2+element plus ) -用户信息修改实现
锋哥原创的uniapp微信小程序投票系统实战：
uniapp微信小程序投票系统实战课程 (SpringBoot2vue3.2element plus ) ( 火爆连载更新中... )_哔哩哔哩_bilibiliuniapp微信小程序投票系统实战课程 (SpringBoot2vue3.2element plus ) ( 火爆连载更新中... )共计21条视频…
uniapp中uview组件库Toast 消息提示 的使用方法
目录
#基本使用
#配置toast主题
#toast结束跳转URL
#API
#Props
#Params
#Methods 此组件表现形式类似uni的uni.showToastAPI，但也有不同的地方，具体表现在：
uView的toast有5种主题可选可以配置toast结束后，跳转相应URL目…
uni-app顶部下拉舒心
下拉刷新实际上是在用户操作下拉交互时重新调用接口，然后将新获取的数据再次渲染到页面中。
操作步骤
基于 scroll-view 组件实现下拉刷新，需要通过以下方式来实现下拉刷新的功能。
配置 refresher-enabled 属性，开启下拉刷新交互监听 ref…
小程序开发之前端技术选型
小程序介绍
随着程序开发的发展，以及各种大公司提供的平台，小程序以及成为了不可忽视的一股力量。 在小程序开发中，前端技术的选型主要取决于小程序的平台。以下是一些主要的小程序平台以及相应的前端技术选项： 微信小程序&#…
#Uniapp：uni-app中vue2生命周期--11个
uni-app中vue2生命周期
生命周期钩子描述H5App端小程序说明beforeCreate在实例初始化之后被调用 详情√√√created在实例创建完成后被立即调用 详情√√√beforeMount在挂载开始之前被调用 详情√√√mounted挂载到实例上去之后调用 详情 注意：此处并不能确定子组…
uniapp(vue2)+VoerkaI18n多语言
今天我学习了VoerkaI18n国际化插件，它是一个适用于Javascript/Vue/React/Solid/ReactNative的国际化全流程解决方案。VoerkaI18n可以帮助我们轻松地实现应用程序的多语言支持，使得应用程序可以适应不同的语言环境。 比较吸引我的是集成自动翻译,t(“中华…
【uniapp-小程序-分享图5/4】
utils.js
//裁剪分享的图片为5:4
const makeCanvas (imgUrl) > {console.log("imgUrl",imgUrl);return new Promise((resolve, reject) > {// 获取图片信息,小程序下获取网络图片信息需先配置download域名白名单才能生效uni.getImageInfo({src: imgUrl,succe…
uniapp中uview组件库CircleProgress 圆形进度条丰富的使用方法
目录
#内部实现
#平台差异说明
#基本使用
#设置圆环的动画时间
#API
#Props 展示操作或任务的当前进度，比如上传文件，是一个圆形的进度环。
#内部实现
组件内部通过canvas实现，有更好的性能和通用性。
#平台差异说明
AppH5微信小程…
uniapp移动端基础介绍
基础介绍 文章目录 基础介绍template结构体常识css 的引用css 的变量js的引用内联样式全局方法全局变量机制屏幕尺寸单位使用sass编写样式 template结构体常识
root节点只能包含一个view标签 template下包含两个view会报错，只要加一个view把两个view包含起来才不会…
uniapp之页面返回并调用返回页方法
在H5页面我们只需下面这样，但是打包成APP是无效的app需要单独加上一个.$vm
const currentPages getCurrentPages();
const currentPage currentPages[currentPages.length - 1];
currentPage[funName] && currentPage[funName]();最终代码，细…
APP流量变现——4项关键指标决定了APP混合变现的收入
APP流量变现的方式有很多种，主要的可以分为IAA（广告）收入、IAP（用户应用内付费）收入、订阅收入、单次买断收入。这里主要围绕当前流行的混合变现模式，即广告收入（IAA）应用内付费&…
uniapp的H5如何实现全局组件加载，类似uni.showToast？
在项目components文件夹新建一个base-loading文件夹，文件包括两个文件
第一个文件base-loading.vue
<template><u-overlay :show"visible" opacity"0.5"><view class"base-loading" v-show"visible">&…
uniapp微信小程序投票系统实战 (SpringBoot2+vue3.2+element plus ) -用户投票实现
锋哥原创的uniapp微信小程序投票系统实战：
uniapp微信小程序投票系统实战课程 (SpringBoot2vue3.2element plus ) ( 火爆连载更新中... )_哔哩哔哩_bilibiliuniapp微信小程序投票系统实战课程 (SpringBoot2vue3.2element plus ) ( 火爆连载更新中... )共计21条视频…
tab分页高亮切换及tab交互
当用户点击页面中的 Tab 后，切换展示相应的商品列表，功能相对简单，快速实现即可。
// 存储高亮的下标
<script setup lang"ts">
// 高亮的下标
const activeIndex ref(0)
</script><template><!-- 推荐选项…
uniapp 实战 -- app 的自动升级更新（含生成 app 发布页）
uniapp 提供了 App升级中心 uni-upgrade-center ，可以便捷实现app 的自动升级更新，具体编码和配置如下： 1. 用户端 – 引入升级中心插件 下载安装插件 uni-upgrade-center - App
https://ext.dcloud.net.cn/plugin?id4542 pages.json 中添加…
uniapp中uview组件库的AlertTips 警告提示使用方法
目录
#使用场景
#平台差异说明
#基本使用
#图标
#可关闭的警告提示
#API
#Props
#Events 警告提示，展现需要关注的信息。
#使用场景
当某个页面需要向用户显示警告的信息时。非浮层的静态展现形式，始终展现，不会自动消失࿰…
案例121:基于微信小程序的作品集展示系统设计与实现
文末获取源码 开发语言：Java 框架：SSM JDK版本：JDK1.8 数据库：mysql 5.7 开发软件：eclipse/myeclipse/idea Maven包：Maven3.5.4 小程序框架：uniapp 小程序开发软件：HBuilder X 小程序…
uniapp滑动页面切换和下拉刷新，触底加载更多（swiper + scroll-view）
因为官方文档乱七八糟的，所以自己来总结下 需求： 常见的上方tag标签切换，下方是页面，上面点击切换，下面页面也切换，下方列表有下拉刷新，触底加载更多 因为这两个组件都是固定高度的，…
uniapp使用tcp和udp的区别和例子
在Node.js中，主要有三种socket：TCP，UDP和Unix域套接字。以下分别介绍这TCP/UDP的使用方法和示例：
TCP socket TCP socket提供了可靠的、面向连接的通信流，适用于需要可靠传输的应用，例如Web浏览器的HTTP请…
uniapp 编译后文字乱码的解决方案
问题: 新建的页面中编写代码，其中数字和图片都可以正常显示，只有中文编译后展示乱码 页面展示也是乱码 解决方案: 打开HuilderX编辑器的【文件】- 【以指定编码重新打开】- 【选择UTF-8】 然后重新编译就可以啦~ 希望可以帮到你啊~
uniapp一键换色
需求 :
在我们现有项目基础上, 把原来的颜色替换成另一个颜色, 同时需要为下一个项目预留出来随时更换主题色, 实现一键换色
实现 :
1. 介绍 兼容不同项目对主题色及图标的需求 主要通过以下对css颜色和icon主题色图标两个模块的切换
scss/less的css变量config/index.js中的…
uniapp 使用canvas制作柱状图
效果图： 实现思路： 1、通过展示数据计算需要画几根柱子； 2、通过组件宽度、高度计算出每根柱子的宽度及高度； 3、for循环依次绘制每根柱子； 4、绘制柱子时，先绘制顶部百分比、value值，再绘制柱…
uni-app引用矢量库图标
矢量库引用
导入黑色图标
1.生成连接，下载样式
2.导入项目（字体样式）
3.引入css样式 4.替换font-face 5.使用图标（字体图标，只有黑色）
导入彩色图标
1.安装插件
npm install -g iconfont-tools2.…
#Uniapp：App.vue/App.uvue 生命周期
App.vue/App.uvue 生命周期
函数名说明平台兼容onLaunch当uni-app 初始化完成时触发（全局只触发一次），参数为应用启动参数，同 uni.getLaunchOptionsSync 的返回值onShow当 uni-app 启动，或从后台进入前台显示…
uni-app基础详解（组件、弹窗、数据缓存、页面跳转）
uni-app基础详解（组件、弹窗、数据缓存、页面跳转） uni-app组件scroll-viewswipertext 文本button 按钮input 输入框radio 单选checkbox 多选picker 选择器slider 滑块textarea 文本域 弹窗提示框 uni.showLoading提示弹窗 uni.showToast确定取消框 uni.…
❤ Uniapp使用四( 高阶使用配置和各种实现篇)
❤ Uniapp使用四( 复杂配置和各种实现篇)
uniapp引入 vant
引入方式 1、下载vant源码 方式一：从 Vant 官网首页进入 GitHub下载对应版本的压缩包,将文件解压后备用,确保下载的压缩包里有dist 文件夹
2、创建 uniapp 项目,在根目录下新建 一个文件夹wxcomponents …
uniapp写微信小程序实现电子签名
写电子签名一定要注意的是一切全部按照手机上的适配来，为啥这么说呢，因为你在微信开发者工具中调试的时候认为是好的，正常的非常nice,当你发布版本的时候你会发现问题出来了。我下边的写法你可以直接用很简单。就是要记住canvas的几个属性和用…
uni-app的组件（二）
多项选择器checkbox-group
多项选择器，内部由多个 checkbox 组成。 <checkbox-group><checkbox checked color"red" value"1"></checkbox> 篮球<!-- disabled:是否禁用 --><checkbox disabled color"rgba(0,0…
#Uniapp：upx 和 rpx使用区分 设计稿计算规则
upx 和 rpx 区别
upx： upx是uni-app中的长度单位，它代表设备独立像素（与屏幕密度无关），1upx等于设备上的1个物理像素。在不同分辨率和屏幕尺寸的设备上，upx会自动转换为适应当前屏幕的最佳物理像素值&…
uniapp 实战 -- 创建 uni-admin 项目，部署到 uniCloud 前端网页托管（免费云空间）
创建 uni-admin 项目 可见 只能创建一个超级管理员，创建过后，登录页将不再显示 注册管理员账号 部署到 uniCloud 前端网页托管 部署成功，访问地址可预览效果！
https://static-mp-7b65169e-151f-4fbb-a5ba-2125d4f56e3f.next.bs…
uniapp-uniCloud的基本使用（编写云存储的地区级联选择器）
目录 新建项目，创建 uniCloud 服务空间并关联
1. 新建项目
2. 创建 uniCloud 服务空间并关联
manifest.json内未配置Appld,请重新获取后再
云数据库的使用
城市选择和云数据库
介绍
云端数据
DB Schema概述 新建项目，创建 uniCloud 服务空间并关…
设置了uni.chooseLocation，小程序中打不开
设置了uni.chooseLocation，在小程序打不开，点击没反应，地图显现不出来；
解决方案：
1.Hbuilder——微信开发者工具路径没有配置
打开工具——>设置 2.微信小程序服务端口没有开
解决方法：打开微信开发…
小程序中使用上传图片，显示、删除、预览
一、功能介绍
需要哦用户点击加号上传图片，并展示所上传图片和能够删除和预览 二、功能实现
采用的uniapp，创建了一个view容器包裹加号图标和展示的图片。
内部展示图片超过9张时候，加号图片隐藏 <view class"img-list">/…
uniapp下各端调用三方地图导航
技术栈
开发框架： uniappvue 版本： 2.x
需求
使用uniapp在app端(Android，IOS)中显示宿主机已有的三方导航应用，由用户自主选择使用哪家地图软件进行导航，选择后，自动将目标地址设为终点在导航页面。 使用…
uniapp h5 发行后 微信第二次打开网址 页面白屏
发行后把网址给客户，第一次可以正常登录打开，第二次打开白屏
原因：第一次打开时没有token，所以跳转登录页，可以正常访问 第二次打开时有token，但是网址根目录没有配置默认页面，所以白屏 解决…
uniapp+vue3面试纪要
uniappvue3面试纪要
uniapp
1.uniapp的生命周期
应用生命周期
onLaunch：应用程序启动时触发，仅在应用程序第一次启动时触发。
onShow：应用程序进入前台时触发，可以获取到应用程序被打开的方式和场景值。
onHide：应用…
UniApp+Vue智慧工地信息化管理云平台源码（支持多工地使用）
智慧工地建设的意义
1、提高工程效率
智慧工地可以通过数字化手段，将工地的各个方面进行数字化存储和管理，从而实现的实时监测和共享。这可以大大提高工程的效率，减少工程中的人工干预，并且可以为后续的工程维护和升级提供便利。…
❤ uniapp报错
❤ uniapp报错
使用背景图片报错 uniapp表单验证报错
Bad attr ruleswith message: unexpected token’required’.
问题描述 使用官网示例的rules代码报错 原因分析： 官网给的代码里面的required加了引号
<!-- 这是官网代码 -->
<uni-forms-item :lab…
uniapp (UI框架：uview2.x) JSON数据导出生成excel
一、生成下载的表格模板数据
代码如下：
// 建立一个工具类函数文件 utils.js
export function tableToExcel(jsonData, str) {//要导出的json数据let worksheet sheet1// let str <tr><td>姓名</td><td>电话</td><td>邮箱&…
uniapp如何封装接口
在uniapp中封装接口可以使用uni.request方法，示例代码如下：
// 封装接口
export function getGoodsList(params) {return new Promise((resolve, reject) > {uni.request({url: http://api.example.com/goods,method: GET,data: params,success: res…
uniapp中为什么会出现跨域问题,如何解决
在uniapp中，跨域问题通常是由于浏览器的同源策略引起的。同源策略要求请求的域名、协议、端口都必须一致，否则会产生跨域问题。
解决跨域问题有以下几种方法： 在后端服务器上配置跨域资源共享（CORS）：在服务…
#Uniapp: uni.previewImage(OBJECT) 预览图片
uni.previewImage(OBJECT) 预览图片。
api地址
媒体-图片
示例
handlePreviewImg(current) {const urls this.rightList.map(x > x.icon)uni.previewImage({urls,current})}OBJECT 参数说明
参数名类型必填说明平台差异说明countNumber否最多可以选择的图片张数&#…
uniapp复选框 实现排他选项
选择了排他选项之后 复选框其他选项不可以选择 <view class"reportData" v-for"(val, index) in obj" :key"index">
<view v-if"val.type 3" ><u-checkbox-group v-model"optionValue" placement"colu…
uniapp安卓本地打包成apk
uniapp安卓本地打包成apk
环境准备
1.HBuilderX最新版 2.与HBuilderX版本对应版本的“Android 离线SDK - 正式版”， 下载见：https://nativesupport.dcloud.net.cn/AppDocs/download/android.html 3.Android Studio，官方下载地址：…
Vue开发之proxy代理的配置（附带uniapp代理配置）
vue
1.在vue.config.js中添加 devServer 属性中配置 proxy 属性
module.exports {productionSourceMap: false,publicPath: /,devServer: {port: 8085,proxy: {/api/admin: {target: http://10.58.104.70:6111,changeOrigin: true,pathRewrite: {/api/: /}},/api: {target: …
基于 UniAPP 社区论坛项目多端开发实战
社区论坛项目多端开发实战 基于 UniAPP 社区论坛项目多端开发实战一、项目准备1.1 ThinkSNS 简介及相关文档1.2 使用 UniAPP 构建项目1.3 构建项目文件结构1.4 配置页面 TabBar 导航1.5 使用 npm 引入 uView UI 插件库 二、首页功能实现2.1 首页 header 广告位轮播图功能实现2.…
uniapp开发小程序—scroll-view实现内容滚动时， 标题也滚动
一、需求 scroll-view实现内容滚动时， 标题也滚动 二、效果 三、代码实现
<template><view class"content"><view class"head">头部固定区域</view><view class"list_box"><!-- 菜单左边 -->&l…
记录一下uniapp 集成腾讯im特别卡(未解决)
uniapp的项目运行在微信小程序 , 安卓 , ios手机三端 ,
之前这个项目集成过im,不过版本太老了,0.x的版本, 现在需要添加客服功能,所以就升级了
由于是二开 , 也为了方便 , 沿用之前的webview嵌套腾讯IM的方案 , 选用uniapp集成ui ,升级之后所有安卓用户反馈点击进去特别卡,几…
uniapp 框架搭建及使用
uniapp官方文档 uview官网文档 前期工作： 1.下载Hbuilder X编辑器；2.熟悉uniapp的相关文档；3.查找合适的UI组件库，我使用的是uview（适配H5和小程序）
创建uniapp
新建: 新项目的话打开Hbuilder X选择项目&…
uniapp嵌套webview，无法返回上一级？
uniapp嵌套webview，如何解决回退问题？ 文章目录 uniapp嵌套webview，如何解决回退问题？遇到问题解决方式方式一方式二 场景：
进入首页，自动跳转第三方应用 遇到问题
在设备上运行时，无法回退上…
uniapp组件库SwipeAction 滑动操作 使用方法
目录
#平台差异说明
#基本使用
#修改按钮样式
#点击事件
#API
#Props
#Event 该组件一般用于左滑唤出操作菜单的场景，用的最多的是左滑删除操作。
注意
如果把该组件通过v-for用于左滑删除的列表，请保证循环的:key是一个唯一值，可以…
uniapp页面跳转的几种方式 以及举例(2)
又来混时长 嫖流量卷了
一,uni.navigateTo(OBJECT)
保留当前页面，跳转到应用内的某个页面，使用uni.navigateBack可以返回到原页面。 // 1.不传参
uni.navigateTo({url:./home/index
});
// 2.传参字符串
uni.navigateTo({url:./home/index?title${tit…
基于uniapp封装的table组件
数据格式
tableData: [{elcInfo: [{tableData:[1,293021.1,293021.1,293021.1,293021.1,]}]},{elcInfo: [{tableData:[1,293021.1,293021.1,293021.1,293021.1,]}]},{elcInfo: [{tableData:[1,293021.1,293021.1,293021.1,293021.1,]}]},/* {title: "2",elcInfo: [{…
Uni-App三甲医院、医保定点三甲医院在线预约挂号系统源码
医院在线预约挂号系统是一种方便患者预约挂号的系统，患者可以通过该系统进行预约挂号，省去了到医院现场排队等待的时间，提高了就诊效率。随着医院信息化水平的不断发展，医院在线预约挂号管理系统已成为医院管理中不可或缺的一部分…
uniapp实现点击A页面按钮，跳转到B页面的指定位置
一、需求： uniapp实现点击A页面按钮，跳转到B页面的指定位置 二、实现方法
第一种方式： 必须必须要注意！ scroll-into-view 即使是测试也不可写死（组件布局完成后，动态的改变这个scroll-into-view的值&…
uniapp实现页面左滑右滑切换内容
uniapp uview：使用uniapp的swiper和uview的tabs标签组合实现
Tabs 标签 | uview-plus 3.0 - 全面兼容nvue的uni-app生态框架 - uni-app UI框架
vue
<template> <view class"main"> <view class""> …
#Uniapp:uni.request(OBJECT)
uni.request(OBJECT)
发起网络请求。
示例
uni.request({url: https://www.example.com/request, //仅为示例，并非真实接口地址。data: {text: uni.request},header: {custom-header: hello //自定义请求头信息},success: (res) > {console.log(res.data);thi…
uni-app中代理的两种配置方式
方式一:
在项目的 manifest.json 文件中点击 源码视图 在最底部的vue版本下编写代理代码 方式二:
在项目中创建 vue.config.js 文件然后进行配置 在页面中发起请求
完整的url：http://c.m.163.com/recommend/getChanListNews?channelT1457068979049&size10 …
uniapp中组件库丰富的Switch 开关选择器使用方法
目录
#平台差异说明
#基础使用
#加载中
#禁用switch
#自定义尺寸
#自定义颜色
#自定义样式
#异步控制
API
#Switch Props
#Switch Event 选择开关用于在打开和关闭状态之间进行切换。
#平台差异说明
App（vue）App（nvue࿰…
【uview2.0】Keyboard 键盘 与 CodeInput 验证码输入 结合使用 uview
https://www.uviewui.com/components/codeInput.html （CodeInput 验证码输入） https://www.uviewui.com/components/keyboard.html （Keyboard 键盘） <u-keyboard mode"number" :dotDisabled"true" :show&q…
uniapp uni.chooseLocation调用走失败那里,错误码：112
问题：我配置了百度上所有能配置的，一直调用不成功，如下图配置的 1:第一个 配置 代码：
"permission": {"scope.userLocation": {"desc": "你的位置信息将用于小程序位置接口的效果展示"}…
uniapp 常用数据操作
List 操作
list合并
list.concat(list2)
list移除元素
list.splice(index,number)
list.map() 生成新的数组
list.map(v>{return v.key})
list.filter 筛选（返回 符合过滤条件的元素组成的新数组） list.filter(v>{return v.key1})
list.fo…
uniapp小程序实现自定义返回按钮和胶囊对齐 做到兼容各手机型号
效果： 用到的API：
uni.getMenuButtonBoundingClientRect();官网地址：
https://uniapp.dcloud.net.cn/api/ui/menuButton.html#getmenubuttonboundingclientrect 控制台打印： 代码示例：
<template><view cl…
uniapp css样式穿透
目录 前言css样式穿透方法不加css样式穿透的代码加css样式穿透的代码不加css样式穿透的代码 与 加css样式穿透的代码 的差别参考 前言
略
css样式穿透方法
使用 /deep/ 进行css样式穿透
不加css样式穿透的代码
<style>div {background-color: #ddd;}
</style>…
uniapp设置隐藏原生导航栏(三)
1、单个页面隐藏 在pages.json里配置 (第一种方式)
{"path": "pages/home/index","style": {"navigationBarTitleText": "首页","navigationStyle": "custom" // 使用自定义导航栏，系统会关…
UI -- UniApp
UniApp UI HBuilder X 新建项目 – 默认模板 pages.json同级 componentsutilsviews components/sl-button/sl-button.vue
<template><view>测试123</view>
</template><script>export default {name:"sl-button",data() {return …
uniapp移动端——企业微信H5调用jssdk实现扫一扫，通过weixin-java-cp获取ticket签名，配置config
背景： 使用企业微信开发扫一扫功能
可信域名验证 (1)企业微信的可信域名需要和企业微信的备案主体一致。
域名备案主体可通过站长工具查看域名备案主体。https://icp.chinaz.com/
企业微信备案主体可以咨询管理员
（2）通过nginx配置域名归…
#Uniapp: uni.makePhoneCall(OBJECT) 拨打电话
uni.makePhoneCall(OBJECT) 拨打电话
拨打电话。
OBJECT 参数说明
参数名类型必填说明phoneNumberString是需要拨打的电话号码successFunction否接口调用成功的回调failFunction否接口调用失败的回调函数completeFunction否接口调用结束的回调函数（调用成功、失败…
uniapp微信小程序图片上传功能实现，页面显示文件列表、删除功能
uniapp小程序图片上传功能效果预览
一、template 页面结构
<view class"upload-box"><view class"upload-list"><view class"upload-item" v-for"(item,index) of fileList" :keyindex><image class"img…
navigateTo失效-跳转不了页面解决办法！uniapp\vue
改了一个小时多的错误，跳转页面无论怎么样都跳转不了，有2个问题：
注意：uniapp的报错可以在console里检查！
1.pages.json文件没有配置路径， 在pages:[ ]里面加 （根据自己的路径进行修改
{&qu…
uniapp APP接入Paypal
1. 登录paypal开发者中心，
2. 选择 Apps & Credentials 点击 Create App创建应用，创建后点击编辑按钮，如图： 3. 进入应用详情，勾选Log in with PayPal点击 Advanced Settings 添加return URL等信息并保存。如图&a…
uniapp的安卓升级功能说明
目录 1.实现思路
2.app代码示例
3.说明 1.实现思路
①将安装包存储在后台服务器。
创建版本信息表，存储安装包的相关信息。保存安装包的名称，版本号，网络地址，是否强制升级，发布时间信息及升级内容等。表结构如下&…
uniapp如何引入uview组件？
目录 1.引入前准备
2.在项目中引入组件
1.mian.is文件
2.uni.scss 文件
3.App.vue文件
4.pages.json 文件
3.测试成功 1.引入前准备 为了方便我们在制作项目的过程中，方便使用模板组件，快速开发。我们可以选择引入组件。
在uni-app中使用uView组件…
uniapp报错：export { render, staticRenderFns, recyclableRender, components }
uniapp vue2项目启动报错
export { render, staticRenderFns, recyclableRender, components }解决办法: 降低prettier的版本
"prettier": "^3.2.4","prettier": "2.8.8",参考
SyntaxError: /xxxx.vue: Unexpected token, expected…
uniapp使用uQRCode插件生成二维码的简单使用
最近在找移动端绘制二维码的问题 ，直接上代码 下载 weapp-qrcode.js(可以通过npm install weapp-qrcode --save 下载,之后把它父子到untils目录下） npm install weapp-qrcode --save在组件页面使用
<canvas id"couponQrcode" canvas-id&qu…
uni-app h5对接 thinkphp5接口跨域
uni-app h5对接 thinkphp5接口跨域
问题描述
请求接口 提示
Access to XMLHttpRequest at http://******* from origin http://localhost:8091 has been blocked by CORS policy: Response to preflight request doesnt pass access control check: It does not have HTTP o…
用vue实现微信小程序的点餐首页-纯前端效果
一、效果图
图片来源于网络 二、代码
<template><view class"container"><view class"top"><image src"../../static/img/home.png" class"home"></image></view><view class"content&…
uniapp组件库fullScreen 压窗屏的适用方法
目录
#平台差异说明
#基本使用
#触发压窗屏
#定义压窗屏内容
#注意事项 所谓压窗屏，是指遮罩能盖住原生导航栏和底部tabbar栏的弹窗，一般用于在APP端弹出升级应用弹框，或者其他需要增强型弹窗的场景。 警告
由于uni-app的Bug࿰…
快快销ShopMatrix 分销商城多端uniapp可编译5端-代理商收益管理：差价奖励和销售额统计
代理商收益管理是一种针对代理商的利润分配模式，主要通过差价奖励和销售额统计来实现。这种模式的核心思想是通过激励代理商的销售行为，提高代理商的积极性和销售效率，从而实现整个销售网络的增长。
差价奖励是代理商收益管理中的一种常见方…
uniapp微信小程序-请求二次封装（直接可用）
一、请求封装优点 代码重用性：通过封装请求，你可以在整个项目中重用相同的请求逻辑。这样一来，如果 API 发生变化或者需要进行优化，你只需在一个地方修改代码，而不是在每个使用这个请求的地方都进行修改。 可维护性&a…
uniapp 实现路由拦截，权限或者登录控制
背景： 项目需要判断token，即是否登录，登录之后权限
参考uni-app官方：
为了兼容其他端的跳转权限控制，uni-app并没有用vue router路由，而是内部实现一个类似此功能的钩子：拦截器，由…
uniapp 解决键盘弹出页面内容挤压问题
page.json 配置 加 “app-plus”: { “softinputMode”: “adjustResize” } {"path": "pages/jxx/xx","style": {"navigationBarTitleText": "贺卡DIY","enablePullDownRefresh": false,"app-plus": {…
uniapp微信小程序-input默认字的样式
需要的是这样的 问题 正常是在input框上面写样式就行，但是uniapp不起作用
解决
直接在input上写placeholder-style"color就解决了
<input class"findInput" type"text" placeholder"关键词查询"placeholder-style"co…
uniapp组件库Card 卡片 的使用方法
目录
#平台差异说明
#基本使用
#配置卡片间距
#配置卡片左上角的缩略图
#配置卡片边框
#设置内边距
#API
#Props
#Slot
#Event 卡片组件一般用于多个列表条目，且风格统一的场景。
#平台差异说明
AppH5微信小程序支付宝小程序百度小程序头条小程序QQ小程…
uniapp，页面当有按钮的时候，可以做一个动态的效果
效果：
这个是当点着按钮的时候没有松开按钮的效果（没有阴影） 这个是当松开按钮的效果（有阴影） 原理讲解：
这段代码实现的业务逻辑是在一个Vue组件中控制“现金”按钮的阴影效果。具体来说，它通…
uniapp+vue3+Ts(小兔仙项目)
一. 项目起步
拉取模块代码：
git clone -b template https://gitee.com/heima-fe/uniapp-shop-vue3-ts.git heima-shop 注意： 小程序真机预览需在 manifest.json 中添加微信小程序的 appid 引入 uni-ui 组件库
安装uni-ui组件库
pnpm i @dcloudio/uni-ui
配置自动导入组…
](https://img-blog.csdnimg.cn/direct/b66ab2c76dd94eaba95362b880f3209d.png)
uniapp scroll-view用法[下拉刷新,触底事件等等...](4)
前言:可滚动视图区域。用于区域滚动
话不多说 直接上官网属性 官网示例 讲一下常用的几个
scroll 滚动时触发 scrolltoupper 滚动到顶部或左边，会触发 scrolltoupper 事件
scrolltolower 滚动到底部或右边，会触发 scrolltolower 事件
1.纵向滚动…
校园圈子论坛系统--APP小程序H5，前后端源码交付，支持二开！uniAPP+PHP书写！
随着移动互联网的快速发展，校园社交成为了大学生们日常生活中重要的一部分。为了方便校园内学生的交流和互动，校园社交小程序逐渐走入人们的视野。本文将探讨校园社交小程序的开发以及其带来的益处。 校园社交小程序的开发涉及许多技术和设计方面。首先&…
uniapp-app使用富文本编辑器editor
使用的是uniapp内置组件的表单组件editor：editor 组件 | uni-app官网 (dcloud.net.cn)
文档上写的也不是特别详细，还以为得npm，但没npm也能用
注意：editor不能封装为组件，否则报错（在其他文章看的&#x…
uniapp+uView 【详解】录音，自制音频播放器
效果预览 代码实现 <template><view class"btnListBox"><view class"audioBox" v-if"audioLength"><u-row><u-col span"2"><u--text aligncenter :text"currentTime"></u--text>…
uniapp将方法挂载到全局
前言
首先需要有一个自己封装的方法,话不多说,直接上代码!
方法文件(common.js)
const getnav (page, type, param token) > {// type 判断是否 需要验证登录if (!page) return uni.showModal({title: 提示,content: 功能暂未开通~,showCancel: false})let user uni.g…
uniapp底部栏设置未读红点或角标
pages.json
{... // 省略"tabBar": {"color": "#333333","selectedColor": "#3296fa","backgroundColor": "#ffffff","borderStyle": "white","list": [{"pagePat…
uniapp使用u-popup组件弹窗出现页面还可滑动
*1、问题所在：
弹窗遮罩层出现了页面依旧可以上下滑动 2、要求:
为了用户更好交互体验，弹窗出现后应禁止页面往下滑动
3、实现思路：
在弹窗盒子外层添加个阻止触摸冒泡事件，使用touchmove.stop.prevent
4、代码如下ÿ…
uni-app小程序自定义导航栏
最近在开发一个uni-app小程序，用到了自定义导航栏，在这里记录一下实现过程：
page.json
在对应页面路由的style中设置入"navigationStyle": "custom"取消原生导航栏，自定义导航栏
{"path": "…
hbuilderx uniapp运行到真机控制台显示手机端调试基座版本号1.0.0，调用uni.share提示打包时未添加share模块
记录一个困扰了几天的一个蠢问题，发现真相的我又气又笑。 由于刚开始接触uniapp 移动端开发，有个需求需要使用uni.share API，但是我运行项目老提示打包时没配置share模块
我确实没在manifest内配置。网上搜了一些资料，但是我看官…
uniapp基于Android平台的古诗词学习挑战系统 微信小程序_b7obw
APP性能需求 （1）用户在安卓APP页面各种操作可及时得到反馈。 （2）该平台是提供给多个用户使用的平台，用户使用之前需要注册登录。登录验证后，用户才可进行各种操作[10]。 （3）管理员用…
FastAdmin青动CRM-E售后
应用介绍 一款基于FastAdminThinkPHP和uniapp开发的CRM售后管理系统，旨在助力企业销售售后全流程精细化、数字化管理，主要功能：客户、合同、工单、任务、报价、产品、库存、出纳、收费，适用于：服装鞋帽、化妆品、机械机…
uniapp微信小程序触底加载（超简单）
你在哪个页面需要就给他在page.json里面填写以下代码，表示距离底部还有50px就触发 1.page.json添加以下代码 "onReachBottonDistance":50
这是文档链接 页面 | uni-app官网 (dcloud.net.cn)
2. 页面中写以下代码 onReachBottom(e) {console.log(&quo…
uniapp设置不显示顶部返回按钮
一、pages文件中，在相应的页面中设置 "titleNView": {"autoBackButton": false} 二、对应的页面文件设置隐藏元素 document.querySelector(.uni-page-head-hd).style.display none
uniapp中echart实例
1，自定义仪表盘 797_1706772047 index.vue
import { useGaugeStore } from "/stores/utils";
const { currentValueEndAngle, currentSplitNumber } storeToRefs(useGaugeStore()
);
const gaugeStore useGaugeStore();const wenduGauge ref<chart…
uniapp中组件库Mask 遮罩层 的使用方法
目录
#平台差异说明
#基本使用
#嵌入内容
#遮罩样式
#API
#Props
#Events
#Slot 创建一个遮罩层，用于强调特定的页面元素，并阻止用户对遮罩下层的内容进行操作，一般用于弹窗场景
#平台差异说明
AppH5微信小程序支付宝小程序百度小程…
uniapp禁止截屏录屏/投屏功能（adb投放失效）
经过测试代码写在App.vue会失效,请写在符合逻辑的界面
uni-app 实现安卓防截屏
在uniapp中实现 要在App中全局禁止截屏，那么可以在App.vue中调用 如果想要某个页面防截屏就在某个页面调用，但是在离开这个页面的时候要恢复截屏，否则全局…
【uniapp开发小程序】封装一个公共接口，每次点击不同页面时都会调用
在uni-app中封装一个公共接口，让每次点击不同页面时都会调用，您可以使用uni-app的全局混入（mixin）功能来实现 1.创建一个全局混入文件 mixin.js，并在其中定义一个公共方法：
// mixin.js
export default {…
uniapp小程序实现直播组件live-player全屏问题
实现效果：
代码：
<template><view class"player-content"><!-- #ifdef APP-PLUS --><video id"myVideo" :src"srcLink" autoplay controls><!-- 打开全屏 --><image class"img…
uniapp播放mp4省流方案
背景： 因为项目要播放一个宣传和讲解视频，视频文件过大，同时还为了节省存储流量，想到了一个方案，用m3u8切片替代mp4。 m3u8：切片播放，可以理解为一个1G的视频文件，自行设置文…
uniapp API文档地址 以及 HBuilder安装
uniapp API文档地址 以及 HBuilder安装
一、进入 当前网站
uni-app 官网
[uni-app](https://zh.uniapp.dcloud.io/quickstart-hx.html)二、点击截图下载文件 三、
进入 当前网站 （https://www.dcloud.io/hbuilderx.html）
浏览器会识别 也可以自行选择…
uniapp uni.redirectTo() 跳转失效
原代码：
uni.redirectTo({url: /pages/mine/Mine
})
想实现的效果是用户登录成功后跳转至”我的“页面，但是点击登录按钮后可以成功打印出登录信息，却不跳转页面。
原因是我在 tabBar 中配置了 Mine 页面。
"tabBar": {"b…
uniapp【组件封装】时间戳格式化为星期
组件 components/dos-week.vue
<template><text>{{week}}</text>
</template>
<script>export default {props: {time: String},mounted(e) {this.week this.getWeek(Number(this.time))},data() {return {week: }},methods: {// 通过时间戳计…
uniapp 组件封装
1. uniapp 组件封装时间戳格式化为星期
1.1. components/m-week.vue <template><text>{{week}}</text>
</template>
<script>export default {props: {time: String},mounted(e) {this.week this.getWeek(Number(this.time))},data() {return …
uniapp android和微信小程序实现PDF在线预览
在使用uniapp开发移动端时，微信开发者工具里webview能正常打开后端接口返回的pdf文件流。正式发布后，在配置了业务域名和服务器域名的前提下，预览pdf文件却只能看到白屏，因此我猜测微信小程序不能通过webview读取文件流。这个想法…
Android电动汽车充电服务vue+uniAPP微信小程序
本系统利用SSM和Uniapp技术进行开发电动汽车充电服务系统是未来的趋势。该系统使用的编程语言是Java，数据库采用的是MySQL数据库，基本完成了系统设定的目标，建立起了一个较为完整的系统。建立的电动汽车充电服务系统用户使用浏览器就可以对其…
校园墙表白墙系统uniapp微信小程序
配置文件 (自动编号、配置参数名称、配置参数值)； 前端开发:vue 语言：javapythonnodejsphp均支持 运行软件:idea/eclipse/vscode/pycharm/wamp均支持 框架支持:Ssm/django/flask/thinkphp/springboot/springcloud均支持 数据库 mysql 数据库工具&#x…
uniapp顶部导航栏高度适配
为了实现好看又实用的顶部导航栏，不得不自己定义导航栏样式。而自己定义的导航栏高度会因为手机的型号不同所展示的效果也就不同，所以只能通过适配高度来达到预期的效果
1.需要在page.json文件中对需要自定义导航栏文件进行配置
"navigationStyle…
uniapp 使用renderjs引入echarts
效果图： 1.1renderjs引入echarts
组件zmui-echarts.vue：
<template><view class"zmui-echarts" :prop"option" :change:prop"echarts.delay"></view>
</template><script>export defaul…
【VUE】UniAPP之uview组件库，自定义tag封装，支持添加u-icon图标
组件代码
<template><view class"tag" :class"[props.mode, props.shape]"><slot name"left"><!-- icon图标 没有传入图标时不显示 --><u-icon v-if"props.icon ! " :name"props.icon" :color&…
分享一下 uniapp 打包安卓apk
首先需要安装 Java 环境，这里就不做解释了
第二步：打开 mac 终端 / cmd 命令行工具 使用keytool -genkey命令生成证书 keytool -genkey -alias testalias -keyalg RSA -keysize 2048 -validity 36500 -keystore test.keystore *testalias 是证书别名&am…
[uniapp生命周期]详细讲解uniapp中那些属于vue生命周期,那些属于uniapp独有的生命周期,以及这中间的区别 相关的内容和api 代码注释
目录 1. Vue.js生命周期函数2.Vue生命周期函数代码beforeCreatecreatedbeforeMountmountedbeforeUpdateupdatedbeforeDestroydestroyed$nextTick$forceUpdate$destroy 3. UniApp独有的生命周期函数onLaunchonShowonHideonError 4.总结 在UniApp中，除了Vue.js的生命周…
[uniapp页面路由跳转]详细讲解uniapp中使用标签和的api完成页面跳转使用方法 代码注释
目录 一、标签跳转--- 把跳转的信息写在标签当中1. a标签2. navigator标签 二、API跳转[编程式]-----通过方法 js方式跳转1. uni.navigateTo2. uni.redirectTo3. uni.switchTab4. uni.reLaunch5. uni.navigateBack 总结 Uniapp是一款基于Vue.js的跨平台开发框架，允许…
uniapp从入门到进阶
一、了解uniapp 跨平台开发：Uniapp可以同时开发多个平台的应用，只需编写一套代码即可。开发者可以通过编写Vue组件来构建界面，通过编写JavaScript代码来实现业务逻辑。 页面和组件：Uniapp的页面和组件都是基于Vue组件的ÿ…
uniapp的api用法大全
页面生命周期API
uniApp中的页面生命周期API可以帮助开发者在页面的不同生命周期中执行相应的操作。常用的页面生命周期API包括：onLoad、onShow、onReady、onHide、onUnload等。其中，onLoad在页面加载时触发，onShow在页面显示时触发…
UniApp 快速上手与深度学习指南
一、UniApp 简介
UniApp 是中国DCloud公司研发的一款创新的跨平台应用开发框架，它基于广受欢迎的前端开发库Vue.js，旨在解决多端适配和快速开发的问题。通过UniApp，开发者能够采用一套统一的代码结构、语法和API来构建应用程序，从而实现真正意义上的“一次编写，到处运行”…
uniapp小程序端使用计算属性动态绑定style样式踩坑
踩坑点: 使用uniapp编译小程序端动态绑定复杂style使用计算属性方式，return必须返回json字符串格式，不能返回object，否则会不起作用。
代码总览
视图层 逻辑层（注意这里是使用的计算属性哈） 这里我封装成了一个个性化…
Uniapp真机调试：手机端访问电脑端的后端接口解决
Uniapp真机调试：手机端访问电脑端的后端接口解决
1、前置操作
HBuilderX -> 运行 -> 运行到手机或模拟器 -> 运行到Android App基座 少了什么根据提示点击下载即可 使用数据线连接手机和电脑 手机端：打开开发者模式 -> USB调试打开手机端&…
微信小程序 民宿预订租赁系统uniApp
通过山青水磨APP办理租房相关业务，线上解决预定、退订的业务，旅客在使用时更加灵活，实现了快速找房，在线沟通、便捷租赁等操作，除此以外，还能帮助旅客获取周边资讯、当地特色活动服务，提升旅客的…
UniApp 生命周期详解
UniApp 是一个使用 Vue.js 开发所有前端应用的框架，它可以编译到 iOS、Android、H5、小程序等多个平台。在 UniApp 中，生命周期是指应用或页面从创建到销毁的过程中所经历的一系列阶段。了解生命周期可以帮助开发者更好地管理资源、优化性能和提升用户体…
uniapp中配置开发环境和生产环境
uniapp在开发的时候，可以配置多种环境，用于自动切换IP地址，用HBuilder X直接运行的就是开发环境，用HBuilder X发布出来的，就是生产环境。
1.使用HBuilder X创建原生的uniapp程序
选择vue3 2.什么都不改，就…
uniapp日志写入
1.来源于：
html5 plus 记录日志 - DCloud 插件市场
2.公共目录中建一个文件夹:walker-logger.js
/**
* 标题：自定义日志存储在txt中
* 说明：
1. 自定义日志存储在txt中
2. 生成的文件存放在对应app目录下的 _doc/logs 文件夹中
js
// mai…
uniapp微信小程序开发踩坑日记：onShow的应用场景及用法
onShow的应用场景
由于微信小程序是单页应用程序，所以用户在打开小程序后，只有第一次进入页面时会加载页面，之后再通过导航栏切换到相同的页面并不会导致页面重新加载
但是在某些场景下，我们希望每次用户一回到某个页面…
uniapp 小程序 vue TypeError: Cannot read property ‘toString‘ of undefined 手机号脱敏
18888888888 脱敏为 188****8888
是因为对字符串使用toString的时候页面中的数据还没有加载 。错误代码：
可以使用 v-if 修改为：
手机号脱敏
<text v-if"ownerPhone">{{ownerPhone.toString().replace(/^(1[3-9][0-9])\d{4}(\d{4}…
wo-gradient-card是一款采用uniapp实现的透明辉光动画卡片
采用uniapp-vue3实现，透明辉光动画卡片，卡片内容包含标签、标题、副标题、图片 支持H5、微信小程序（其他小程序未测试过，可自行尝试） 可用于参考学习 可到插件市场下载尝试： https://ext.dcloud.net.cn/plu…
uni-app 经验分享，从入门到离职（四）——页面栈以及页面跳转的 API（开发经验总结）
文章目录 📋前言⏬关于专栏 🎯什么是页面栈🧩页面跳转方法📌 uni.navigateTo(OBJECT)📌 uni.redirectTo(OBJECT)📌 uni.reLaunch(OBJECT)📌 uni.switchTab(OBJECT)📌 uni.navigateBa…
【项目实践-04】实验室移动端：对象添加新属性+webview IOS端appendJsFile()方法不生效
一、vue2对象添加新属性 在做实验室移动端时有这样一个需求，即获取下级页面的数据 (toChooseDevice())，为当前页面中的form表单数据添加新的属性和值，然后表单完成后进行提交(submitForm())操作
toChooseDevice(str) {uni.navigateTo({url: …
uni-app 开发调试自动打开手机屏幕大小界面（Aidex移动端开发项目）
上效果： 下载Aidex的移动端项目并打开：
若依-ruoyi-AiDex-Uniapp: 若依-Ruoyi APP 移动解决方案，基于uniappuView封装的一套基础模版，开箱即用，免费开源，一份代码多终端适配，支持H5、支付宝小程…
微信小程序uniapp校园在线报修系统维修系统java+python+nodejs+php
管理员的主要功能有： 1.管理员输入账户登陆后台 2.个人中心：管理员修改密码和账户信息 3.用户管理：对注册的用户信息进行删除，查询，添加，修改 4.维修工管理：对维修工信息进行添加，修…
微信小程序uniapp校园租房指南房屋租赁系统java+python+nodejs+php
语言：javapythonnodejsphp均支持 框架支持:Ssm/django/flask/thinkphp/springboot/express均支持 运行软件:idea/eclipse/vscode/pycharm/wamp均支持 数据库 mysql 数据库工具：Navicat等 前端开发:vue 小程序端运行软件 微信开发者工具/hbuiderx uni-…
uni-app搭建h5项目
一、 打开官方网站 https://uniapp.dcloud.net.cn/quickstart-cli.html 二、找到使用vue-cli命令行，按照文档上的步骤进行搭建
全局安装 vue-cli
npm install -g vue/cli搭建项目 可以根据命令行搭建，搭建vue2.0对应的是webpack， 也可以搭…
uniapp 如何嵌套H5 页面？
如何在 uniapp项目中 嵌套h5页面
在UniApp中可以通过使用 web-view 组件来嵌入H5页面。
首先需要安装uni-app的依赖包，然后创建一个新的页面（比如名为"WebPage.vue"）作为容器页面，并将其放置于pages目录下。
接下来&…
uniapp如何实现关闭前面指定数目页面
需求 ：
路由从 页面A -> 页面B-> 页面C-> 页面D 我希望在 页面C跳到页面CD 后 在页面D 中 点击返回（物理键或是代码返回），直接返回到A,而不是页面C 所以我需要把BC页面给销毁掉 以下是我的实现思路，在h…
Uniapp（uni-app）学习与快速上手教程
Uniapp（uni-app）学习与快速上手教程 1. 简介
Uniapp是一个跨平台的前端框架，允许您使用Vue.js语法开发小程序、H5、安卓和iOS应用。下面是快速上手的步骤。
2. 创建项目
2.1 可视化界面创建 1、打开 HBuilderX，这是一款专为uni…
uni-app中的项目目录结构的解析
文章目录 概要一.项目目录结构1.main.js2.App.vue-- 作用-- 定义全局数据-- 拿到当前页面路由 3.uni.scss-- 写在里面的内容-- uni.scss案例-- 全局样式和局部样式 4.page.json5.manifest.json 小结 概要
本文主要介绍uni-app中的项目目录结构的解析
一.项目目录结构
1.main…
uniapp开发微信小程序跳转到另一个小程序中
注意：一开始我的云上务工模块是单独的tabbar界面，但是小程序跳转好像不能直接点击tabbar进行，所以我将这里改成了点击首页中的按钮进行跳转 点击这里进行小程序跳转 目录 基础讲解
uniapp小程序跳转的两个方法
调用说明（半屏跳转…
动态绑定样式，uniapp，用三元运算动态绑定多个class类样式，动态绑定的样式可以和原始样式共存
介绍 | uni-app官网
vue、uniapp中动态添加绑定style、class 9种方法实现_vue style动态绑定-CSDN博客
uniapp使用三元运算符动态绑定元素的style样式_uniapp style动态绑定-CSDN博客 对象写法,可以写多个class类
class类的名字：判断条件，最后结果只有…
uniapp腾讯地图JavaScript Api，H5端和原生APP端可用
因项目需要，在uniapp中集成使用腾讯地图，为了方便维护，希望通过一套代码实现H5和APP同时可用。H5显示相对简单，APP端比较麻烦，记录下实现过程
一、集成步骤
1.使用 renderjs
script标签使用renderjs，因为…
uniapp 使用 z-paging组件
使用 z-paging
导入插件
获取插件进行导入 自定义上拉加载样式和下拉加载样式
页面结构 例子
搭建页面
<template><view class"content"><z-paging ref"paging" v-model"dataList" query"queryList"><templ…
uni-app 人脸识别 App端
文章目录 背景介绍开发前准备基础版获取视频流人脸识别版本这时候就可以开心的调试了背景介绍
本文介绍如何制作人脸打卡等类似功能的实现。 使用nvue+live-pusher来实现。在App端这是成本较低的可以控制样式的方案了 实现了两个版本 基础版本：视频流 => 抓拍照片 => 传…
低于API等级30的应用将无法在上述应用商店
minSdkVersion
minSdkVersion用于指定应用兼容的最低Android版本（API等级）。 如果APP某些功能无法支持低版本Android系统的设备，可以配置minSdkVersion确保APP只能安装到指定Android版本以上的设备。HBuilder|HBuilderX中可在manifest.json中…
【uni-app】初始化相关配置
（1）工程目录结构
┌─components uni-app组件目录
│ └─comp-a.vue 可复用的a组件
├─hybrid 存放本地网页的目录（自建）
├─platforms 存放各平台专用页面的目录（…
如何在uniapp中实现二维码生成功能
官方文档：https://uqrcode.cn/doc。 github地址：https://github.com/Sansnn/uQRCode。 npm地址：https://www.npmjs.com/package/uqrcodejs。 uni-app插件市场地址：https://ext.dcloud.net.cn/plugin?id1287 <canvas canvas-id…
【uni-app】生命周期
页面运行过程中，各个阶段的回调函数就是“生命周期钩子函数”。
uni-app 完整支持 Vue 实例的生命周期，同时还新增 应用生命周期 及 页面生命周期。
（1）应用生命周期
函数名说明onLaunch当uni-app 初始化完成时触发（…
微信小程序的医院体检预约管理系统springboot+uniapp+python
本系统设计的目的是建立一个简化信息管理工作、便于操作的体检导引平台。共有以下四个模块： uni-app框架：使用Vue.js开发跨平台应用的前端框架，编写一套代码，可编译到Android、小程序等平台。
语言：pythonjavanode.js…
uniapp 使用安卓模拟器运行调试
uniapp 启动方式有很多种,这里介绍使用模拟器启动uniapp
要使用模拟器启动uniapp肯定少不了安装模拟器(废话) 这里选着浏览器推荐的第一个模拟器mumu模拟器
下载好了mumu安装包后就是安装了,这个过于小白,就不介绍了 2. 查看模拟器的adb端口号, mumu的adb查看端口号与众不同…
【uniapp】onPullDownRefresh下拉刷新 ， onReachBottom加载分页，uni.stopPullDownRefresh
【uniapp】onPullDownRefresh下拉刷新 ， onReachBottom加载分页
uniapp文档 onPullDownRefresh onReachBottom
// 下拉刷新
onPullDownRefresh() {this.page 1;this.list [];this.getlist();setTimeout(function () {uni.stopPullDownRefresh();}, 1000);
},
//…
uniapp的微信小程序授权头像昵称（最新版）
前面我出过两期博客关于小程序授权登录,利用php实现一个简单的小程序授权登录并存储授权用户信息到数据库的完整流程。无奈，小程序官方又整幺蛾子了。wx.getUserInfo接口收回，wx.getUserProfile接口也不让用。导致我的个人小程序：梦缘 的授权…
uniapp android 原生插件开发-测试流程
前言 最近公司要求研究一下 uniapp 的 android 原生插件的开发，为以后的工作做准备。这篇文章记录一下自己的学习过程，也帮助一下有同样需求的同学们 : ) 一、下载安装Hbuilder X , Android studio（相关的安装配置过程网上有很多，…
微信小程序uniapp+vue校园任务跑腿接单平台java+python+nodejs+php
对于校园跑腿系统功能所牵扯的数据都是通过用户进行校园跑腿系统等相关的数据信息内容、并且可以进行管理员服务端；首页、个人中心、学生管理、跑腿者管理、系统公告管理、在线下单管理、已完成订单管理、订单评价管理、已接订单管理、系统管理，跑腿者客…
uni-app 页面跳转动画
API的方式
uni.navigateTo({url: ../test/test,animationType: pop-in,animationDuration: 200
});
uni.navigateBack({delta: 1,animationType: pop-out,animationDuration: 200
});pages.json中配置的方式
"style": {"app-plus": {"animationType…
java接口+vue后台管理+uniapp前端 移动端商城
花了半个月时间用的
nuoyi的Java系统,https://www.ruoyi.vip前后端分离版开发的商城
UI和前端用的别的大神模板套用https://ext.dcloud.net.cn/plugin?id1531
正常下单流程，没有开发支付功能。后面开发了再上传
演示地址http://mall.meanwellsps.com
下载地址…
canvas签名页面跟着滑动bug
记录一个花了两天时间才解决的bug，过程非常难受，需求是一个阅读合同的小程序界面，在阅读完成后弹出遮罩层进行签名 问题：在弹出层签名的时候遮罩层下面的合同也在跟着滑动，安卓端没有这个问题，真机调试的io…
vue3+uniapp在微信小程序实现一个2048小游戏
一、效果展示 二、代码
<template><view class"page"><view class"top"><view class"score">得分:{{total}}</view><view class"time">用时:{{allTime}}s</view></view><view cl…
uniapp 项目 浏览器chrome使用vue devtool 识别不了 in not detect
问题
uniapp的项目，vue2， chrome 分析 添加了运行时，指定模板h5.html 指定的h5.html重置了运行根目录，导致了vue dev tool在运行时，chrome上识别不了。 解决：
方法1： 只能调试的时候,不加sati…
uni-app 系统状态栏高度CSS变量--status-bar-height
var(--status-bar-height) 此变量在微信小程序环境为固定 25px，在 App 里为手机实际状态栏高度。当设置 "navigationStyle":"custom" 取消原生导航栏后，由于窗体为沉浸式，占据了状态栏位置。此时可以使用一个高度为 var(…
uniapp iOS 真机调试
一、下载爱思助手
二、打开爱思助手，把你的 苹果手机 用原装数据线连接至电脑： 找到 工具箱 > 搜索IPA > 打开IAP签名
三、添加 IPA 文件
mac：finder 》应用程序 》右键 HbuilderX 》显示包内容 》HbuilderX / plugins/ lau…
uniapp+vue基于Android的图书馆借阅系统qb4y3-nodejs-php-pyton
uni-app框架：使用Vue.js开发跨平台应用的前端框架，编写一套代码，可编译到Android、小程序等平台。 框架支持:springboot/django/php/Ssm/flask/express均支持 前端开发:vue 语言：pythonjavanode.jsphp均支持 运行软件:idea/eclip…
uniapp使用华为云OBS进行上传
功能需求背景：在采煤过程中，井下作业没有网络，进而使用局域网，无法将文件上传到数据库，所以采用，uniapp 写了一个app 来处理上传的功能
1、有需要由后端人员创建obs 桶， 对象存储服务ÿ…
基于uniapp大学生社团活动管理系统python+java+node.js+php微信小程序
uni-app框架：使用Vue.js开发跨平台应用的前端框架，编写一套代码，可编译到Android、小程序等平台。
语言：pythonjavanode.jsphp均支持 框架支持:springboot/Ssm/thinkphp/django/flask/express均支持 运行软件:idea/eclipse/vscod…
uniapp小程序uView自定义tabbar
两年没接触小程序，又重新拾请来 前言
工具：HBuilder X 3.99版本 微信开发者工具 1.06 语言：vue2 uView
一、创建项目 先使用HBuilder X工具创建一个空白uni-app项目 uviewTest 二、安装和配置 HBuilder X找到工具-》插件安装-》插件市场 u…
uni-app 移动端本地储存数据库sqlite
解析
1.移动端使用setStorage存储数据一般是2M或5M，存储到本地的数据无2.限制，必须使用移动端SQLite数据库。
SQLite模块用于操作本地数据库文件，可实现数据库文件的创建，执行SQL语句等功能。方法
openDatabase: 打开数据库
isO…
关于uniapp小程序的分包问题
开发uniapp小程序时，在打包上传代码时会出现超出2M的打包限制不能上传，那么我们该怎么做呢？
1.对于图片，将图片从后端服务取，尽量不要放在静态资源，图片体积会影响打包大小。
2.使用分包，tabb…
uniapp中获取位置信息处理
在微信小程序中，获取定位，是需要用户授权的，那么当用户拒绝授权后，需要重新获取定位时，是不会再调起授权界面，这时需要用户主动打开设置界面，才可以重新开启授权权限；
那么…
uniapp+node.js前后端做帖子模块：获取帖子列表（社区管理平台的小程序）
目录 0前提1.一些准备1.1表帖子表 post帖子评论表 postComment帖子点赞表 postLike 1.2总体思路 2.前端3.后端 👍 点赞，你的认可是我创作的动力！
⭐️ 收藏，你的青睐是我努力的方向！
✏️ 评论，你的意见是…
UniApp微信小程序解决苹果手机上方刘海屏遮挡的方法
大家好，我是你们的好朋友咕噜铁蛋！今天我要和大家分享一种解决苹果手机上方刘海屏遮挡的方法，特别适用于UniApp开发的微信小程序。如果你在开发过程中遇到了这个问题，不妨跟着我一起来看看如何解决吧！ 苹果手机的刘海屏…
Uniapp在IOS系统打包测试流程
大家好我是咕噜美乐蒂，很高兴又和大家见面了！UniApp 是一种基于 Vue.js 的跨平台应用开发框架，可以用于快速构建同时支持多个平台（包括iOS、Android、Web 等）的应用程序。在 iOS 系统上打包和测试 UniApp 应用的流程可…
uniapp编译支付宝小程序
[Vue warn]: Property or method “toJSON” is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property. See: https://vuejs.org/…
uni-app vue3 setup nvue中webview层级覆盖问题
核心就是这两行，🤣发现设置后不能点击了，这个玩意可能只能弹窗打开的时候动态的修改
position: static,
zindex: 0onLoad(options > {loadWebview()})function loadWebview() {let pageInfo uni.getSystemInfoSync();width.value pageI…
uniapp 部署h5，pdf预览
1.hubuilderx 打包h5。 2.上传部署包到服务器。 解压部署包：unzip h5.zip 。
3.nginx配置。
user root;
worker_processes 1;
#worker_cpu_affinity 0001 0010 0100 1000;
#error_log logs/error.log;
#error_log logs/error.log notice;
error_log /var/l…
uniapp微信小程序开发踩坑日记：修改组件默认样式
使用uniapp官方组件的时候，我们常常要修改组件的默认样式，但是网上的很多修改组件默认样式的方法都是不生效的（因为我都试过了）
下面给大家介绍vue构建的uniapp小程序中能够生效的修改组件默认样式的方法
1、在编译后的代码文件…
uni-app去除页面头部的标题栏
uniapp项目 每个界面都会有一个标题栏 配置在我们项目根目录的 pages.json中 我们将它全部去掉 上面还是有一条黑的 体验非常差 我们只需要在pages.json中 指定page的 style中加入
"navigationStyle": "custom"对应的page 就没有这个标题栏了
【工作实践-06】uniapp使用webView
一、建立APP页面和webview的通讯 1.引入webview.js App 端使用 uni.web-view.js 的最低版为 uni.webview.1.5.4.js APP端可以支持网络网页和本地网页，但如果使用本地网页和相关资源（js、css等文件）必须放在 static 目录下。 2.引入搭桥docum…
【HbuilderX】 uniapp实现 android申请权限 和 退出app返回桌面
目录 android申请权限：
监听用户是否开启权限或关闭权限：
退出app返回桌面： android申请权限：
首先在 manifest.json 内添加你所需要用到权限 添加权限插件
permission.js 一次就好1/权限插件 - Gitee.comhttps://gitee.co…
uni-app引用外部js文件
全局引用
在App.vue文件中添加如下代码
这样在全局所有页面中都可以直接使用该外部js中的函数
onLaunch: function() {var script document.createElement(script);script.src "https://www.test.com/api/testapi.js";document.body.appendChild(script);
},
单…
uniapp 获取页面来源
获取当前页面栈的实例，以数组形式按栈的顺序给出，数组中的元素为页面实例，第一个元素为首页，最后一个元素为当前页面。 let pages getCurrentPages();
if (pages.length > 1) { // 若页面栈长度大于1则表示不止一个页面被打开…
uniapp 安装安卓、IOS模拟器并调试
一、安装Android模拟器并调试
1.下载并安装Android Studio。
2.创建简单project。 3.安装模拟器。 完成安卓模拟器的安装。
4.启动模拟器。 5.hbuilderx选择模拟器、运行。 点击刷新按钮后出现模拟器，勾选并运行。 6.调试。
在 HBuilderX 中，项目启…
微信小程序的航空售票飞机订票系统uniapp+python+java+node.js+php
1、关于微信小程序的飞机订票系统的基本要求 （1）管理员：可以管理管理整个系统比如对个人密码、用户名进行修改、对用户可以进行增删改查管理、对航班机票进行新增修改删除等、查看用户票务订票以及支付、系统管理包括平台公告发布、在线咨询回…
uni-app使用uView库的格式化时间API
注意：1.7.9之前的版本只能传入秒或毫秒时间戳，date和timeFormat为同功能不同名函数，无论用哪个方法名，都是一样的。
该函数必须传入第一个参数，第二个参数是可选的，函数返回一个格式化好的时间。
time &l…
uni-app下载文件、获取文件夹下的文件、删除文件夹里的文件
下载文件
var url "文件地址";
this.downFileName "aa.pdf";
let dtask plus.downloader.createDownload(url, {filename: "_downloads/" this.downFileName //利用保存路径，实现下载文件的重命名
}, (d, status) > {//d为下…
uniapp+node.js前后端做帖子模块：帖子的点赞/取消点赞（社区管理平台的小程序）
目录 0前提1.一些准备1.1表帖子表 post帖子点赞表 postLike 1.2总体思路 2.点赞前端3.后端 👍 点赞，你的认可是我创作的动力！
⭐️ 收藏，你的青睐是我努力的方向！
✏️ 评论，你的意见是我进步的财富&…
uniapp实现多行文本溢出超过指定行数 展开 收起
一、组件封装
<template><view class"multiline"><view class"info"><view :class"{hide:!iSinfo}" :style"!iSinfo?computedStyle:"><view :style"{ color: textColor,fontWeight:fontWeight,font…
uniapp APP隐藏状态栏，虚拟键
onShow() {// #ifdef APP-PLUS// 隐藏顶部电池,时间等信息 plus.navigator.setFullscreen(true);//隐藏虚拟按键plus.navigator.hideSystemNavigation()// #endif
},如上代码配置（在一个页面设置这个段代码，所有页面都会消失） 这段代码是使用…
uniApp 调整小程序 单个/全部界面横屏展示效果
我们打开uni项目 小程序端运行
默认是竖着的一个效果 我们打开项目的 pages.json 给需要横屏的界面 的 style 属性 加上
"mp-weixin": {"pageOrientation": "landscape"
}界面就横屏了 如果是要所有界面都横屏的话 就直接在pages.json 的 gl…
微服务 人工智能AI 物联网智慧工地云平台源码
目录
编辑
智慧工地架构
智慧工地系统
智慧工地云平台功能模块
1、基础数据管理
2、考勤管理
3、安全隐患管理
4、视频监控
5、塔吊监控
6、升降机监控
7、移动端数据推送
智慧工地管理平台子系统构成 智慧工地物联网解决方案，对工地施工安全人员、设…
uniapp聊天记录本地存储(详细易懂)
目录
目录
1、通过websocket拿取数据
2、获取聊天数据
3、聊天信息存储 、更新
4、读取聊天记录
5、发送信息，信息获取
6、最终效果
1.聊天信息的存储格式 2、样式效果 写聊天项目，使用到了本地存储。需要把聊天信息保存在本地，实时获…
【uniapp】小程序自定义一个通用的返回按钮组件
左边箭头，右边文字可以自定义，但是不要太长，太长可以自己改 .back的width值，改宽一点。 用这个组件的时候首先要在pages.json里把导航栏变成自定义的： ,{"path" : "pages/test/test","style&…
uniApp跨页面通讯$on、$emit、$once、$off使用场景及技巧
大部分场景实际上利用$once、$emit、$off配合使用即可，直接上代码 在页面B中，离开时必须要销毁$once(xxx),因为在B页面，点击拍照才会触发$emit(xxx),如果通过滑动或点击头部返回页面A,$once(xxx)将会和下一次$emit(xxx)调用时，一起…
uniapp和vue项目配置多语言，实现前端切换语言
在uniapp中配置多语言功能，实现前端切换语言，可以按照以下步骤进行：
1. 创建语言包
首先，创建一个名为 lang 的目录，并在该目录下为每种支持的语言创建对应的JSON或JS文件。例如：
lang/en.js（…
uniapp自定义底部导航
我这边使用的是uview组件库，进行开发的！
<template><view class"footer-bar"><u-tabbar :value"select ? select : 0" change"changeTab" :border"true" :fixed"true" :placeholde…
uniapp微信支付流程
在uniapp中使用微信支付的流程大致如下： 在微信公众平台申请开通微信支付，并获取到支付相关的配置信息，如appid、mch_id、key等。 在uniapp的项目中安装 uni-app 的支付插件，如 uni-pay 插件，该插件封装了微信支付的相…
【教程】uni-app iOS打包解决profile文件与私钥证书不匹配问题
摘要
当在uni-app中进行iOS打包时，有时会遇到profile文件与私钥证书不匹配的问题。本文将介绍如何解决这一问题，以及相关的技术细节和操作步骤。
引言
在uni-app开发过程中，iOS打包是一个常见的操作。然而，有时会出现profile文…
vue+uniapp实现图形验证码功能-插件（附源码）
一、需求背景 vueuniapp实现图形验证码功能-插件（附源码） 在登录系统时，除了密码登录，还需要提供验证码登录。 涉及验证码，为了安全，一般会加入图形验证码，然后再发短信验证码。 如图࿱…
在UniApp中引入大于40kb字体包的记录
因为项目UI需要特殊字体，所以给了一个80kb字体包，但是在正常的使用导入时候发现不生效
这是我的导入过程
1.把下载好的文件放入static/font目录中 2.在app.vue中引用 font-face {
font-family: zitiming;
src: url(/static/font/YouSheBiaoTiHei-2.t…
uniapp小程序获取位置权限（不允许拒绝）
需求
小程序上如果需要一些定位功能，那么我们需要提前获取定位权限。我们页面的所有功能后续都需要在用户同意的前提下进行，所以一旦用户点了拒绝，我们应该给予提示，并让用于修改为允许。
实现
1.打开手机GPS
经过测试发现即使…
HBuilderX创建uniapp项目使用 tailwindcss
文章目录 一、创建package.json文件二、打开终端 yarn / npm 安装依赖三、创建 vue.config.js文件四、创建postcss.config.js文件五、创建tailwind.config.js文件六、App.vue文件的style中引入tailwindcss 一、创建package.json文件
{"devDependencies": {"aut…
uniapp封装统一请求(get和post)
uniapp封装请求 request.js文件 import Vue from vue
// 全局配置
import settings from ./settings.js
function computedBaseUrl(url) {// console.log(url);return (url.indexOf(http) -1 ? settings.baseUrl : ) url
}// 发送请求
export default (options) > {const…
移动端开发之uni-app开发规范说明
移动端开发之uni-app开发规范说明 文章目录 移动端开发之uni-app开发规范说明1. 工程结构2. 注释(必须)1. vue头文件注释2. 代码注释 1. 工程结构
一个uni-app工程，默认包含如下目录及文件：
┌─uniCloud 云空间目录，阿里云为…
uniapp上拉加载、下拉刷新
我这个是自定义header、main、和footer的布局，是盒子中的上拉加载、下拉刷新，不是页面的，废话不说，直接上代码！
<template><view class"assembly"><u-navbar title"个人中心" lef…
uniapp 手写 简易 时间轴 组件
一、案例如图 该案例设计条件： 左侧时间 和竖线、点、内容都是居中对其的，上下时间点中间要有一段距离 二、编写逻辑 1. 布局结构：一共三个元素，左侧是时间和黑点，中间是线条，右侧是内容 2. 样式难点&#…
uniapp实现单选框卡片选择器,支持微信小程序、H5等多端
采用uniapp-vue3实现的一款单选框卡片选择器，纯CSS实现样式和交互，提供丝滑的动画选中效果，支持不同主题配置，适配多端 可到插件市场下载尝试： https://ext.dcloud.net.cn/plugin?id16901
使用示例 示例代码
<te…
uniapp模仿下拉框实现文字联想功能 - uniapp输入联想（官方样式-附源码）
一、效果
废话不多说，上效果图：
在下方的： 在上方的：
二、源码
一般是个输入框，输入关键词，下拉一个搜索列表。 ElementUI有提供<el-autocomplete>，但uniapp官网没提供这么细&#x…
移动端uni-app小程序搜索高亮前端处理，同时可设置相关样式，兼顾性能
在uni-app中我们会遇到搜索高亮显示的需求
如下图： 起初用的是富文本实现
使用replaceAll方法取代搜索字段为一个 标签并设置相应的样式，但是小程序的并没有把 标签渲染出来，所以放弃了，下面原代码： /* 搜索字体变色…
环信 Vue2 uniapp Demo重构焕新！经典再升级！
重构目标
本次重构中原始 Demo 代码逻辑完全重写，原有目录结构以及消息相关组件进行重新调整，在 SDK 的调用方式以及实现逻辑上也进行升级调整。此次重构中会话列表、消息列表等数据不再进行本地存储，而是远端进行拉取，更换设备也…
uni-app头像编辑上传
实现比较简单，文档中都有描述，就是第一次做可能会有疏漏，记录一下：
<view class"edict-item" click"selectPic"><text class"item-name" :style"$em.$getThemeStyle([avatarConText…
web前端之uniApp实现选择时间功能
MENU 1、孙子组件1.1、html部分1.2、JavaScript部分1.3、css部分 2、子组件2.1、html部分2.2、JavaScript部分2.3、css部分 3、父组件3.1、html部分3.2、JavaScript部分 4、效果图 1、孙子组件
1.1、html部分
<template><view><checkbox-group change"ch…
商城|商城小程序|基于微信小程序的智慧商城系统设计与实现(源码+数据库+文档)
商城小程序目录
目录 基于微信小程序的智慧商城系统设计与实现
一、前言
二、系统设计
三、系统功能设计
1、用户信息管理
2、 商品信息管理
3、公告信息管理
4、论坛信息管理
四、数据库设计
1、实体ER图 五、核心代码
六、论文参考
七、最新计算机毕设选题推荐 …
uniapp地图围栏代码
UniApp 是一个使用 Vue.js 开发所有前端应用的框架，可以编译到 iOS、Android、H5、以及各种小程序等多个平台。在 UniApp 中实现地图围栏功能，通常需要使用地图服务API。对于大多数地图服务来说，实现围栏功能通常需要以下几个步骤：…
uniapp路由跳转的方式
1. uniapp路由跳转的方式
1.1. uni.navigateTo保留当前页面，跳转到应用内的某个页面，使用uni.navigateBack可以返回到原页面。
uni.navigateTo({url:./index/index
});注意： （1）页面跳转路径有层级限制，不…
uniapp直接连接wifi(含有ios和安卓的注意事项)
前言 小程序中直接连接wifi-----微信小程序 代码
启动 //启动wifistartWifi() {return new Promise((resolve, reject) > {uni.startWifi({success: (res) > {console.log(启动wifi 成功, res)resolve(true)},fail: (err) > {console.error(启动wifi 失败, err)uni.s…
uniapp 解决请求出现 /sockjs-node/info?t=问题
1. uniapp请求出现 /sockjs-node/info?t问题
1.1. 问题 uniapp项目老是出现 http://192.168.2.106:8080/sockjs-node/info?t1709704280949
1.1. sockjs-node介绍 sockjs-node 是一个JavaScript库，提供跨浏览器JavaScript的API，创建了一个低延迟、全…
学生信息管理展示-h5版（uniapp+springboot+vue）
记录一下做的第一个完整的h5业务。
一、登录 二、个人中心 三、首页（管理员） 四、首页（学生） 五、视频展示 学生信息管理展示（h5）完整版
uniapp+vue3+vites使用lime-echart问题记录
问题记录 1.vue3使用echarts,H5和微信小程序兼容问题 1.vue3使用echarts,H5和微信小程序兼容问题
问题描述，正常使用echarts，H5正常，小程序报错 报错信息如下 解决方案： 注意要点一：vue3需要使用esm文件 地址&#x…
【uni-app小程序开发】实现一个背景色渐变的滑动条slider
最近做的一个用uni-app+vue2开发的微信小程序项目中要实现一个滑动进度控制条，如下图所示： 1. 滑动条需要渐变背景色
2. 滑块的背景色需要与当前位置滑动条的背景色一致（动态改变）
碰到这样的需求，我当然先是看看官方提供的slider组件和uView里的u-slider组件能不能满足…
uniapp图片涂鸦插件(支持多种涂鸦方式，图片放大缩小)
工程地址https://gitee.com/geshijia/ct-graffiti
ct-graffiti涂鸦组件使用说明
参考说明
参考链接：https://github.com/ylyuanlu/yl-graffiti 感谢作者的付出，给我提供了一些思路，并做了如下优化：
增加图片放大缩小移动功能添…
IM聊天交友APP源码IM带音视频Uniapp即时通讯安卓苹果APP修改二开
前端开发语言：VUE（ 安卓，IOS,WEB为一套前端代码）
服务器端开发语言: PHPWebSocket
数据库：MySql mongodb
前端打包工具：Hbuilder
服务器搭建工具：宝塔 Xshell
短信接口： 支持…
![[uni-app ] createAnimation锚点旋转 及 二次失效问题处理](https://img-blog.csdnimg.cn/direct/1c3fe5461b1e4d7aabcf08b465e20931.png)
[uni-app ] createAnimation锚点旋转 及 二次失效问题处理
记录一下: 锚点定位到左下角, 旋转动画 必须沿Z轴,转动 但是,此时会出现 后续动画在微信小程序失效问题
解决: 清空 this.animationData
基于uniapp cli项目开发的老项目，运行报错path.replace is not a function
项目：基于uniapp cli的微信小程序老项目
问题：git拉取代码，npm安装包时就报错； cnpm能安装成功包，运行报错 三种方法尝试解决：
更改代码，typeof pathstring的话，才走path.replace…
uniapp聊天页面之消息滚动
目录 1、HTML部分
2、 Js部分
3、注意，滚动方法调用 1、HTML部分
用整个scroll-view的高度减去所有聊天内容的高度，得到的就是滚动条需要下拉的距离，即可使聊天页下拉至最底部。
需要给 scroll-view一个固定的高度，并获取消息…
uniapp使用openlayers加载地图服务
uniapp使用openlayers加载地图服务 <!-- 地图组件 -->
<template><view id"myMap" :regionChangeItem"regionChangeItem" :change:regionChangeItem"olRender.selectAdministrativeRegion":tagSelectProducetagSelectProduce :ta…
uniapp调用原生android插件传递回调函数
在混合开发中，uniapp调用android原生的方法，原生方法在处理过程中无法同步给js返回数据，异步执行，那么可以使用传递uniapp回调函数实现
一、编写android的方法
public class MyLibraryPlugin extends UniModule {private UniJS…
uniapp——nextTick（vue3）数据更新完之后加载
说明
将回调推迟到下一个 DOM 更新周期之后执行。在更改了一些数据以等待 DOM 更新后立即使用它。
代码
<view class"tabBox"><scroll-view scroll-x"true" :scroll-with-animation"true"><view class"box"><…
uniapp微信小程序 提示消息 上传文件
uni.showToast() 提示消息
uni.showToast({icon: success,title: 操作成功
})
icon：可填 success: 显示成功图标， error: 显示错误图标； fail: 显示错误图标，此时title文本无长度显示； exception: 显示异常图标&…
uniapp封装文字提示气泡框toolTip组件
uniapp封装文字提示气泡框toolTip组件 文字提示气泡框：toolTip 因为uniapp 中小程序中没有window对象，需手动调用 关闭 第一种办法关闭：this.$refs.tooltip.close() 第二种办法关闭：visible.sync false 移动端没有现成的toolTip组…
uniapp实现---类似购物车全选
目录
一、实现思路
二、实现步骤 ①view部分展示 ②JavaScript 内容 ③css中样式展示
三、效果展示
四、小结 注意事项 一、实现思路 点击商家复选框，可选中当前商家下的所有商品。点击全选，选中全部商家的商品
添加单个多选框，在将多选…
uniapp+node.js前后端做帖子模块：发布帖子评论（社区管理平台的小程序）
目录 0前提1.一些准备1.1表帖子表 post帖子评论表 postComment 1.2总体思路 2.前端3.后端4.验证结果 👍 点赞，你的认可是我创作的动力！
⭐️ 收藏，你的青睐是我努力的方向！
✏️ 评论，你的意见是我进步的…
2024最新版正规视频影视系统源码/APP+H5视频影视源码
全新魅思V20正规视频影视系统源码，APPH5视频影视源码。会员花费三千购入的，具体搭建教程放压缩包了！
有兴趣的下载自行研究吧，搭建一共要用到3个域名，可以拿二级域名搭建。
【uniapp】uniapp小程序中实现拍照同时打开闪光灯的功能，拍照闪光灯实现
一、需求前提
特殊场景中，需要拍照的同时打开闪光灯，（例如黑暗场景下的设备维护巡检功能）。
起初我是用的uviewui中的u-upload组件自带的拍照功能，但是这个不支持拍照时打开闪光灯，也不支持从通知栏中打开…
UNIAPP微信小程序中使用Base64编解码原理分析和算法实现
为何要加上UNIAPP及微信小程序，可能是想让检索的翻围更广把。😇 Base64的JS原生编解码在uni的JS引擎中并不能直接使用，因此需要手写一个原生的Base64编解码器。正好项目中遇到此问题，需要通过URLLink进行小程序跳转并携带Base64参…
uniapp踩坑之项目：uni.previewImage简易版预览单图片
主要使用uni.previewImage //html
<view class"box-card" v-for"(item,index) in DataList" :key"index"><view>图片：</view><image :src"item.Path" tap.stop"clickImg(item.Path)">&l…
Uniapp 和Vue3 小程序 获取页面dom 方法
最近在写公司的小程序项目 技术框架 主要是Uniapp 和 Vue3
恰好有个需求是要 获取小程序页面dom 结构 用常见的vue3获取dom 结构不起效
记录一下
先给出正确答案
<template><view><view><view>Html</view><view id"target">…
uni-app navigateTo路由传参传递对象
传递参数
先通过JSON.stringify将对象转成字符串
toNextPage(obj) {uni.navigateTo({url:/pages/nextpage/index?obj${JSON.stringify(obj)}});
},接收参数
再通过JSON.parse将传递过来的字符串转成对象
onLoad(options) {this.obj JSON.parse(options.obj)
}
实战｜环信 Vue2 uniapp Demo重构焕新！经典再升级！
项目背景
当前环信 uni-app vue2 Demo 地址升级版本 Github 地址（临时）
原版本功能实现方式较混乱，代码逻辑晦涩难懂，不利于开发者参考或复用。此实战项目在确保原项目功能保留的情况下进行完全重写并新增大量功能，以…
uniapp+node.js前后端做帖子模块：查看帖子（获取帖子详情以及对应的帖子评论列表）（社区管理平台的小程序）
目录 0前提1.一些准备1.1表帖子表 post帖子评论表 postComment 1.2总体思路 2.前端3.后端 👍 点赞，你的认可是我创作的动力！
⭐️ 收藏，你的青睐是我努力的方向！
✏️ 评论，你的意见是我进步的财富&#…
.net6Api后台+uniapp导出Excel
之前的这个是vue3写法，后端是.net6Api.net6Api后台+VUE3前端实现上传和下载文件全过程_vue3 下载文件-CSDN博客
在现在看来似乎搞的复杂了，本次记录一下.net6Api后台+uniapp导出Excel。
后端和之前的不一样，前端也和之前的不一样，只是功能看起来是一样的，实现的方法截然…
uniapp发行H5获取当前页面query
阅读uni的文档大致可得通过 onLoad与 onShow()的形参都能获取页面传递的参数，例如在开发时鼠标移动到方法上可以看到此方法的简短介绍 实际这里说的是打开当前页面的参数，在小程序端的时候测试并无问题，但是发行到H5时首页加载会造成参数获取…
uniapp自定义全局弹窗，保姆级教程
一、创建页面，并配置pages.json文件（仅app端可以看见上一个页面内容）
{"path" : "pages/blogPopup/blogPopup","style" : {"navigationBarTitleText" : "","enablePullDownRefresh" : false,"navigation…
yudao-mall-uniapp电商商城App平台：基于 Vue + Uniapp 的全功能开源电商平台实现（更新版）
yudao-mall-uniapp电商商城App平台：基于 Vue Uniapp 的全功能开源电商平台实现
摘要： 本文主要介绍了yudao-mall-uniapp电商商城App平台，一个基于 Vue 和 Uniapp 技术的全功能开源电商平台。文章首先概述了yudao-mall-uniapp电商商城App平台…
婚恋源码-婚恋交友系统-源码婚恋交友系统-APP小程序H5公众号-源码交付-支持二开！
本婚恋系统是一款专门为单身人士打造的相亲交友软件，所有用户都必须要身份认证，还有职业认证、学历认证等等全方位认证。智能匹配是本婚恋系统的核心功能，当我们完善好个人资料通过审核，系统会根据个人信息进行匹配，自…
uni-app开发特点和开发流程
uni-app是一个基于Vue.js框架的跨平台应用开发框架，通过一套代码可以同时运行在多个平台上，包括iOS、Android、H5等。它采用了基于流布局的页面渲染机制，可以自动适配不同平台的屏幕尺寸和分辨率。uniapp官网：https://uniapp.dclo…
vue3 uniapp 项目初始化集成配置【开箱即用】
https://gitee.com/charrie/vue3-uniapp-init 技术说明
采用vue3viteuniapp技术栈，setup语法糖编码方式引入unocss量子化样式引擎，动态css不用自己写样式，引用class即可，降低代码体积全局请求入口已封装，使用时自己封…
uniapp 使用定时器和取消定时器
1. uniapp 使用定时器和清除定时器
1.1. 定义一个timer
data(){return{timer: null}
}1.2. 设置定时器
//选择适合需求的定时器
this.timer setTimeout( () > {// 这里添加您的逻辑
}, 1000)
this.timer setInterval( () > {// 同上
}, 1000)1.3. 清除定时器 这…
微信小程序H5设置全局弹窗
微信小程序&H5设置全局弹窗 微信小程序&H5设置全局弹窗效果图1、下载所需库2、创建vue.config.js 文件3、创建全局公告组件头部公告组件弹窗公告组件4、组件注册到全局5、在pages.json文件中配置 insetLoader6、H5需要额外使用render.js7、全局调用(一进入页面就获取弹…
uniapp实现点击标签文本域中显示标签内容
先上一个效果图 实现的效果有：
①.点击标签时，标签改变颜色并处于可删除状态
②.切换标签，文本域中出现标签的内容
③.点击标签右上角的删除可删掉标签，同时清除文本域中标签的内容
④.可输入内容，切换时不影响输入…
vue3-admin后台管理系统： 使用Vue3+Vue-Router4 + Element-Plus打造高效后台管理系统
vue3-admin后台管理系统 ：使用Vue3 Vite Vue-Router Element-Plus Echarts Axios打造高效后台管理系统。 摘要： 本文将深入探讨如何使用Vue3、Vite2、Vue-Router4和Element-Plus等前端技术栈，构建一套高效、稳定的后台管理系统。我们将结…
uniapp内实现链接跳转到浏览器网页上
uniapp内实现链接跳转到浏览器网页上
参数:
url: ( String ) 必选 要打开的URL地址 字符串类型，各平台支持的地址类型存在差异，参考平台URL支持表。
errorCB: ( OpenErrorCallback ) 可选 打开URL地址失败的回调 打开指定URL地址失败时回调࿰…
uniapp 微信小程序和h5处理文件(pdf)下载+保存到本地+预览功能
uniapp实现微信小程序下载资源功能和h5有很大的不同，后台需返回blob文件流
1.微信小程序实现下载资源功能
步骤1：下载文件
uni.downloadFile({url:url,//调接口返回urlsuccess:(res)>{uni.hideLoading();if(res.statusCode200){var tempFilePath …
uniapp相关内容
一、设置uni原生事件类型
示例：获取手机号事件类型为 UniHelper.ButtonOnGetphonenumber
格式为：UniHelper.组件名事件名
const getphonenumber: UniHelper.ButtonOnGetphonenumber (detail) > {console.log(detail)
}
<button class"…
Uni-app跟学笔记（一）：新建项目、运行、tabbar、全局配置
文章目录 1）新建项目2）项目运行3）项目结构4）开发规范5）globalStyle全局外观配置6）pages页面配置7）tabbar8）Condition 本博客为 uni-app 此门课的跟学笔记，目的是便于个人…
uni-app开发介绍
uni-app是一款基于Vue.js的跨平台开发框架，可以一次编写，多端运行，包括iOS、Android、H5、小程序等多个平台。它将前端开发与跨平台开发结合起来，使开发者可以快速构建多端应用。
uni-app具有以下几个特点： 开发便捷&…
uniapp开发的跳转到小程序
uniapp开发的h5跳转到小程序 https://www.cnblogs.com/xiaojianwei/p/16352698.html官方：使用 URL Scheme 打开小程序 https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/url-scheme.html 链接代码
<a href"weixin://dl/business/…
uniapp隐藏状态栏并强制横屏
uniapp隐藏状态栏并强制横屏
1.manifest.json中：
"screenOrientation": ["landscape-primary", //可选，字符串类型，支持横屏"landscape-secondary" //可选，字符串类型，支持反向横屏]…
如何做校园圈子小程序，需要哪些功能？APP小程序H5公众号功能齐全，PHP书写，uniAPP。源码交付，支持二开！
最近几年，校园外卖跑腿服务市场迅速兴起。由于学生每天课程繁忙，很多人没有时间去食堂或外面的餐厅用餐，校园外卖跑腿平台提供了便捷和快速的解决方案，满足了学生的饮食跑腿需求，并受到越来越多学生的喜爱。
那么&…
uniapp 之 实现商品详情的锚点跳转（类似京东商品详情-点击顶部按钮跳转的对应的页面的内容区域）
类似京东商品详情-点击顶部详情跳转到页面对应的详情区域，点击评价跳转到页面对应的评价区域等。
照例，先封装方法：
封装方法
util.js
/*** 锚点跳转（如：商品详情页面跳转）* param {string} targetId 目…
uni-app 安卓手机判断是否开启相机相册权限
// 安卓相机权限 androidCameraPermiss(index){ plus.android.requestPermissions([android.permission.CAMERA],(e) > { if (e.deniedAlways.length > 0) { this.androidAuthCamera false …
uniapp+node.js前后端做帖子模块：分享帖子和分享页面（社区管理平台的小程序）
目录 0前提1.一些准备1.1表帖子表 post 1.2总体思路 2.前端3.后端 👍 点赞，你的认可是我创作的动力！
⭐️ 收藏，你的青睐是我努力的方向！
✏️ 评论，你的意见是我进步的财富！ 0前提
温馨提示…
uniapp sqlite时在无法读取到已准备好数据的db文件中的数据
问题 {“code”:-1404,“message”:“android.database.sqlite.SQLiteException: no such table: user (Sqlite code 1): , while compiling: select * from user, (OS error - 2:No such file or directory),http://ask.dcloud.net.cn/article/282”} at pages/index/index.vu…
Vue/Uni-app/微信小程序 v-if 设置出场/退出动画（页面交互不死板，看起来更流畅）
天梦星服务平台 (tmxkj.top)https://tmxkj.top/#/
在Vue.js中，使用v-if进行条件渲染时设置动画可以通过<transition>组件来实现。
具体操作步骤如下：
包裹条件渲染的元素：您需要将要通过v-if控制显示隐藏的元素包裹在<transition…
uni-app微信小程序上拉加载，下拉刷新
pages.json配置官网链接 onPullDownRefresh、onReachBottom函数跟生命周期同级
data() {return {orderList:[],total: null, //总共多少条数据page: 1,pageSize: 10,}
},
onLoad() {},
mounted(){this.getInfo()
},
methods:{getInfo(){API.getListxxx().then(res > {const…
uniapp列表滑动操作（删除、编辑）
本篇文章结合了下拉刷新、上拉加载，以及每一条列表的左滑删除，这里的header和footer盒子样式我就不写了，光写了main。是上中下布局，中间是内容，废话不说了，直接上代码！
<template><vi…
uniapp写支付的操作
支付的时候一般需要几个参数：
‘timeStamp’: 时间戳,‘nonceStr’: 随机字符串，不超过32位‘package’: 下单后接口返回的prepauid‘signType’: 签名的算法‘paySign’: 后端会给前端一个签名sign: data.sign // 根据签名算法生成签名
<template&…
uniapp 对video视频组件嵌套倍速按钮
这次接了需求是要求有倍速功能，去看了文档发现并没有倍速按钮的属性，想着手写一个吧 可最后发现原生层级太高，无论怎么样都迭不上去，就只能去找插件看看咯 找了好多插件发现都不可用，因为我这是app端，有些视…
Uni-app跟学笔记（三）：样式、Vue基础、请求、数据缓存
Uni-app跟学笔记（三）：样式、Vue基础、请求、数据缓存 文章目录 Uni-app跟学笔记（三）：样式、Vue基础、请求、数据缓存1）样式2）vue基础1：数据绑定2：v-bind 动态…
pc端vue2项目使用uniapp组件
项目示例下载 运行实例： 这是我在pc端做移动端底代码时的需求，只能在vue2使用，vue3暂时不知道怎么兼容。 安装依赖包时可能会报：npm install Failed to set up Chromium r756035! Set “PUPPETEER_SKIP_DOWNLOAD” env variable …
uniapp实现点击图片预览放大，长按下载图片
1. 使用uniapp中的 uni.previewImage API 预览图片 2. 使用uniapp中的 uni.downloadFile API 下载图片 3. 使用uniapp中的 uni.saveImageToPhotosAlbum API 将图片保存到相册 <template><view class"content" style"padding-top: 40px;"><i…
uniapp运行钉钉小程序
因项目原因，公司需要在钉钉里面开发小程序。之前用uniapp开发过app，H5，小程序。还真没尝试过钉钉小程序，今天就简单的记录下uniapp运行钉钉小程序中的过程。
在项目目录新建package.json文件，在文件中添加如下代码&am…
一站式解决方案：uni-app条件编译及多环境配置，appid动态修改攻略！
前言
这篇文章主要介绍uniapp在Hbuilderx 中，通过工程化，区分不同环境、动态修改小程序appid以及自定义条件编译，解决代码发布和运行时手动切换到问题。
背景
在企业级的应用中，通常会分为，开发、联调、生产等多个环…
uniapp中人脸识别图片并圈起人脸
效果如上，我用的是阿里云的人脸识别。首先，我们先封装一个阿里云的请求js文件
faceRecognition.js
import CryptoJS from crypto-js//SignatureNonce随机数字
function signNRandom() {const Rand Math.random()const mineId Math.round(Rand * 1000…
uniapp app端跳转到应用商店
uniapp app端跳转到应用商店
安卓是指定包名跳转，iOS需要指定id:
if (plus.os.name "Android") {// 跳转安卓应用市场let appurl "market://details?idcom.tencent.mm" //这个是通用应用市场，如果想指定某个应用商店࿰…
uniapp微信小程序_自定义交费逻辑编写
一、首先看最终效果 先说下整体逻辑,选中状态为淡紫色,点击哪个金额,充值页面上就显示多少金额 二、代码 <view class"addMoney"><view class"addMoneyTittle">充值金额</view><view class"selfaddmoney" :class"{…
uniapp实现页面固定区域转为base64图片预览并手动保存本地
uniapp实现页面固定区域转为base64图片预览并手动保存本地 声明：H5目前没有实现直接长按保存到手机图库（浏览器可以直接保存为图片），所以将过程中得到的base64转为真实图片地址用a标签click的方式实现预览，并手动长按…
微信小程序uniapp onshow函数介绍
onShow()是小程序中的一个生命周期函数，负责页面显示时触发一些任务。
与之相对的还有一个函数onload()，同样也是生命周期函数，二者有以下区别：
1、触发时机
onLoad() 函数只会在页面加载时触发一次；
onShow() 函数…
Uni-app开发Canvas当子组件示例，点点绘制图形
前言
使用Uni-app 实现封装一个Canvas渲染的子组件，实现通过传入两点绘制一条完整的路程 具体逻辑看我发的后端和数据库设计 C# 根据两点名称，寻找两短路程的最优解，【有数据库设计，完整代码】
即使不了解具体逻辑，该…
uniapp移动端 IOS系统下无法与webview通信
不知道有没有人遇到过这个问题 我的页面嵌套了一个webview（文件位于项目的hybrif/html）目录下 使用evalJS与webview进行通信 代码如下
在安卓里运行是没问题的，但在苹果手机上一直无法通信 连接真机，打印evalJS是个方法…
uniapp微信小程序_拍照从相册选择
userImg() {let that thisuni.chooseMedia({count: 1,mediaType: [image, video],sourceType: [album, camera],maxDuration: 30,camera: back,success(res) {console.log(res.tempFiles[0].tempFilePath)that.imagUrl res.tempFiles[0].tempFilePath}})}, 直接调用api即可,注…
uniapp遇到的问题
【uniapp】小程序中input输入框的placeholder-class不生效解决办法
解决：写在scope外面
uniapp设置底部导航
引用：https://www.jianshu.com/p/738dd51a0162
【微信小程序】moveable-view / moveable-area的使用
https://blog.csdn.net/qq_36901092/…
vue/uniapp路由history模式下宝塔空间链接打开新窗口显示404解决方法
vue/uniapp路由history模式下宝塔空间链接打开新窗口显示404，或者域名后带路径参数刷新就报404 解决方法：
宝塔中站点配置修改：【配置文件】中添加下面代码，具体如图：
location / {try_files $uri $uri/ /index.html…
[uni-app] 小程序码转为二维码, 小程序解析此码获取数据
小程序码缩小后太细, 不好扫, 还是改成二维码扫
记录解析该二维码 onLoad(e) {if (e.shareTimeline) { // 以单页面启动-朋友圈分享出的单页面this.shareTimeline e.shareTimeline;let param {certId: e.certId,uid: e.uid,unionid: e.unionid,openid: e.openid,}this.initD…
前端UNIAPP端webview嵌入H5使用说明文档
一、关闭webView窗口 plus.webview.close( id_wvobj, aniClose, duration, extras );
功能说明
关闭已经打开的Webview窗口，需先获取窗口对象或窗口id，并可指定关闭窗口的动画及动画持续时间。
参数说明
参数是否必须参数类型/固定值说明id_wvobj是…
uniapp 兼容pc与手机的样式方法
在h5的开发中，做视窗的样式兼容和适配，大家肯定都知道移动端使用自适应单位rpx,pc端可以使用媒体查询的方法来适配，但是在uniapp 项目开发中，有时在移动端展示的样式会被在桌面端打开，渲染在浏览器，这时候你…
uniapp无感登录封装
全局请求封装
https://blog.csdn.net/qq_42618566/article/details/109308690
无感登录封装
import {http} from "./index.js"
let requestsQueue []; // 请求队列// 记录请求队列
export function recordRequests(path, params, loading, method) {requestsQueu…
详解uniapp的生命周期
这篇文章主要介绍了 uniapp 的生命周期, 应用生命周期是指应用程序从启动到关闭的整个过程，包括应用程序的启动、前后台切换、退出等, 需要的朋友可以参考下 Uniapp 作为一款跨平台应用开发框架，具有丰富的生命周期，以下是 Uniapp 的生命周期…
uni-app实现路由拦截 请求封装
第一步 ui框架的安装：
1 npm install uview-ui2.0.31
2 main.js导入： import uview from ‘uview-ui’； Vue.use(uView)
3 uni.css引入：import ‘uvew-ui/theme.scss’
4 pages.json配置：{ “easycom”&a…
uni app 钓鱼小游戏
最近姑娘喜欢玩那个餐厅游戏里的钓鱼 ，经常让看广告，然后就点点点...
自己写个吧。小鱼的图片自己搞。 有问题自己改，不要私信我
<template><view class"page_main"><view class"top_linear"><v…
uniapp小程序上传oss
uniapp上传小程序代码
import crypto from crypto-js;
import { Base64 } from js-base64/base64.js;
// 计算oss签名。
function computeSignature(accessKeySecret, canonicalString) {return crypto.enc.Base64.stringify(crypto.HmacSHA1(canonicalString, accessKeySecre…
uniapp 之 一些常用方法的封装（页面跳转，页面传参等）
util.js 提示：permission.js是uniapp插件市场由官方DCloud_heavensoft提供的App权限判断和提示插件。 import permision from "/js_sdk/wa-permission/permission.js"/*** uni.toast 封装* param {String} msg toast 提示内容* param {Number} duration …
安卓内嵌uniapp的H5页面 android调用h5内部方法
uniapp H5与原生安卓的数据互通和方法调用_安卓代码中调用uniapp中页面中的方法-CSDN博客文章浏览阅读8.7k次，点赞4次，收藏22次。1、准备我这里是uniapp与原生安卓之间的相互调用，也就是原生安卓内嵌H5页面，下面先来准备一下安卓端…
uniapp——第2篇：编写vue语法
前提，建议先学会前端几大基础：HTML、CSS、JS、Ajax，还有一定要会Vue!（Vue2\Vue3）都要会！！！不然不好懂 一、去哪写？
就在【pages】的你的人一个页面文件夹里的【.vue】文…
uniapp 实现双击点赞出现特效
更新一下 老板改了需求要加上特效
1. 创建点赞按钮
首先，在你的页面中创建一个点赞按钮 全局点赞的话就写在最外面的标签就行了。你可以使用 <button> 组件或者自定义一个视图组件。
<template> <view class"container"> <but…
uniapp——第3篇：自定义组件、组件间传数据
前提，建议先学会前端几大基础：HTML、CSS、JS、Ajax，还有一定要会Vue!（Vue2\Vue3）都要会！！！不然不好懂 一、组件是啥玩意？
我之前讲vue2的文章讲过
Vue全家桶:vue2vue3全…
uni-app使用canvas适配手机宽高进行渲染
uni-app使用canvas适配手机宽高进行渲染
<template><view class"countStyle"><view class"bgimg" :style"{ background-image: url( imager ), height: bgHeight px }"><canvas canvas-id"firstCanvas" clas…
uni-app网络请求封装及发送
在看本篇文章之前，请先至少学会独立完成vue2项目
首先配置request.js
const url_all {DEV: http://localhost:8888, // 开发// 生产 PRO: http://111.111.111.111:8080,
}let BASEURL url_all[DEV] // 调整当前环境/** 全局请求封装* param path 请求路径* pa…
学习笔记 | 微信小程序项目day02
今日学习内容
安装uni-ui跟uni-helper/uni-ui-types配置pinia持久化请求工具类的拦截器请求工具类的请求函数
安装uni-ui跟uni-helper/uni-ui-types
npm install -g cnpm --registryhttps://registry.npmmirror.com
npm set registry https://registry.npmmirror.com
npm i …
uniapp样式穿透修改uview的按钮button图标
需求： 想给按钮icon和text改字体颜色，结果发现图标颜色并没有改变
.u-button{width: 300rpx;background-color: aliceblue;color: #aaaa7f;margin-top: 20rpx;
}接下来用样式穿透解决
1、首先，给UI组件包裹一层view
<view class"t…
Vue3之uni-app中注册全局属性案例
Vue3之uni-app中注册全局属性案例 main.js中配置全局属性 // #ifdef VUE3
import { createSSRApp } from vue
import App from ./App.vue
import request from /api/request.js
export function createApp() {const app createSSRApp(App)app.config.globalProperties.$reques…
前端Vue与uni-app中的九宫格、十二宫格和十五宫格菜单组件实现
欢迎加入我们的前端组件学习交流群，可添加群主微信，审核通过后入群。 在前端 Vue 开发中，我们经常会遇到需要开发九宫格、十二宫格和十五宫格菜单按钮的需求。这些菜单按钮通常用于展示不同的内容或功能，提供给用户快速访问和选择…
Uniapp有奖猜歌游戏系统源码，附带流量主
有奖猜歌游戏是一款基于uni-app、uniCloud、uniAD 开发的小游戏，通过猜歌曲、观看广告赚取现金奖励。
游戏基本特征
玩家可以通过猜歌、做任务等方式直接获取现金奖励
玩家可以通过猜歌、拆红包、做任务等方式获取金币奖励，当金币累积到一定数量可以兑…
uni-app多次触发事件，防止重复点击
在uni-app中，经常会碰到多次触发事件，重复点击，导致造成业务出现问题。
虽然在后端可以进行操作，防止业务问题。那么前端该如何实现呢？1.在根目录下新建common文件并创建noclick.js文件
// 防止处理多次点击
function…
uniapp实现html转换为图片并下载
在使用uniapp开发支付宝小程序时，碰到了需要将html转化为图片并下载的需求，发现在支付宝小程序中无法使用html2canvas进行处理，所以使用canvas自己绘制的方式，主要代码如下所示：
<view id"container">…
uniapp canvas文字和元素居中
文字居中：ctx.textAlign "center";
元素居中：ctx.arc(screenWidth / 2, 122, 40, 0, 2 * Math.PI);
ctx.arc()的x轴为当前屏幕的宽度/2；
let screenWidth 540;
let screenHeight 960;
// 头像
if (photoimg) {ctx.setFillSty…
uni-app发布 h5 与ASP .NET MVC 后台 发布 到 IIS的同一端口 并配置跨域
iis 安装URL重写 选择对应的后台项目，进行url重写
编辑【模式】部分的内容的重写规则，我这里是h5中请求的前缀是api，大家可以根据自己的前缀进行修改。 编写【操作类型】为重写，并写重写url，按照图中设置即可。
uni…
uniapp+uview 学习笔记（一）—— H5开发
文章目录 前言一、开发步骤1.创建项目2.安装组件库并导入使用3.封装请求4.国际化5.打包 总结 前言
本文主要介绍使用uniapp框架和uview组件库进行H5开发，需要用到的开发工具为HBuilder X。 一、开发步骤
1.创建项目
打开HBuilder X，在顶部栏目选择 新…
uniapp修改头像，选择图片
一、页面效果 二、手机上的效果 使用过的实例：
手机上就会显示类似如下： 三、代码
<view class"cleaner-top" click"chooseImg"><view class"cleaner-avatar"><image :src"imgArr" mode"…
uniapp APP 上传文件
/*** 上传文件*/uploadPhoneFile:function(callback,params {}) {let fileType [.pdf,.doc,.xlsx,.docx,.xls]// #ifdef APP-PLUSplus.io.chooseFile({title: 选择文件, filetypes: [doc, docx], // 允许的文件类型 multiple: false, // 是否允许多选 },(e)>{const tem…
从0开始写一个问卷调查APP的第11天
1.今日任务
分析:上次我们实现了从数据库中成功的查找到对应问卷的问题并在前端展示出来，那么今天我们增加难度。在数据库中插入多项选择问题，在接口中查找到并在前端显示出来。
2.实现
2.1数据库中插入测试数据
我们先查看一下表的结构 2.2接口实现…
使用uniapp，uni-data-select组件时，内容长度没超过容器宽度时候虽然能显示全内容但是数据后边会出现三个点，逼死强迫症
项目场景：
微信小程序开发，使用uniapp，uni-data-select组件时，内容长度没超过容器宽度时候虽然能显示全内容但是数据后边会出现三个点，逼死强迫症 解决方案： 找到组件的源代码，然后删除那三个…
uniapp使用uview ui库的popup或者overlay解决它的底层内容滚动问题
在 微信小程序/App 平台可使用 page-meta 组件动态修改页面样式， 以 uv-popup 为例，需要在 data 中定义一个变量，用来表示 uv-popup 的开启关闭状态，并通过这个变量修改 page-meta 的 overflow 属性。 在 uv-popup 的 打开和关闭 …
微信小程序 nodejs+vue+uninapp学生在线选课作业管理系统
基于微信小程序的班级作业管理助手使用的是MySQL数据库，nodejs语言和IDEA以及微信开发者工具作为开发工具，这些技术和工具我在日常的作业中都经常的使用，并且因为对编程感兴趣，在闲暇时间也进行的进行编程的提高，所以在…
DIY可视化整合MQTT生成UniApp源码
DIY可视化整合MQTT生成UniApp源码 MQTT协议是什么？ MQTT（Message Queuing Telemetry Transport）是一种轻量级的、基于发布/订阅模式的通信协议，专门设计用于在低带宽、不稳定的网络环境下进行物联网设备之间的通信。具有以下特点&…
uniapp可视范围高度 - 用户屏幕可操作的屏幕高度 - 适用于APP、H5@公众号、纯H5@Chrome
可视范围高度 let heightPx uni.getWindowInfo().windowHeight uni.getWindowInfo().windowTop 官方手册
uni.getWindowInfo() | uni-app官网uni-app,uniCloud,serverless,uni.getWindowInfo()https://uniapp.dcloud.net.cn/api/system/getWindowInfo.html 实测数据
uni.ge…
![uniapp运行项目到微信小程序报错——未找到[“sitemapLocation“]](https://img-blog.csdnimg.cn/direct/d670e1dfc189487a8eec4dc6f5efb370.png#pic_center)
uniapp使用Echarts图表H5显示正常 打包app显示异常
uniapp使用Echarts在H5页面调试 调试完在H5正常显示 然后通过安卓机调试的时候 发现直接空白了 还有这个爆错 Initialize failed: invalid dom 我有多个图表、图表是通过v-for循环出来的
解决方案
原来是yarn直接安装Echarts 然后改成本地JS文件引入 gitbub文件地址 — dist/…
uniapp小程序：使用uni.getLocation通过腾讯地图获取相关地址信息详情（超详细）
先看运行结果： 流程：
1、在edge网页搜索腾讯位置服务 搜索后点击这里 已经有账号的就进行登录，没有账号的进行注册即可 点击控制台： 进去后点击成员管理---->我的应用---->创建应用 输入相应的参数应用名称（随便…
uniapp 云开发省钱之调整函数执行内存大小
我这个5块钱一个月的服务空间配置： 现在还只有少量的用户和自己测试之用，目前消耗的情况： 云函数的使用量还是挺高的，目前还是正好能覆盖一个月的使用量，等用户量上来肯定是不行的，所以得想想办法压榨一下云…
uniapp套壳打包成apk
不管是vue项目还是uniapp项目，只要能打包成 index.html都可以通过uniapp打包成apk 1.首先把这个项目发布到线上
拿百度举例：
发布到百度服务器用 www.baidu.com能访问到
2.然后到uniapp上发布项目用默认的 vue2，如果你的项目是vue3也用vue2
3.废话我觉得说太多了，直接…
快速入门uniapp-day03
个人名片： 😊作者简介：一名大二在校生 🤡 个人主页：坠入暮云间x 🐼座右铭：给自己一个梦想，给世界一个惊喜。 🎅**学习目标: 坚持每一次的学习打卡 文章目录 什么是标签栏…
学习笔记 | 微信小程序项目day04
今日学习内容
热门推荐下转页面
热门推荐下转页面
1、定义类型
import type { PageResult, GoodsItem } from ./global/** 热门推荐 */
export type HotResult {/** id信息 */id: string/** 活动图片 */bannerPicture: string/** 活动标题 */title: string/** 子类选项 */…
Uni App中去掉访问路径中的#
要启用HTML5历史路由模式，你需要：
确保你的服务器支持HTML5历史API。这意味着服务器应该能够处理在没有#的情况下路由的请求。 在Uni App项目中配置路由模式为history。 在Uni App项目中，你可以在manifest.json文件中配置路由模式。找到&quo…
uniapp：wx.switchTab: url 不支持 queryString
场景：从首页跳到 列表页,并将参数传过去，用于搜索，而首页和列表页都是 tabbar页面，添加 query参数时无法获取，也⚠️；怎么办？ 方案一：vuex
方案二：pinia
上面两种代码自…
如何从零开始拆解uni-app开发的vue项目（一）
uni-app项目分析：
背景：最近接手一个前同事留下的半拉子项目，出拿过来觉得很简单；当我看到app.vue的时候很确定是vue项目，心里不怎么慌，果断安装node.js,然后就去npm ；安装VS code,事实并不是我期盼的那样，或者说根本就不能运行。
报错：应用vs code打开文件，输入命…
隐藏uniapp中的头部导航栏
全局隐藏： 在APP.vue中 ，添加如下代码：
/* #ifdef H5 */uni-page-head {display: none;}
/* #endif */
IT廉连看——Uniapp——模板语法
IT廉连看——Uniapp——模板语法
众所周知，Uniapp是使用vue.js框架开发出来的，所以说它可以使用vue中的语法和指令来开发我们的项目。如果没有学习过vue的话开发起来会比较吃力，所以这节课就带大家学习几个常用的vue知识。如果有学习过vue&a…
uni-app 中两个系统各自显示不同的tabBar
最近在一个uni-app项目中遇到一个需求,在登录页面成功登录以后需要判断身份,不同的身份的进入不同的tabBar页面,但是在uni-app项目中pages.json中的tabBar的list数组只有一个，且不能写成动态的,那如何实现这个需求呢?答案是需要我们自定义tabBar。
目录 1、我们确…
Vue字符串里的中文数字转换为阿拉伯数字
js字符串里的汉字数字转化为数字
<template><view><view><view class"inpbox" ><textarea v-model"voiceMane" input"convert" ></textarea></view></view></view>
</template>
&…
uniapp使用Canvas给图片加水印把临时文件上传到服务器
生成的临时路径是没有完整的路径没办法上传到服务器
16:37:40.993 添加水印后的路径, _doc/uniapp_temp_1710923708347/canvas/17109238597881.png
16:37:41.041 添加水印后的完整路径, file://storage/emulated/0/Android/data/com.jingruan.zjd/apps/__UNI__BE4B000/doc/…
如何从零开始拆解uni-app开发的vue项目（二）
昨天书写了一篇如何从零开始uni-app开发的vue项目，今天准备写一篇处理界面元素动态加载的案例：
背景：有不同类别的设备，每个设备有每日检查项目、每周检查项目、每年检查项目，需要维保人员，根据不同设备和检查类别对检查项目进行处理，提交数据。
首先看一下界面：
&l…
像uniapp image标签一样对图片进行缩放和裁剪
像uniapp image标签一样对图片进行缩放和裁剪 0 前言提示1 实现1.1 不保持纵横比缩放图片，使图片的宽高完全拉伸至填满 image 元素1.2 保持纵横比缩放图片，使图片的长边能完全显示出来。也就是说，可以完整地将图片显示出来。1.3 保持纵横比缩…
uniapp中使用mixins控制横屏竖屏
概念 mixins概念和用法同vue在此不在赘述。 在根目录下创建mixins目录，在mixins目录下创建lockScreen.js
export default {data() {return {};},onLoad() {// #ifndef H5plus.screen.lockOrientation(portrait-primary);// #endif},onShow: function() {},onUnload…
微信小程序外卖跑腿点餐(订餐)系统(uni-app+SpringBoot后端+Vue管理端技术实现)
项目介绍
自从计算机发展开始，计算机软硬件相关技术的发展速度越来越快，在信息化高速发展的今天，计算机应用技术似乎已经应用到了各个领域。
在餐饮行业，除了外卖以外就是到店里就餐，在店里就餐如果需要等待点餐的话…
IOS/Android App备案（uniapp）
IOS/App备案 IOS备案Android备案 IOS备案
准备好p12证书即可 链接: https://aitoolnav.caichuangkeji.com/#/AppMd5
Android备案
上DCLOUD开发者中心，找到相关应用后，直接查看证书即可获取到MD5 公钥：先根据上述页面下载证书，…
uniapp+uview 学习笔记（二）—— H5开发
文章目录 前言一、开发步骤1.创建项目2.安装组件库并导入使用3.封装请求4.国际化5.打包 总结 前言
本文主要介绍使用uniapp框架和uview组件库进行H5开发，需要用到的开发工具为HBuilder X。 一、开发步骤
1.创建项目
打开HBuilder X，在顶部栏目选择 新…
uniapp中预览base64图片
一、首先要安装插件image-tools，插件地址：https://ext.dcloud.net.cn/plugin?id123
npm i image-tools --save二、引入
import {pathToBase64,base64ToPath} from image-tools三、应用
openImg(){//预览图片 let that this;uni.showLoading({title:…
Uni-app/Vue/Js本地模糊查询，匹配所有字段includes和some方法结合使用e
天梦星服务平台 (tmxkj.top)https://tmxkj.top/#/
1.第一步 需要一个数组数据 {"week": "全部","hOutName": null,"weekendPrice": null,"channel": "门市价","hOutId": 98,"cTime": "…
uniapp(vue3) H5页面连接打印机并打印
一、找到对应厂商打印机的驱动并在windows上面安装。查看是否安装完成可以在：控制面板->查看设备和打印机，找到对应打印机驱动是否安装完成 二、打印机USB连接电脑
三、运行代码调用浏览器打印，主要使用的是window.print()功能。下面使用…
uni-app打包证书android
Android平台打包发布apk应用，需要使用数字证书（.keystore文件）进行签名，用于表明开发者身份。
Android证书的生成是自助和免费的，不需要审批或付费。
可以使用JRE环境中的keytool命令生成。
以下是windows平台生成证…
uniapp，导航栏（切换项）有多项，溢出采取左滑右滑的形式展示
一、实现效果 当有多项的导航，或者说切换项，超出页面的宽度，我们采取可滑动的方式比较好一些！并且在页面右边加个遮罩，模拟最右边有渐变效果！
二、实现代码
html代码：
<!-- 头部导航栏 --…
uniapp微信小程序_购物车_下单页面
先说下整体逻辑以方便总体理解 1、首先画出下单页面 2、此次画出结算价格页面 3、怎么点击下完单变成结算页面？其实就是把下单页面的信息传递给结算页面就行 问题难点？ 点击加号的时候把物品加入一个数组传到下单页面，但是点击的时候不能…
基于uniapp微信小程序我的钱包页面
基于uniapp color ui
页面效果图： 代码部分：
https://download.csdn.net/download/kay523393/89035927
uni-app里面如何使用图标
目录
一、导入
1.在官方（iconfont-阿里巴巴矢量图标库）选择自己想要的图标，加入购物车
2. 在点击购物车下载代码
3.解压文件夹 并更改名字 4.将文件夹（iconfont）整个放到项目中的static中
5.修改iconfont.css文件…
【webView中打开pdf文件，再点击设置切换页面后，再点击返回，则pdf无法正常显示，显示空白？】
https://developers.weixin.qq.com/community/develop/doc/000ea83ba5cb58a586feb827c59c00跟这个问题一样 解决办法就是在onshow中奖地址清了重新赋值，就是缓存的问题
<div><web-view :src"pdfurl" :webview-styles"webviewStyles" …
UNI-APP读取本地JSON数据
首先要把json文件放在static文件夹下
然后在要读取数据的页面导入
import data from ../../static/data.json读取数据： onLoad() {console.log(data, data)},
打印出来的就是JSON文件里的数据了
uniApp中使用小程序XR-Frame创建3D场景（1）环境搭建
1.XR-Frame简介
XR-Frame作为微信小程序官方推出的3D框架，是目前所有小程序平台中3D效果最好的一个，由于其本身针对微信小程序做了优化，在性能方面比其他第三方库都要高很多。
2.与Three.js的区别
做3D小程序的同学们对Three.js一定不陌生…
Uniapp manifest
manifest.json 应用配置
manifest.json 文件是应用的配置文件，用于指定应用的名称、图标、权限等。HBuilderX 创建的工程此文件在根目录，CLI 创建的工程此文件在 src 目录。
#配置项列表
属性类型默认值描述最低版本nameString应用名称appidString新建…
Uni App中遇到的跨域问题
通过与多年开发经验的h5前端沟通后，可以对某些事情更加明确，才此期间，会和后端、运维同学产生密不可分的交集，成了谁来改的问题。
明确：跨域99%由后台来配置，如果在本地开发，可以手动配置&…
uni-app开发---3.tabBar
一、创建 tabBar 分支
运行如下的命令，基于 master 分支在本地创建 tabBar 子分支，用来开发和 tabBar 相关的功能： git checkout -b tabbar 二、 创建 tabBar 页面 在 pages 目录中，创建首页(home)、分类(cate)、购物车(cart)…
全栈的自我修养 ———— uniapp中加密方法
直接按部就班一步一步来 一、首先创建一个js文件填入AES二、创建加密解密方法三、测试 一、首先创建一个js文件填入AES
直接复制以下内容
/*
CryptoJS v3.1.2
code.google.com/p/crypto-js
(c) 2009-2013 by Jeff Mott. All rights reserved.
code.google.com/p/crypto-js/wi…
uni-app纵向步骤条
分享一下项目中自封装的步骤条，存个档~
1. 话不多说，先看效果 2. 话还不多说，上代码
<template><!-- 获取一个数组，结构为[{nodeName:"流程发起"isAudit:falsetime:"2024-02-04 14:27:35"otherDat…
uni-app从零开始快速入门
教程介绍
跨端框架uni-app作为新起之秀，在不到两年的时间内，迅速被广大开发者青睐和推崇，得益于它颠覆性的优势“快”，快到可以节省7套代码。本课程由uni-app开发者团队成员亲授，带领大家无障碍快速掌握完整的uni-app…
如何让uni-app开发的H5页面顶部原生标题和小程序的顶部标题不一致？
如何让标题1和标题2不一样？ 修改根目录下的App.vue（核心代码如下）
<script>export default {onLaunch() {// 监听各种跳转----------------------------------------[navigateTo, redirectTo, reLaunch, switchTab, navigateBack, ].…
uniapp安装axios
先npm安装
npm i axios然后在项目里面建一个utils文件，再建一个index.js 以下是index.js代码：
import axios from axios;
const service axios.create({baseURL: //xxxx.xxxxx.com///你的请求接口域名, timeout: 6000, // request timeoutcrossDomai…
uniapp自定义导航栏左中右内容和图标，以及点击事件
uniapp自定义导航栏左中右内容和图标，以及点击事件
效果：
页面： <view class"navigation-bar"><view class"navigation-bar-left" click"navigateBack"><u-icon name"arrow-left"…
![[uni-app] uni.createAnimation动画在APP端无效问题记录](https://img-blog.csdnimg.cn/direct/08ec8d91dd4e4142a75226e74bacc547.png)
[uni-app] uni.createAnimation动画在APP端无效问题记录
文章目录 uni.createAnimation动画描述动画代码templatejs部分 问题原因改进方案template js部分改动git 改进截图 uni.createAnimation
动画描述
实现一个以左上角为锚点,以Z轴做平面抬起及落下的动画效果
动画代码
template <image v-if"showHot(item.cname)&quo…
uniapp通过script引入外部sdk的方法
文章目录 一、index.html引入二、动态引入1.App.vue引入2.单页面引入 一、index.html引入
例如
<!DOCTYPE html>
<html lang"en"><head><meta charset"UTF-8" /><script>var coverSupport CSS in window && type…
关于报错navigateTo:fail can not navigateTo a tabbar page
关于uniapp报错navigateTo:fail can not navigateTo a tabbar page的处理方法 报这个错误其实是因为你使用了navigateTo的方式跳转到了Tabbar的页面，然后navigateTo是不支持跳转到Tabbar的页面的，所以你只需要将uni.navigateTo接口更换为uni.switchTab接…
uniapp-Form示例（uviewPlus）
示例说明 Vue版本：vue3 组件：uviewPlus（Form 表单 | uview-plus 3.0 - 全面兼容nvue的uni-app生态框架 - uni-app UI框架） 说明：表单组建、表单验证、提交验证等； 截图： 示例代码
<templat…
uniapp页面嵌套其他页面的实现
功能:
类似于一个drawer，当主页面加载的时候会一并加载url对应的组件，当点击后以drawer形式显示组件里面的内容，可动画。 <navigator url"/pages/my/components/personalMessage" slot"right"><view><di…
uni-app开发---4.首页
一、创建 home 分支 运行如下的命令，基于 master 分支在本地创建 home 子分支，用来开发和 home 首页相关的功能： git checkout -b home 二、配置网络请求 由于平台的限制，小程序项目中不支持 axios，而且原生…
使用uniapp 的 plus.sqlite 操作本地数据库报错：：：table xxx has no column named xxxx
背景： 1、使用uniapp 的 plus.sqlite 进行APP本地数据库操作 2、SQLite 模块用于操作本地数据库文件，可实现数据库文件的创建，执行SQL语句等功能。
遇到：在之前创建的表上进行新增字段的操作时候，出现问题：…
uniapp开发：vue3 中vuex的使用
开发工具HbuilderX3.98
在根目录下创建store目录，并在该目录下创建index.js文件 index.js 文件
/*index.js 文件*/// #ifndef VUE3
import Vue from vue
import Vuex from vuex
import audio from "/store/modules/audio.js"
Vue.use(Vuex)
const store…
uniapp 安卓跳转到应用设置等页面
// #ifdef APP-PLUS
const platform uni.getSystemInfoSync().platform
if (platform android) {var main plus.android.runtimeMainActivity(); //获取activityvar pkName main.getPackageName();var Intent plus.android.importClass(android.content.Intent); var Set…
uniapp打包小程序，使用$refs报错解决办法
uniapp打包字节抖音小程序使用$refs报错解决办法
在小程序开过程中，使用uniapp时，作为开发者，我们习惯以vue的语法进行开发，希望通过使用$refs进行元素的操作，但是开发小程序时这种方法却失效了。 原因：微…
uni-app中web-view的使用
1. uni-app中web-view的使用 uni-app中的web-view是一个 web 浏览器组件，可以用来承载网页的容器，uni-app开发的app与web-view实现交互的方式相关简单，应用通过属性message绑定触发事件，然后在web-view的网页向应用 postMessage 触…
基于vue+element+springboot+uniapp开发的智慧城管源码，java智慧城市管理综合执法系统源码
智慧城管源码，智慧执法，数字化城市管理综合执法系统源码 智慧城管系统充分利用物联网、云计算、信息融合、网络通讯、数据分析与挖掘等技术，对城市管理进行全方位覆盖。它通过建立城市综合管理平台，将城市的信息和管理资源有机结合…
uniapp 使用命令行创建vue3 ts 项目
命令行创建 uni-app 项目： vue3 ts 版 npx degit dcloudio/uni-preset-vue#vite-ts 项目名称注意 Vue3/Vite版要求 node 版本^14.18.0 || >16.0.0 如果下载失败，请去gitee下载
https://gitee.com/dcloud/uni-preset-vue/repository/archive/vite-ts…
从0写一个问卷调查APP的第13天-1
1.今日任务
我也只是一个大学生，有什么思路不对的地方给我指出来哟!
分析：上次我们实现了任务调查的插入。但是我们插入的问卷调查只有它的标题，也就是这个问卷调查是什么我们告诉数据库了，但是现在我们还没有给它添加任何问题&…
uniApp中使用小程序XR-Frame创建3D场景（2）加载模型
上篇文章讲述了如何将XR-Frame作为子组件集成到uniApp中使用，只完成了简单的环境搭建，这篇文章讲解如何加载3D模型。
1 加入模型加载标签
在XR-Frame框架中，加载资源都是在wxml文件的标签中实现的。下面是wxml中完整的代码
index.wxml
&l…
uniapp先显示提示消息再返回上一页
一、描述
在有些业务场景中，需要先弹出提示后，再返回上一页。
二、思路
使用定时器，先弹出提示消息，然后开个定时器俩秒后再执行，返回上一页的操作，并且清除定时器。
三、实现
uni.showToast({title: …
浅谈uniapp优缺点
一、Uni-app的优势 uni-app作为一个跨平台开发框架，具有以下优势：
1.跨平台能力：uni-app可以同时开发iOS、Android、H5和小程序等多个平台的应用，只需编写一套代码即可，大大提高了开发效率。 2.性能表现：u…
uniapp离线打包笔记
环境：Android，Android Studio，Java1.8 参考地址：《Android 原生工程配置》，《Android 离线打包使用插件》
一、创建证书
参考：《Android平台签名证书(.keystore)生成指南》
具体命令：
生成 …
学习笔记 | 微信小程序项目day07
今日学习内容
登录模块会员中心模块
登录模块
1、定义类型
export type loginResult {accout: stringavatar: stringid: stringmobile: stringnickname: stringtoken: string
}2、封装接口
import type { loginResult } from "/types/member"
import { http } …
uni app 空挡接龙
模仿pc游戏 空挡接龙 还不完整。现在没时间搞了记录在这里，等以后有时间了再继续搞。MiniGames: 无聊自研
<template><view class"page_main"><view class"contentone"><canvas class"canvas_cla" style"…
uniapp中实现canvas超出屏幕滚动查看（全网唯一可行方案）
亲爱的小伙伴，当你需要在uniapp中使用canvas绘制一个超长图，就类似于横向的流程图时，这个canvas超出屏幕部分拖动屏幕查看会变得十分棘手。我查阅了大量资料，甚至是问了无数遍AI，得到的结果只有很敷衍的监听touch,然后…
小程序富文本图片宽度自适应
解决这个问题 创建一个util.js文件,图片的最大宽度设置为100%就行了
function formatRichText(html) {let newContent html.replace(/\<img/gi, <img style"max-width:100%;height:auto;display:block;");return newContent;
}module.exports {formatRichT…
uinapp开发-PHP语言-后端安装说明-适用于圈子-陪玩-交友-校园-团购-外卖-分销等多系统-APP小程序H5多端皆有!
后端安装说明 全新安装客户，按此安装调试步骤，请按顺序： ** 后台安装步骤及说明 ** 1、在服务器里安装宝塔。下载www.bt.cn。 宝塔安装完毕后，安装环境，Nginx或者Apache 请选择PHP7.3 数据库mysql5.6。 NGINX 1.22.1轻…
关于uniapp上使用websocket在H5能用，在真机不能用的问题
不要用本地电脑开的websocket来连接，真机（手机端）连不到本地websocket。
uni.connectSocket({url: ws://localhost:3000/chat});
解决办法：
部署到服务器上面，用一个公网的websocket地址，真机上面可以正…
使用uni-app框架进行移动端的适配（uniapp px转rpx）
1、打开uniapp 官网找到 插件市场介绍2、点击插件市场 px2rpx - DCloud 插件市场3、选择使用HBuilderX导入插件4、在HBuilder中点击右键选择开启px2rpx 5、开启成功后会有提示 6、根据设计搞的尺寸就行，我的是在这750*1620的，正常写px，保存…
uniapp微信小程序消息订阅详解
一、微信公众平台申请订阅模板
注意：订阅信息 这个事件 是 当用户 点击的时候触发 或者 是 支付成功后触发， 用户勾选 “总是保持以上选择，不再询问” 之后或长期订阅，下次订阅调用 wx.requestSubscribeMessage 不会弹窗…
【uniapp】uniapp实现免密登录
文章目录 一、概要二、整体架构流程三、技术名词解释四 、技术细节1.存取token有效期？2.使用setStorageSync而不使用setStorage？3.使用onLaunch而不使用全局路由？ 一、概要
打开一个网页或小程序的时候，我们有时候会自动进入主页…
uniapp保留两位小数，整数后面加.00
直接把方法粘贴进去就能用
<text class"bold">总收入￥{{formater(priceNumer)}}</text>export default {data() {priceNumer: 199.999, // 总收入},methods: {// 保留两位小数formater(data) {if(!data) return 0.00data parseFloat(data).…
uniapp 微信小程序 canvas 手写板获取书写内容区域并输出
uni.canvasGetImageData
返回一个数组，用来描述 canvas 区域隐含的像素数据，在自定义组件下，第二个参数传入自定义组件实例 this，以操作组件内 组件。
// 获取目标 canvas 的像素信息 pixelData
let canvas uni.createSelector…
uniapp怎么使用接口返回的iconfont图标
uniapp怎么使用接口返回的iconfont图标
首先在你的项目中添加该图标，名称要对应 实际应用 item.ICONFONT_NAME“tools”; item.ICONFONT_COLOR“FA5151”;
<view class"iconfont" :class"icon-item.ICONFONT_NAME" :color"item.ICON…
uniapp 苹果支付内购示例代码
// #ifdef APPasync init() {uni.showLoading({title: 检测支付环境...});try {// 初始化，获取iap支付通道await this._iap.init();// 从苹果服务器获取产品列表this.productList await this._iap.getProduct();this.productList[0].checked true;this.productId …
uniapp点击按钮连接wifi?
<view><button class"but" bindtap"connectToWifi">点击连接WiFi</button>
</view>
js:
Page({// 页面数据data: {wifiConnected: false},onLoad: function () {this.checkWifiPermission();},// 检查 WiFi 权限checkWif…
uniapp小程序中onShareAppMessage(OBJECT)实现带参数的分享功能
一、引言 小程序中用户点击分享后，在 js 中定义 onShareAppMessage 处理函数（和 onLoad 等生命周期函数同级），设置该页面的分享信息。 用户点击分享按钮的时候会调用。这个分享按钮可能是小程序右上角原生菜单自带的分享按钮&…
uniapp点击拨打手机号？
在uni-app中，你可以通过使用内置的 uni.makePhoneCall 方法来实现点击跳转到手机拨号页面的功能。这个方法可以触发手机系统的拨号程序，并自动填入指定的电话号码。
<template><view><button click"makePhoneCall">拨打电话…
第一次开发微信小程序的总结与心得
我们的小程序开发团队有三个人——两个前端和一个后端，一个没有产品经理和UI设计师的队伍，一个小程序开发零经验的队伍，却需要完成需求分析、页面设计、代码编写、功能测试、小程序上线的整个过程，所以在开发过程中，我…
uniapp vue-cli项目配置devServer和outPutDir
上一次说了使用vue-cli创建uni-app项目，然后使用第三方工具开发打包，利用jekins发布等。
这一次我想解决以下问题：
1我想配置devServer供开发环境使用，这样也可以解决开发环境的跨域问题
2以前我的每个版本信息都配置在package…
uniapp获取当前位置？
在uni-app中获取当前位置通常需要使用小程序的原生API，因为uni-app是基于微信小程序、App和H5等多个平台的跨平台框架。以下是一种获取当前位置的方法，以微信小程序为例： 引入uni-app的小程序原生API：uni-app提供了uni.getLocatio…
uniapp h5 引入阿里云一键登录
参考官方文档:
如何将H5页面接入网页端SDK并一键登录_号码认证服务(PNVS)-阿里云帮助中心 本文主要分享uniapp 对SDK依赖文件的引入 采用npm包引入的方法:
1.下载
// 下载npm资源并添加依赖到package.json
npm i aliyun_numberauthsdk_web -S
tips: 查看package.json文件,确…
uniapp开发小程序遇到的问题，持续更新中
一、uniapp引入全局scss
在App.vue中引入uni.scss
<style lang"scss">/* #ifndef APP-NVUE */import "uni.scss";/* #endif */
</style>注意：nvue页面的样式在编译时，有很多样式写法被限制了，容易报错。所…
uni-app 富文本编辑器
<template><view class"container"><view>标题：<u-input placeholder"请输入标题"></u-input></view><view class"page-body"><view classwrapper><view classtoolbar tap"…
语音陪玩交友软件系统程序-app小程序H5三端源码交付，支持二开！
电竞行业的发展带动其周边产业的发展，绘制着游戏人物图画的抱枕、鼠标垫、海报销量极大，电竞游戏直播、游戏教程短视频也备受人们喜爱，自然，像游戏陪练、代练行业也随之生长起来，本文就来讲讲，从软件开发角…
uniApp使用XR-Frame创建3D场景(3)光源投影的运用。
上一篇讲解了如何在uniApp中创建xr-frame子组件并创建简单的3D场景。
这篇我们讲解光源在场景中的运用以及相关属性。
在子组件 xr-start的index.wxml文件中我们加入如下代码 <xr-scene render-system"alpha:true" bind:ready"handleReady"><xr…
校园app开发流程-uniapp开发-支持APP小程序H5-源码交付-跑腿-二手市场-交友论坛等功能，学校自由选择！
随着科技的不断发展，智慧校园系统和跑腿外卖小程序已经成为当今社会的热门话题。作为未来的重要趋势之一，科技在教育领域中的应用越来越广泛。本文将探讨智慧校园系统和跑腿外卖小程序的开发过程，并阐述如何利用科技“育”见未来
一、智慧校…
uniapp H5 开发，公众号时请求跨域了,要用proxy
这个要注意，如果你请求后端时，请求methedOPTIONS 时，表示跨域了，这个是安全验证。
需要配置 {}/manifest.json 用代理模式 "h5" : {"router" : {"base" : "/h5","mode" : &qu…
uniApp使用XR-Frame创建3D场景(8)粒子系统
上篇文章讲述了如何将XR-Frame作为子组件集成到uniApp中使用
本片我们详细讲解一下xr-frame的粒子系统
先看源码 <xr-scene render-system"alpha:true" bind:ready"handleReady">
<xr-node visible"{{sec8}}"><xr-asset-load t…
uniApp使用XR-Frame创建3D场景(5)材质贴图的运用
上一篇讲解了如何在uniApp中创建xr-frame子组件并创建简单的3D场景。
这篇我们讲解在xr-frame中如何给几何体赋予贴图材质。
先看源码 <xr-scene render-system"alpha:true" bind:ready"handleReady"><xr-node><xr-assets><xr-asse…
uniapp-Win系统上传IOS的App构建
在前文中，我们获取到了ipa包
本人的电脑操作系统是Windows11无法像mac电脑那样去上传构建
前提：已经注册了苹果的开发者账号并且创建了APP项目
下载AppUploader
官网地址：Appuploader
是辅助工具，帮助跨平台APP开发者上架苹果…
日记本（源码+文档）
日记本（小程序、ios、安卓都可部署） 文件包含内容程序简要说明功能项目截图客户端首页日记列表 书写日记个人中心设置密码锁拨打客服热线修改信息退出登录登录页输入密码锁注册页 后端管理登录页首页管理员列表管理用户管理日记列表管理日记数据 文件包含…
uniapp-打包app-图标配置
依次找到manifest->App图标配置，然后点击浏览，从本地文件夹中选择你们项目的logo，然后点击自动生成所有图标并替换，即可：
uni-app选择多张图片上传并压缩——2024.04.02
uni.chooseImage之后plus.zip.compressImage压缩
1、uni.uploadFile(OBJECT)只能循环调用上传（递归） 2、项目对图片压缩后的清晰度要求较高，不使用画布canvas压缩，chooseImage时选择原图。
// 上传图片
chooseImage(){uni.choos…
uniapp通过蓝牙传输数据 （安卓）
在uni-app中，可以通过原生插件的方式来实现蓝牙传输数据的功能。以下是一般的步骤：
1. 创建一个原生插件
在uni-app项目的根目录下，创建一个原生插件的目录，比如"uni-bluetooth"。然后在该目录下创建一个"Androi…
uniapp：小程序腾讯地图程序文件qqmap-wx-jssdk.js 文件一直找不到无法导入
先看问题： 在使用腾讯地图api时无法导入到qqmap-wx-jssdk.js文件
解决方法：1、打开qqmap-wx-jssdk.js最后一行 然后导入：这里是我的路径位置，可以根据自己的路径位置进行更改导入 最后在生命周期函数中输出： 运行效果…
uniapp-设置UrlSchemes从外部浏览器H5打开app
需求：外部浏览器H5页面，跳转到uniapp开发的原生app内部。
1、uniapp内部的配置：
（1）打开manifest->App常用其他设置，如下，按照提示输入您要设置的urlSchemes： （2&am…
uniapp创建opendb-city-china Schema文件后，如何导入城市的数据？
1.点击opendb-city-china后面的详情，进入到gitee代码仓库
2.下载如下图所示的data.json文件 3.将本地创建的opendb-city-china.schema.json上传到云端
4.点击导入json 如果直接将data.json导入会报错，如下图所示:
5.将data.json本来的数组对象&#…
uniapp开发App（一）登陆流程 判断是否登陆，是，进入首页，否，跳转到登录页
一、登陆流程 文字描述：用户进入App，之后就是判断该App是否有用户登陆过，如果有，直接进入首页，否则跳转到登陆页，登陆成功后，进入首页。 流程图如下： 二、在uniapp项目中代码实现 实…
uniapp输入框事件（防抖）
一、描述
在输入框输入内容或者说输入关键词的时候，往往都要进行做防抖处理。如果不做防抖，你输入什么，动态绑定的数据就会保持一致。这样不好吗，同步获取。有个业务场景，如果是搜索框，你每次一个字符&…
uni-app自定义导航栏下拉刷新实现
【z-paging下拉刷新、上拉加载】高性能，全平台兼容。支持虚拟列表，分页全自动处理 - DCloud 插件市场
先记录一个插件，后续更新
从0到1构建uniapp应用-集成thorui组件库
背景
在使用uniapp开发微信小程序过程中， 组件库的选择至关重要。市面上有很多组件库的解决方案。 此文给大家推荐ThorUI 一款仿微信的组件库， 可以说非常实用。 大家可以在thorui官网下载公开版本进行集成。
集成步骤
开启easycom组件模式࿰…
uniapp view组件中的 -webkit-box-orient 属性
-webkit-box-orient属性是一种用于控制flex布局内子元素的排列方向的CSS属性。在uni-app中，view组件使用了flex布局，可以通过设置-webkit-box-orient属性来控制子元素的排列方向。
-webkit-box-orient属性有两个可能的值：
horizontal&#…
线上线下陪玩，APP小程序H5。源码交付，支持二开！
线下陪玩的风险与管理方式
1、陪玩者的身心健康风险
线下陪玩的模式决定了陪玩者需要与不同的需求方见面，并满足他们的陪伴和娱乐需求。这种工作方式可能会给陪玩者带来身心上的压力和负担。因为陪玩者需要面对各种需求方的要求，有时还需要虚拟出一种完…
uniapp自定义卡片轮播图
效果图 1、封装组件
<template><view><!-- 自定义卡片轮播 --><swiper class"swiperBox" :previous-margin"swiper.margin" :next-marginswiper.margin :circular"true"change"swiperChange"><swiper-ite…
陪玩社交系统开发(现成,可定制)-线下线上陪玩达人入驻服务系统软件开发（APP小程序公众号搭建）
陪源码的公司优势
1、长时间的陪玩源码开发经验，始终坚持从客户的实际需求出发
2、提供安全的陪玩系统源码开发解决方案，众多开发案例可供参考
3、需求定制不走弯路，即可使用约单APP开发成品直接使用，也支持二次开发
4、追求精…
uniapp微信小程序真机图片不显示
不同设备可能出现部分设备显示不了图片，解决办法：图片地址直接使用，不要拼接：
https://images.weserv.nl/?urlhttp
axios请求封装,适用于RN,React,Vue,Uniapp(相对于前面几个新增个自定义header头)
axios.js
import axios from axios;
const instace axios.create({baseURL: https://internal.takehr.cn, //接口地址timeout: 5000, //超时时间
});//配置请求拦截器,在请求之前的数据处理,比如在请求头添加token,所有的请求都会经过拦截器
instace.interceptors.request.us…
UniApp 应用发布到苹果商店指南
🚀 想要让你的 UniApp 应用在苹果商店亮相吗？别着急，让我来带你一步步完成这个重要的任务吧！在这篇博客中，我将详细介绍如何将 UniApp 应用顺利发布到苹果商店，让你的应用跻身于苹果生态之中。
引言 &…
uniapp选择退出到指定页面
方法一：返回上n层页面
onUnload(){uni.navigateBack({delta:5,//返回上5层})},方法二：关闭当前页面，跳转到应用内的某个页面。
uni.redirectTo({url: "../home/index"//页面地址}) 方法三：关闭所有页面，打…
小程序滑动删除组件+全选批量删除组件+附源码
小程序滑动删除组件全选批量删除组件附源码
说明
使用 uni-app、uview 组件开发，全端（微信小程序、QQ小程序、抖音小程序等等）
支持滑动删除组件、支持左滑删除、长按进入批量删除、全选删除、长按弹窗删除、
组件式开发，文章…
uniApp使用uview对vuex的二次封装实现全局变量
1、uni-app目根目录新建’/store/index.js’，并复制如下内容到其中 2、uni-app目根目录新建’/store/ u . m i x i n . j s ′ ，并复制如下内容到其中，由于 H X 某些版本的限制，我们无法帮您自动引入 " u.mixin.js࿰…
uniapp/设置桌面角标/发送系统通知/动态修改桌面应用图标/展示3d模型/仿淘宝二楼
uniapp的安卓apk图标角标设置消息数量 1、主要方法： 设置角标： plus.runtime.setBadgeNumber(999) 清除角标： //plus.runtime.setBadgeNumber(0)//没有效果 plus.runtime.setBadgeNumber(-1) //有效果 2、使用在具体的生命周期 1、打开app获取…
如何开发小程序滑动删除组件+全选批量删除组件+附源码
在做小程序的时候，经常需要滑动删除列表的数据，还有需要长按进入删除模式，全选删除 那么如何开发滑动删除组件呢？ 这里选用的是 uni-app、uview 组件开发，支持一套代码可以发布到 微信小程序、QQ小程序、抖音小程序等等…
uniapp 设置globalStyle navigationBarTitleText 不显示
设置全局的navigationBarTitleText但是没有显示 没效果: 原因: 这里实际上设置了navigationBarTitleText 为"" 所以不会使用全局的设置
解决方法就是直接将这一行代码删除
uniapp将图片地址base64格式相互转换
1、下载image-tools插件并安装
npm i image-tools --save-dev
2、引入image-tools
import { pathToBase64, base64ToPath } from image-tools
3、将图片转换成base64格式
create() {// 图片转化为base64格式pathToBase64(/static/logo.png).then(res> {console.log(res…
微信小程序python+uniapp高校图书馆图书借阅管理系统ljr9i
根据日常实际需要，一方面需要在系统中实现基础信息的管理，同时还需要结合实际情况的需要，提供图书信息管理功能，方便图书管理工作的展开，综合考虑，本套系统应该满足如下要求： 首先，在…
UNIAPP(小程序)每十个文章中间一个广告
三十秒刷新一次广告 ad-intervals"30"
<template><view style"margin: 30rpx;"><view class"" v-for"(item,index) in 100"><!-- 广告 --><view style"margin-bottom: 20rpx;" v-if"(inde…
uni-app调用苹果登录,并获取用户信息
效果 模块配置 dev中的配置
需要开启登录的权限，然后重新下载配置文件，发布打包基座，再运行程序
代码
<button click"appleLogin">苹果登录</button>function appleLogin() {uni.login({provider: apple,success: …
uni-app如何实现高性能
这篇文章主要讲解uni-app如何实现高性能的问题？
什么是uni-app？
简单说一下什么是uni-app，uni-app是继承自vue.js，对vue做了轻度定制，并且实现了完整的组件化开发，并且支持多端发布的一种架构，…
如何实现小程序滑动删除组件+全选批量删除组件
如何实现小程序滑动删除组件全选批量删除组件
一、简介
如何实现小程序滑动删除组件全选批量删除组件
采用 uni-app 实现，可以适用微信小程序、其他各种小程序以及 APP、Web等多个平台
具体实现步骤如下：
下载开发者工具 HbuilderX进入 【Dcloud 插…
uniApp使用XR-Frame创建3D场景(7)加入点击交互
上篇文章讲述了如何将XR-Frame作为子组件集成到uniApp中使用
这篇我们讲解如何与场景中的模型交互（点击识别）
先看源码 <xr-scene render-system"alpha:true" bind:ready"handleReady"><xr-node><xr-mesh id"…
uniApp使用XR-Frame创建3D场景(6)播放模型动画
上篇文章讲述了如何将XR-Frame作为子组件集成到uniApp中使用
这篇我们讲解播放模型动画
先看源码 <xr-scene render-system"alpha:true" bind:ready"handleReady">
<xr-node visible"{{sec6}}"><xr-light type"ambient&qu…
uniapp 微信小程序 canvas 手写板文字重复倾斜水印
核心逻辑
先将坐标系中心点通过ctx.translate(canvasw / 2, canvash / 2) 平移到canvas 中心，再旋转设置水印
假如不 translate 直接旋转，则此时的旋转中心为左上角原点，此时旋转示意如图所示 当translate到中心点之后再旋转，此…
【自用】uniapp全局统一样式scss管理
【自用】uniapp全局统一样式scss管理
uniapp移动端全局common.scss样式统一类名管理 page {background: #F7F7F7;
}view {box-sizing: border-box;
}.b-btn {width: 640rpx;height: 92rpx;background: linear-gradient(141deg, #3167F1 0%, #31A1F1 100%);border-radius: 100r…
uniApp使用XR-Frame创建3D场景(4)金属度和粗糙度
上一篇讲解了如何在uniApp中创建xr-frame子组件并创建简单的3D场景。
这一篇我们讲解xr-frame中关于mesh网格材质的金属度和粗糙度的设置。
1.先看源码 <xr-scene render-system"alpha:true" bind:ready"handleReady">
<xr-node visible"{…
踩坑uniapp中打包Andiord app，在真机调试时地图以及定位功能可以正常使用，打包成app后失效的问题
首先看到这是uni官网提出的，app上建议使用高德地图。 下面就用高德地图进行配置。
步骤一：登陆高德地图控制台 名称和类型根据自己情况填写选择即可 步骤二： 添加key 步骤三：取到SHA1
进入uniapp开发官网
点击应用名称&#…
美食分享（源码+文档）
美食分享系统（小程序、ios、安卓都可部署） 文件包含内容程序简要说明含有功能项目截图客户端主页注册界面美食详细及教程界面搜索菜谱分类美食制作上传我的资料登录界面 管理端登录界面关键词管理用户管理分类管理历史管理菜谱管理 文件包含内容
1、搭建…
uniapp开发微信小程序设置分包，简单易学
文章目录 前言一、在 manifest.json文件中的源码试图中配置二、配置pages.json 前言
我们使用uniapp开发微信小程序的时候，当我们的包体积过大的时候，无法真机模拟。 因为小程序单个包只支持2MB（现已支持预览4MB），所以…
校园跑腿（源码+文档）
校园跑腿管理系统（小程序、ios、安卓都可部署） 文件包含内容程序简要说明含有功能项目截图客户端店铺代购用户条款隐私协议租借服务行李代搬拨打客服电话注册界面我的界面申请骑手登录界面快递带取资料修改快递代寄主页万能帮 管理端代购管理添加用户订单…
汽车租赁(源码+文档)
汽车租赁（小程序、ios、安卓都可部署） 文件包含内容程序简要说明含有功能项目截图客户端登录界面首页订单个人信息我的界面新手指引注册界面车型选择支付界面修改信息 管理端用户管理订单管理分类管理 文件包含内容
1、搭建视频 2、流程图 3、开题报告 …
uniapp h5 touch事件踩坑记录
场景：悬浮球功能
当我给悬浮球设置了 position: fixed; 然后监听悬浮球的touch事件，从事件对象中拿到clientY和clientX赋值给悬浮球的left和top属性。当直接赋值后效果应该是这样子： 注意鼠标相对悬浮球的位置，应该就是左上角&a…
uniapp开发App（二）开通 微信授权登录功能（应用签名、证书、包名 全明白）
前言：开发App肯定要包含登陆，常用登陆方式很多，我选择微信登陆。
一、如何获得微信的授权登陆
答：申请，根据uniapp官网的提示有如下三个步骤 开通 1. 登录微信开放平台区，添加移动应用并提交审核…
uniapp写小程序如何实现分包
众所众知小程序上传的过程中对包的大小有限制，正常情况下不允许当个包超过2M，所以需要分包 需要再pages.json这个文件夹中进行配置
"pages": [{"path": "pages/index/index","style": {"navigationBarTit…
家庭记账本(源码+文档)
家庭记账本系统（小程序、ios、安卓都可部署） 文件包含内容程序简要说明含有功能项目截图客户端我的界面图表明细添加账单登录页明细注册页个人资料 后台管理用户管理后台登录页分类管理 文件包含内容
1、搭建视频 2、流程图 3、开题报告 4、数据库 5、参…
【uniapp】Vue3移动端滚动加载 分页组件的封装
今天用uniapp开发时想用vue3的组合式函数封装一个分页组件，如果是vue2自然就是用mixin了，因为组合式函数更灵活简洁，而且现在也写习惯了，还是决定封装一个vue3版的。 思路：
因为uniapp特有的对一些小程序生命周期的支…
基于Uni-app的体育场馆预约系统的设计与实现
文章目录 基于Uni-app的体育场馆预约系统的设计与实现1、前言介绍2、开发技术简介3、系统功能图3、功能实现4、库表设计5、关键代码6、源码获取7、 🎉写在最后 基于Uni-app的体育场馆预约系统的设计与实现
1、前言介绍 伴随着信息技术与互联网技术的不断发展&#…
uniapp uni.scss中使用@mixin混入，在文件引入@include 样式不生效 Error: Undefined mixin.（踩坑记录一）
问题：
在uni.scss文件定义mixin 2. 在vue文件引入: 3. 出现报错信息: 4. 问题思考： 是不是需要引入uni.scss ？ 答案不需要 uni.scss是一个特殊文件，在代码中无需 import 这个文件即可在scss代码中使用这里的样式变量。uni-app的…
uniapp和vue的区别？
Uni-app 和 Vue 是两个不同的概念，它们之间的关系可以简单描述为： Vue： Vue.js 是一个流行的前端 JavaScript 框架，用于构建用户界面和单页面应用。Vue 具有简洁的语法、响应式数据绑定和组件化的特性，使得开发者可以更…
uniapp小程序路由跳转，使用uni.navigateBack方法，实现页面返回上一页
在小程序中uni.navigateTo和uni.redirectTo是通过路由拼接的方式传参
uni.navigateTo({url: test?id1&nameuniapp
});uni.redirectTo({url: test?id1
});uni.navigateBack() 是一个用于在uni-app中进行页面后退操作的API。它可以让你返回到上一个页面。在给定的示例中&a…
uni-app左上角退出，嵌套iframe退出异常问题
1. 问题分析 <v-linktag"div"v-if"symbol":to"{ path: /pages/exchange/index, query: { code: symbol} }"
>
</v-link>
uni-app使用 :to 跳转的页面中内嵌了一个iframe，如果iframe页面内进行了点击跳转，…
uni-app（使用阿里图标）
1.注册阿里矢量图标库
注册阿里图标库账号并登录，https://www.iconfont.cn/
2.加入购物车
搜索适合自己的图标，加入购物车，如下图： 3.加入项目
我的->资源管理->我的项目->创建项目，然后返回购物车&#…
django+uniapp校园失物招领系统e5asg 微信小程序python
本失物招领小程序，使用的是比较成熟的python语言和比较完善的MySQL数据库，将网络失物招领小程序信息管理系统可以更安全、技术性更强的满足网站所有信息的管理。 失物招领小程序主要实现了管理员服务端模块、学生微信端模块二大部分。通过本失物招领小程…
圈子小程序源码-圈子系统成品搭建-APP小程序H5三端源码交付，支持二开！PHP书写，uniAPP后端开发！
【首页】
圈子列表页可分为个人圈子、企业圈子、加入圈子、智诚工业圈子 (平台圈) 四种。
其中重要圈子可选择置顶，方便快速进入:个人圈子和企业圈子数量有限始终位于前位。也可通过搜索快速搜索圈子。
为了实现流量分散入口的集中，将创建企业圈子、发…
uni app 扫雷
闲来无聊。做个扫雷玩玩吧，点击打开，长按标记，标记的点击两次或长按取消标记。所有打开结束
<template><view class"page_main"><view class"add_button" style"width: 100vw; margin-bottom: 20r…
uniapp 小程序和app map地图上显示多个酷炫动态的标点，头像后端传过来，真机测试有效
展示效果 二、引入地图
如果需要搜索需要去腾讯地图官网上看文档，找到对应的内容 1.申请开发者密钥（key）：申请密钥
2.开通webserviceAPI服务：控制台 ->应用管理 -> 我的应用 ->添加key-> 勾选WebService…
农业信息管理（源码+文档）
农业信息管理系统（小程序、ios、安卓都可部署） 文件包含内容程序简要说明功能项目截图客户端首页我的今日动态动态详情登录修改资料今日价格今日报价注册页 后端管理文章管理用户管理分类管理 文件包含内容
1、搭建视频 2、流程图 3、开题报告 4、数据库…
SpringBoot+uniApp宠物领养小程序系统 附带详细运行指导视频
文章目录 一、项目演示二、项目介绍三、运行截图四、主要代码1.保存宠物信息代码2.提交订单信息代码3.查询评论信息代码 一、项目演示
项目演示地址： 视频地址
二、项目介绍
项目描述：这是一个基于SpringBootuniApp框架开发的宠物领养微信小程序系统。…
uniapp 开发之原生Android插件
开发须知
在您阅读此文档时，我们假定您已经具备了相应Android应用开发经验，使用Android Studio开发过Android原生。也应该对HTML,JavaScript,CSS等有一定的了解, 并且熟悉在JavaScript和JAVA环境下的JSON格式数据操作等。
为了插件开发者更方便快捷的开…
uniapp页面怎么传参？
在uni-app中，页面之间传递参数可以通过 URL 参数、Vuex 状态管理、本地存储等方式实现。以下是一些常见的方法：
URL 参数：你可以在跳转到目标页面时，在 URL 中附加参数，然后在目标页面通过 this.$route.query 获取参数…
纯分享万岳外卖跑腿系统客户端源码uniapp目录结构示意图
系统买的是商业版，使用非常不错有三端uniapp开源代码，自从上次分享uniapp后有些网友让我分享下各个端的uniapp下的各个目录结构说明 我就截图说以下吧，
uniapp 微信小程序 前端登录流程
步骤：
1. 从uniapp button 中通过 getphonenumber 获取 encryptedData、iv
2. 调用 uni.login() 获取 wx code，然后用wx code 获取session_key、unionid 等信息（老用户直接用union_id调后端登录接口即可，新用户需进行加密解密获…
记录一次报错提示npx update-browserslist-db@latest
1，定位文件夹位置 找到HBuilderX的安装目录, cmd切换到HBuilderX/plugins/uniapp-cli下 删除node_modules以及package-lock.json 在当前目录执行npm install 重新打开HBuilderX运行 2， 删除后，再次通过hbuilderX启动微信小程序，会…
uniapp 微信小程序 输入框跟随手机键盘弹起
需求：手机键盘弹起后，页面底部的输入框跟随弹起，且页面不被顶上去 html: <textareaclass"textinput"placeholder-class"input-place"auto-height:maxlength"2000"v-model"text"placeholder"…
uniapp实现列表动态添加
1.效果图： 2.代码实现：
这里没有用uniapp提供的uni-list控件
<template> <view id"app"> <!-- 这里为了让标题（h）居中展示，给h标签设置了父标签，并设置父标签text-…
uniapp实现的数据选择器，支持H5、微信小程序
采用uniapp-vue3实现的数据选择器，支持H5、微信小程序（其他小程序未测试过，可自行尝试） 支持本地自定义过滤、远程接口过滤，为了避免弹窗面板超出边界的情况，自动计算弹窗面板安置的位置（在微信…
婚恋交友APP小程序H5源码交付-支持二开！实名制交友，可服务器审核，亦可后台自己审核！同城交友，多人语音！
一、需求分析
在征婚交友网站开发初期，需求分析是至关重要的环节。这需要深入了解目标用户的需求和期望，包括他们的年龄、职业、兴趣爱好、交友条件等方面。通过收集和分析这些信息，开发团队可以明确网站的目标用户，并为他们提供…
uniapp中安装vant2
1.uniapp项目搭建
因为是安装vant2所以项目选择vue2，如果vue3项目的话安装vant3 2.安装vant
npm i vantlatest-v2
3.在main.js文件引入挂载vant
说明：// #ifndef VUE3这里是vue2模板用来挂载注册组件的地方；// #ifdef VUE3这里是vue3模板…
niushop单商户V5多店版源码分享三端uniapp打包方法包括PC端_小程序或h5端打包_收银端打包_APP端打包_商户端
目前多店版有四端uniapp，包括PC端uniapp，商家端uniapp，收银端uniapp，门店手机端uniapp，下面我总结下这些端的打包流程希望能帮助到大家，需要交流的可以看我昵称或者点我头像关注我分享代码和教程
一.niush…
使用uni-app开发微信小程序并实现页面间的跳转
一、下载需要的开发工具 HBuilderX 微信开发者工具
HBuilderX
HBuilderX-高效极客技巧 (dcloud.io) 微信开发者工具
下载 / 开发版更新日志 (qq.com) 二、新建项目
通过vue-cli命令行创建项目
参考：
uni-app官网 (dcloud.net.cn)
2.1全局安装 vue-cli
npm i…
uniapp-打包IOS的APP流程
打包前所需配置 在manifest文件内配置 1. APP图标 2. 启动界面 有三种启动界面配置 第一种是 HBuilderX 官方给的通用启动界面，页面单一，屏幕中间就一个圆框图标 第二种是自定义的启动图，无法通过AppStore的审核 第三种是自定义storyboard启动…
微信小程序uniapp+vue3+ts+pinia的环境搭建
一.创建uniapp项目
通过vue-cli创建
npx degit dcloudio/uni-preset-vue#vite-ts my-vue3-project二.安装依赖：
1.pnpm i
2.运行项目：
将package.json的 "dev:mp-weixin": "uni -p mp-weixin",改为 "serve": "u…
uniapp对接极光推送(国内版以及海外版)
勾选push，但不要勾选unipush
国内版
网址：极光推送-快速集成消息推送功能,提升APP运营效率 (jiguang.cn)
进入后台，并选择对应应用开始配置 配置安卓包名 以及ios推送证书，是否将生产证书用于开发环境选择是 ios推送证书…
uniapp中怎么引入echarts(最简单)
目录 引言
echarts.vue 文件代码
echarts-config 文件代码
在需要引入echarts图表的页面(.vue)中进行导入该文件(echarts.vue)
使用该组件(echarts) 引言
在uniapp中需要引入echarts时的时候,需要引入两个配置文件.分别是 echarts.vue 以及 echarts-config 放在你项目中…
全栈的自我修养 ———— uniapp中封装api请求
api
import request from /tools/request
export function login(loginMessage) {return request({url: /login,data: loginMessage,loading: true})
}request
// request
const urlArr {DEV: http://localhost:6060, // 开发PRO: https://域名:6060, // 生产
}let BASEURL …
CSS3 Transform变形理解与应用
Transform：对元素进行变形； Transition：对元素某个属性或多个属性的变化，进行控制（时间等），类似flash的补间动画。但只有两个关键贞。开始，结束。 Animation：对元素某个属…
uniapp 小程序发布体验版 http://198.18.0.1:7001 不在以下 request 合法域名列表中（踩坑记录二）
问题一： 小程序发布体验版时出现报错信息：
http://198.18.0.1:7001 不在以下 request 合法域名列表中无法连接uniCloud本地调试服务，请检查当前客户端是否与主机在同一局域网下
解决方案： 请务必在HBuilderX内使用【发行】菜单打…
hbuilderX创建的uniapp项目转移到vscode
场景：一直使用hbuilderX开发的朋友想转移到vscode获取更好的TypeScript支持，所以想把整个项目目录拖到vscode进行开发，但发现运行不了，提示没有package.json等，并且不能执行pnpm命令
首先，我们先来看一下h…
WebView的使用与后退键处理
在 Uniapp 中使用 web-view 组件来加载 H5 页面时，对于后退键的处理是一个常见需求，即用户按下手机上的物理返回键时，期望能够返回上一个 H5 页面而不是直接退出应用。为实现这一功能，Uniapp 提供了相应的API和配置项。
通常情况…
uniapp:Hbuilder没有检测到设备请插入设备或启动模拟器的问题解决
问题
使用模拟器调试运行项目时，出现以下提示，“没有检测到设备，请插入设备或启动模拟器后点击刷新再试”。排查了一天最终找到原因。 解决
已确认模拟器是已经正常启动，并且Hbuilder设置中的adb路径和端口都配置没有问题&#…
阿基米德签证管理系统源码正式发布啦，基于thinkphp8.0+element-plus+uni-app
太棒了！太棒了！太棒了!
阿基米德签证系统的上线将为签证申请流程带来更高效和便利。
为什么选择阿基米德软件？
专注于行业垂直细分领域 / 专业级系统软件开发服务商 一、用户前端支持小程序、H5、PC和APP等主流流量端口 这样可以覆盖更广泛…
水果销售(源码+文档)
水果销售管理系统（小程序、ios、安卓都可部署） 文件包含内容程序简要说明含有功能项目截图客户端添加地址首页商品详细意见反馈待发货商品分类我的代付款我的地址搜索防骗指南资料修改登录注册 后端管理分类管理反馈管理订单管理商品管理用户管理 文件包…
uniapp Android 开发手机模拟器调试接口出现 Failed to connect to localhost/127.0.0.1:9999
{“errMsg”:“request:fail abort statusCode:-1 Failed to connect to localhost/127.0.0.1:9999”} 原因：使用模拟器或者手机调用API接口，首先保证在同一局域网，然后要使用 IPV4 的 IP 地址。 打开 cmd 输入 ipconfig 查看 ip 地址 替换代…
影院座位选择简易实现（uniapp）
界面展示
主要使用到uniap中的movable-area，和movable-view组件实现。 代码逻辑分析
1、使用movable-area和movea-view组件，用于座位展示
<div class"ui-seat__box"><movable-area class"ui-movableArea"><movab…
uniapp使用npm命令引入font-awesome图标库最新版本
uniapp使用npm命令引入font-awesome图标库最新版本
图标库网址：https://fontawesome.com/search?qtools&or 命令行：
引入
npm i fortawesome/fontawesome-free
查看版本
npm list fortawesome在main.js文件中：
import fortawesome/fo…
uniapp中uni.navigateTo传递变量
效果展示： 核心代码：
uniapp中uni.navigateTo传递变量 methods: {changePages(item) {setDatas("maintenanceFunName", JSON.stringify(item)).then((res) > {uni.navigateTo({url: /pages/PMS/maintenance/maintenanceTypes/maintenanceT…
uniapp - 微信小程序 - 使用uCharts的一些问题
文章目录 uniapp - 微信小程序 - 使用uCharts的一些问题一、开发者工具显示正常，真机调试统计图不随页面滚动二、数据过多开启滚动条，无法滑动滚动条三、饼图点击不显示提示窗/点击位置bug、多个同类型统计图点击不显示提示框问题四、 formatter 自定义 …
js,uniapp,vue,小写数字转化为大写
应用场景：
把1、2、3，转为一、二、三
方法： retBigSrt(num) {const changeNum [零, 一, 二, 三, 四, 五, 六, 七, 八, 九]const unit [, 十, 百]num parseInt(num)const getWan (temp) > {const strArr temp.toString().split().re…
uniApp移动端安卓中使用webview打开pdf文件是下载而不是预览解决方案
关键 使用到 pdf.js
第一步：
下载pdf.js 文件到项目根目录
也就是这个文件 附下载地址：uni-app-pdf: 在uni-app中使用pdf.js实现在手机上打开pdf 也可通过其他方法下载 如npm
第二步：
拷贝hybrid文件到项目根目录
第三步：…
约跑小程序源码(asp.net+vue+element++uniapp+sqlserver)
开发语言：c# 框架：后端 asp.net mvc pc管理页面：vueelement 数据库：sqlserver 开发软件：eclipse/myeclipse/idea 浏览器：谷歌浏览器 小程序框架：uniapp 小程序开发软件：HBuilder X
…
uni-app + vue3实现input输入框保留2位小数的逻辑
首先说明输入框中的格式限制如下：
（1）当第一位为0时，第二位只能输入小数点，且不能输入其他数字（如00）
（2）当第一位不为0时，后边不限制
（3&…
uniapp使用npm命令引入font-awesome图标库最新版本并解决APP和小程序不显示图标的问题
uniapp使用npm命令引入font-awesome图标库最新版本
图标库网址：https://fontawesome.com/search?qtools&or 命令行：
引入
npm i fortawesome/fontawesome-free
查看版本
npm list fortawesome在main.js文件中：
import fortawesome/fo…
uniapp小程序下载并导出excel
<button click"confirmExport">导出excel</button>confirmExport() {let header {"X-Access-Token": uni.getStorageSync(ACCESS_TOKEN), //自定义请求头信息} let url "http"/......"; // 后端API地址uni.request({url: ur…
小剧场短剧剧集收费短剧小程序APP
1. 内容展现
付费、免费、任务解锁：用户可以通过付费直接观看短剧，也可以通过完成平台任务（如签到、分享等）获得免费观看的机会。这种灵活的解锁方式既满足了用户的多种需求，也促进了平台的活跃度。主流展现形式&…
【uniapp】多端打包（h5...)
1. h5
HBuilder X -> 项目目录中manifest.json 发行 查看打包文件（用浏览器打开就行了）或者直接运行在浏览器中
医院预约系统微信小程序APP前后端
医院预约系统具体功能介绍：展示信息、可以注册和登录， 预约（包含各个科室的预约，可以预约每个各个医生），就诊引导包含预约的具体信息，包含就诊时间、就诊科室、就诊医生以及就诊人信息、和支付状…
UniApp+uView实现图片上传返回Base64
UniAppuView实现图片上传后的二进制文件转换成Base64格式并进行双向绑定。 unaipp由于兼容了多平台，但多平台对base64转化是不一样的。
微信小程序端
uni.getFileSystemManager().readFile({ filePath: path, // 要读取的文件路径 …
uniapp 卡片勾选
前言
公司的app项目使用的uniapp，项目里有一个可勾选的卡片功能，效果图如下： 找了一圈没找到什么太好的组件，于是就自己简单写了一个，记录一下。避免以后还会用到
代码
<template><view class"card-…
uniapp_微信小程序_NaN
一、定义
isNaN() 函数用于检查一个值是否为 NaN。它接受一个参数，该参数可以是任何 JavaScript 数据类型，包括数字、字符串、对象等。如果参数是 NaN，或者不能被转换为数字，则 isNaN() 返回 true；否则返回 false。
…
uniapp小程序中使用video视频播放卡顿
问题:在使用uniapp小程序的video视频播放,视频已经在播放了,但是进度条没走,还是卡顿的状态(测试ios能正常使用,安卓手机会出现此问题) 在网上找了很多方法,最多的说是用:custom-cache"false",试了并没有效果,看来和我问题不一样,后来用了个简单粗暴的方法,发现是有效…
uniapp小程序给指定的页面新增下拉刷新功能
需求:有些页面需要实时更新数据,但是又不能做实时刷新,所以给用户一个手动下拉刷新指定接口的功能 第一步:在pages.json给页面加"enablePullDownRefresh": true配置 第二步:在指定页面写onPullDownRefresh方法,和methods同级
onPullDownRefresh() {//加个定时器1秒…
uniapp：uview-plus的一些记录
customStyle
并不是所有的组件都有customStyle属性来设置自定义属性，有的还是需要通过::v-deep来修改内置样式
form表单
labelStyle
需要的是一个对象
:labelStyle"{color: #333333,fontSize: 32rpx,fontWeight: 500}"dateTimePicker选择器设置默认值…
uniapp开发小程序，通过缓存的方式，判断页面只弹出一次弹窗通知
一、需求
在使用uniapp开发小程序时，在【个人中心页面】-点击【我的推广】按钮进入详情页面时，要求出现【会员协议通知】的弹窗，并且有【确认和取消】两个按钮， 如果点了【取消】按钮，直接退出该页面，并且…
SpringBoot3 + uniapp 对接 阿里云0SS 实现上传图片视频到 0SS 以及 0SS 里删除图片视频的操作（最新）
SpringBoot3 uniapp 对接 阿里云0SS 实现上传图片视频到 0SS 以及 0SS 里删除图片视频的操作 最终效果图uniapp 的源码UpLoadFile.vuedeleteOssFile.jshttp.js SpringBoot3 的源码FileUploadController.javaAliOssUtil.java 最终效果图 uniapp 的源码
UpLoadFile.vue <tem…
uniapp小程序编译报错
说明
微信小程序编译每次都出现[ project.config.json 文件内容错误] project.config.json: libVersion 字段需为 string,
解决
找到manifest.json文件 添加："libVersion": "latest"，重新编译即可。
uniapp区分app、h5、小程序
APP端
标签内
<!-- #ifdef APP-PLUS --><view> APP端 </view>
<!-- #endif -->
JSCSS内
/*#ifdef APP-PLUS*/console.log(APP端)
/*#endif*/
H5端
标签内
<!-- #ifdef H5 --><view> H5端 </view>
<!-- #endif -->
JSC…
uniapp实现文件和图片选择上传功能实现
主要介绍了uni-file-picker文件选择上传,本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下
上传一张：
<template><view class="container example"><uni-forms ref="baseForm" …
uniapp开发h5端使用video播放mp4格式视频黑屏，但有音频播放解决方案
mp4格式视频有一些谷歌播放视频黑屏，搜狗浏览器可以正常播放
可能和视频的编码格式有关，谷歌只支持h.264编码格式的视频播放
将mp4编码格式修改为h.264即可
转换方法：
如果是自己手动上传文件可以手动转换
如果是后端接口调取的地址就需…
uni-app实现分页--（1）准备工作，首页下拉触底加载更多
实现流程如下:
分析：需要在滚动容器中添加滚动触底，在猜你喜欢中获取数据。难点：如何在父页面调用子组件内的方法。父组件中用ref，并定义组件实例类型，子组件中暴露方法
具体代码如下：
1.在父组件中添加…
uniapp中页面滚动锚点位置及滚动到对应高度显示对应按钮
可以把页面代码和组件代码放自己项目里跑一下
页面代码
<template><view class"Tracing-detail"><view class"title" v-for"i in 30">顶部信息</view><!-- tab按钮 --><Tab v-model"activeIndex" …
基于uni-app的埋点sdk设计
一、统计app激活状态
在App.vue 中 利用onShow生命周期验证 或者操作
onShow: function () {
uni.showToast({
title: onShow
})
},
二、页面级别的统计 （进入页面、停留时长、手机系统信息、网络状态、页面路径、标题）
需要收集的数据
{
&quo…
领鸡蛋游戏养鸡游戏淘宝客源码广告联盟
用户中心 用户信息：显示用户名、头像、鸡蛋数量、足迹等基本信息。我的足迹：展示用户的饲料获取记录明细，包括来源、数量和时间。我的好友：展示邀请的好友列表，支持好友间互动，如串门、偷取/赠送饲料&#…
【uniapp】开发微信小程序 — 注意事项
底部导航栏 (tabBar) 图标的正确做法： 1、图片的标准尺寸为 81px * 81px，该尺寸在官方的文档中有明确的说明，可以参考微信小程序全局配置文档中对 iconPath 属性的说明。 2、为了保持良好的间距，图片的内容区域设置 60px* 比较好&…
uniapp项目问题及解决（前后端互联）
1.路由跳转的问题
uni.navigateTo（） 保留当前页面，跳转到应用内的某个页面，使用uni.navigateBack可以返回到原页面
uni.redirectTo（）
关闭当前页面，跳转到应用内的某个页面。
uni.reLaunch&…
uni-app（H5）论坛 | 社区 表情选择 UI组件
项目源码请移步：bbs 效果 实现思路 表情切换
人物、动物、小黄人不同表情之间的切换实际就是组件的切换
emoji表情
emoji表情本身就是一种字符 如需其他emoji表情可参考 EmojiAll中文官方网站
需要注意的就是数据库的存储格式需要支持emoji表情，我项…
uniapp如何配置后使用uni.chooseLocation等地图位置api
在uniapp中想要使用uni.getLocation、uni.chooseLocation ……api的时候我们需要在小程序就开启配置，不然无法使用。
第一步：首先找到manifest.json
第二步：点击源码视图
第三步：在 mp-weixin 加入下面代码
"permission&…
uniapp请求后端接口
新建文件夹utils
const request (config) > {// 拼接完整的接口路径config.url http://mm.test.cn config.url;//这里拼接的是访问后端接口的地址，http://mm.test.cn/prod-api/testconsole.log(config.url)//判断是都携带参数if(!config.data){config.data …
【uniapp】个推H5号码认证一键登录（附代码）
前言
最近在做APP、h5产品，登陆注册成了难题。邮箱验证多数人不会使用，还是短信方便点，短信可以采用号码认证和验证码的方式，前者稍微便宜的，关于性价比和上手程度我推荐个推， 于是有了今天这篇案例记录&a…
uni-app + vue3实现input输入框保留2位小数的2种方案
首先说明输入框中的格式限制如下：
（1）当第一位为0时，第二位只能输入小数点，且不能输入其他数字（如00）
（2）当第一位不为0时，后边不限制
（3&…
uniapp 密码框的眼睛
效果展示： uniapp input 官网链接：链接 按照官方文档，uni-icon出不来。
通过自己的方法解决了，解决方案如下：
代码： <uni-forms-item name"password"><inputclass"uni-input&quo…
uniapp引入微信小程序版本VantUI，使用VantUI的自定义tabbar，并解决自定义tabbar出现闪烁的情况
视频教程地址：https://www.bilibili.com/video/BV13m41167iG
1.uniapp引入微信小程序版本VantUI
去vant官网下载源码，源码放在github，自行去下载下来 https://vant-contrib.gitee.io/vant-weapp/#/home 在pages.json的globalStyle里面注册组…
uniapp开发h5页面的扫码功能(html5-qrcode和mumu-getQrcode两种方式)
说明 只支持https域名 只支持https域名 只支持https域名 因为uniapp自带的api不支持h5，而且非微信环境也无法使用公众号jsjdk的扫码，只能尝试其他方法 但是发现只能https域名才可以调用，其他所有人的都不许http域名。 开发调试记得去把这两个…
可以在uni-app使用的类vconsole.js插件
兴致勃勃在uni-app项目引入调试工具vconsole.js结果真机调试页面空白 怎么办?! 别着急 paradox老师有方法
替代插件下载地址：直接下载插件并引入HbuilderXuni_modules插件 - 类Vconsole APP端调试工具 - HF调试器 - DCloud 插件市场 下载完成在main.js中引入&…
![[uniapp] scroll-view 简单实现 u-tabbar效果](https://img-blog.csdnimg.cn/db1a990f5a4f4e8ebfd214b385f17c3b.png)
[uniapp] scroll-view 简单实现 u-tabbar效果
文章目录 方案踩坑1.scroll-view 横向失败2.点击item不滚动?3. scrollLeft从哪里来? 效果图 方案
官方scroll-view 进行封装
配合属性 scroll-left Number/String 设置横向滚动条位置 即可
scroll-into-view 属性尝试过,方案较难实现
踩坑
1.scroll-view 横向失败
安装…
uniapp：谷歌地图，实现地图展示，搜索功能，H5导航
页面展示 APP H5
谷歌地图功能记录，谷歌key申请相对复杂一些，主要需要一些国外的身份信息。 1、申请谷歌key 以下是申请谷歌地图 API 密钥的流程教程： 登录谷歌开发者控制台：打开浏览器，访问 Google Cloud Platform Console。
1、创建或选择项目：如果你还没有创建项目…
uniapp怎么动态渲染导航栏的title?
直接在接口请求里面写入以下：
自己要什么参数就写什么参数 本人仅供参考：
this.name res.data.data[i].name;
console.log(名字, res.data.data[i].name);
uni.setNavigationBarTitle({title: this.name})
效果：
HBuilder创建uniapp默认项目导入uview（胎教）
1：更新HBuilder
建议更新
2：更新插件
我本人在没有更新插件的情况下报错了，找到了**这个大佬**解决问题，所以建议更新插件
先卸载uni-app（Vue2）编译
再重新安装 uni-app（Vue2）…
uniapp 跳转外部链接web-view
<web-view :src"url" :progress"true"></web-view>
data() {return {url: ,
}
},
onLoad(options) {this.url options.url
},
备注：nvue 使用需要手动指定宽高
uni-app 金额格式化
普通过滤器(filter)在当前页面定义，复制红色代码即可
<template> <view> <text >{{balance|money}}</text> </view> </template>
<script> export default{ data(){ return{ …
uni-app一键复制到剪切板，无需插件
<template><text click"copyBtn()">复制</text>
</template>
export default{methods:{copyBtn: function() {uni.setClipboardData({data: 需要复制的内容 ,success: function () {uni.showToast({title: 复制成功,});},fail:function () …
uni-app【多媒体API】
多媒体API图片uni.chooseImage(OBJECT)uni.previewImage(OBJECT) unipreviewimageobjectuni.closePreviewImage(OBJECT)uni.getImageInfo(OBJECT)uni.saveImageToPhotosAlbum(OBJECT)uni.compressImage(OBJECT)文件uni.chooseFile(OBJECT)wx.chooseMessageFile(OBJECT)录音管理…
uni-app之uni-ui
uni-ui
uni-ui
uni ui支持HBuilderX直接新建项目模板、npm安装和单独导入个别组件等多种使用方式。
1.使用方法
1.单独导入个别组件
进入到单个组件的页面，然后直接选择使用HBuilderX导入插件即可，如果导入不成功那么下载插件zip安装包解压后放到项…
uni-app 点击蒙版层时关闭自定义弹窗
click.stop：用于阻止冒泡
click.stop 标签范围内，点击任何区域(包括 click 点击事件)都不会关闭弹窗。标签范围外会关闭弹窗
click.stop 标签内的 click 等事件：如果事件内有关闭弹窗的代码可关闭弹窗
在 template 中
<view class&quo…
uniapp：分享一个自定义侧滑样例
首先看html,分为两部分，主体内容部分和功能部分，功能部分在css中定位到主体部分的右边
<view class"section" ref"box_center" touchstart"drawStart" touchmove"drawMove($event)"touchend"drawEnd($…
uniapp中数字增长动画
好的，在 uniapp 中实现数字增长动画可以使用 uniapp 的一些动画相关的 API 来实现。 首先，你需要在页面的 data 中定义一个变量来保存数字的值，比如： data: {num: 0
}然后，在页面的 template 中使用这个变量来显示数字…
使用HbuilderX3.8.3_把开发的小程序发布为Html5页面上传到_免费托管空间---uniapp_小程序开发工作笔记009
首先使用hbuider开发完程序,然后,再去,点击发型,然后选择 上传网站到服务器,然后选择 选择新建,然后点击 新建以后然后这里点击新建服务空间,然后再去 这里选择免费服务空间,然后 然后点击立即购买,然后 点
uniapp视频倍速播放插件，uniapp视频试看插件——sunny-video使用文档
sunny-video视频倍速播放器 组件名：sunny-video 效果图
img1img2img3img4
平台差异说明
目前已应用到APP（安卓、iOS）、微信（小程序、H5）其它平台未测试
安装方式
本组件符合easycom规范，HBuilderX 2.5…
案例063:基于微信小程序的传染病防控宣传系统
文末获取源码 开发语言：Java 框架：springboot JDK版本：JDK1.8 数据库：mysql 5.7 开发软件：eclipse/myeclipse/idea Maven包：Maven3.5.4 小程序框架：uniapp 小程序开发软件：HBuilder …
uniapp 小程序自定义tabbar及初次加载闪屏解决方案
很惭愧，这竟然是老衲在csdn的首次内容输出，还请看官，高抬贵手，多喷两句， 反正我也不听~👀 首先声明，我是最近才刚开始写uniapp…… 言归正传，最近给公司要做一个小程序，由…
【uni-app从入门到实战】条件编译、导航学习
文章目录条件编译导航声明式导航编程式导航传参条件编译
跨端兼容介绍
条件编译是利用注释实现的，在不同语法里注释写法不一样，vue/nvue 模板里使用 <!-- 注释 -->
<template><view class"content"><!-- #ifdef H5 --…
【uni-app从入门到实战】环境搭建和配置学习
文章目录创建项目globalStyle全局外观配置pages页面配置配置基本的tabbarcondition启动模式配置创建项目
原视频地址：Uni-App从入门到实战-黑马程序员杭州校区出品
前提：需要安装 HBuilderX 和 微信开发者工具
用 HBuilderX 创建一个 uni-app 项目&am…
uniapp 动态组件 实现Tabs标签切换组件
功能描述 拿喜马拉雅app作为案例，它的tabs标签有很多，如：推荐、小说、儿童等等。用户点击小说就会切换到小说组件，如果仔细看第一次是有一个加载的过程，如果你再返回到推荐页，再次点击小说时就没有加载过程…
uniApp常见知识点-问题答案
1、uniApp中如何进行页面跳转？
答案：可以使用 uni.navigateTo、uni.redirectTo 和 uni.reLaunch 等方法进行页面跳转。其中，uni.navigateTo可以实现页面的普通跳转， uni.redirectTo可以实现页面的重定向跳转， uni.reL…
uniapp 微信小程序请求拦截器 接口封装
前言： 请求拦截器可以在我们需要传递请求头的时候使用，例如：token 也会在当token发生变化的时候给予响应，所以我们做好对应的判断即可
话不多说，直接进入正题： 1.首先在根目录创建common文件夹，…
毕业设计选题uniapp+springboot新闻资讯小程序源码 开题 lw 调试
💕💕作者：计算机源码社 💕💕个人简介：本人七年开发经验，擅长Java、Python、PHP、.NET、微信小程序、爬虫、大数据等，大家有这一块的问题可以一起交流！ 💕&…
Uniapp 生命周期
参考：uni-app关于生命周期的认识 - 简书 组件：不在page.json配置的叫组件，一般放在compoents目录
页面：在page.json配置的叫页面，一般放在pages目录 beforeCreatecreatedbeforeMountmountedbeforeUpdateupdatedbefore…
uniapp Android如何授权打开系统蓝牙Bluetooth？
uniapp Android如何授权打开系统蓝牙？ 使用uniapp开发蓝牙项目过程中，涉及到检测手机系统蓝牙是否打开功能，这里介绍Android，iOS暂时没有找到优方法。朋友们如果有好的方案，欢迎评论分享~ 文章目录 uniapp Android如何…
【bug】uniapp一键登录，自定义协议条款是否支持内部路由？
uniapp一键登录的自定义协议条款，不支持内部路由跳转 在uniapp文档上搜一键登录 加二维码之后可以提问
【uniapp】uniapp开发小程序定制uni-collapse（折叠面板）
需求
最近在做小程序，有一个类似折叠面板的ui控件，效果大概是这样
代码
因为项目使用的是uniapp，所以打算去找uniapp的扩展组件，果然给我找到了这个叫uni-collapse的组件（链接：uni-collapse）…
uniapp 输入手机号并且正则校验
1.<input input“onInput” :value“phoneNum” type“number” maxlength“11”/> 3. method里面写
onInput(e){ this.phoneNum e.detail.value },
4.调用接口时候校验正则
if (!/^1[3456789]\d{9}$/.test(this.phoneNum)) {uni.showToast({title: 请输入正确的手机号…
uniapp 移动端 后台返回数据流 查看PDF
使用步骤：
1.官网下载地址pdf.js 2.在项目的根目录新建hybrid文件夹，将下载的pdf.js压缩包解压后，复制到hybrid下的html文件夹中 3.在page文件夹下新建一个filePreview.vue页面，页面代码如下：
<template><…
uni-app打包后安卓不显示地图及相关操作详解
新公司最近用uni-app写app，之前的代码有很多问题，正好趁着改bug的时间学习下uni-app。
问题现象：
使用uni-app在浏览器调试的时候，地图是展示的，但是打包完成后，在app端是空白的。咱第一次写appÿ…
uniapp使用map标签
在UniApp中，可以使用map标签来显示地图，并通过其属性来自定义地图的样式和行为。以下是一些常用的map标签属性： id：用于给地图组件指定一个唯一的标识符，方便在代码中进行引用和操作。 style：用来设置地图…
【uni-app从入门到实战】项目创建、基本配置、首页
文章目录头部底部获取轮播图数据发送请求封装轮播图展示导航的基本结构推荐商品头部
从今天起我们来完成一个商城的项目，首先创建 uni-app 项目 uni_shop，把 pages/index/index.vue 中多余的代码删去，然后修改 pages.json
{"pages&quo…
【uni-app从入门到实战】get请求、数据缓存、图片上传预览
文章目录get请求数据缓存三个异步接口三个同步接口图片上传和预览get请求
uni-app发起请求
<button click"get">发送请求</button><script>export default {data() {return {......}},methods: {get(){uni.request({url:"https://api-hmugo…
Uni-App知识点
文章目录 一、事件总线二、什么是事件总线三、触发事件1、监听事件2、只监听一次3、移除监听4、触发事件注意事项5、代码示例6、注意事项 一、事件总线
除了父子组件传参之外，兄弟组件之间共享信息也是我们经常会遇到的。如果遇到这类问题，我们现在可以…
uniapp是否可以用elementUI等前端UI库、使用步骤以及需要注意的问题
文章目录 uniapp是否可以用elementUI等前端UI库使用方法和步骤问题如何解决 uniapp是否可以用elementUI等前端UI库
在PC端开发uniapp，可以用elementUI，因为elementUI就是PC端的。 在使用uniapp，选择vue2.0时，实测可以用nodejs16的…
uniapp h5端部分浏览器input设置disabled后点击事件失效
概述 我维护老项目时突然发现在u--input里写上disabled之后，在edge浏览器点击事件不生效(之前是可以的) 解决方法 外边包个盒子抛出点击事件 给input中加一个css属性pointer-events: none; <template><view click"handleClick"><u--inputs…
uni-app--》如何实现网上购物小程序（中下）？
🏍️作者简介：大家好，我是亦世凡华、渴望知识储备自己的一名在校大学生 🛵个人主页：亦世凡华、 🛺系列专栏：uni-app 🚲座右铭：人生亦可燃烧，亦可腐败…
uniapp（小程序）背景水印和原生html实现
uniapp
<!-- 水印 -->
<template>
<view classwater_top><canvas canvas-idwatermarkCanvas stylewidth:100%;height:100%></canvas>
</view>
</template>
<script>export default {data() {return {}},onLoad() {console…
uniapp h5页面做文本流的下载
重点：不要用框架封装的uni.request，直接使用没游封装的uni.request()进行请求数据 /*** 下载---文件* 文件流下载* */downloadFapiao(fphm) {//这里是请求路径和参数的拼接（完整请求url）config.baseUrl是API的基本路径let url co…
uni-app：查询对象中字段为可变情况的子项
如上图，数据中aaa为可变项，需要查询其子项name的值
var test aaa
var data {"no":1,"aaa": {"name":张三,"age": 20},
}
console.log(data[test].name) 定义一个变量test，其值设置为aaaÿ…
【uniapp】微信运行报错TypeError_ Cannot read property ‘FormData‘ of undefined
文章目录 一、报错详情：二、解决： 一、报错详情： 二、解决：
npm install axios0.27.2
#或者
npm install axios1.3.4
uni-app之app上传pdf类型文件
通过阅读官方文档发现，uni.chooseFile在app端不支持非媒体文件上传； 可以使用这个插件，验证过可以上传pdf；具体使用可以去看文档 插件地址 就是还是会出现相机，这个可能需要自己解决下 实现功能：上传只能上…
uni-app学习之路
uni-app 是一个使用 Vue.js 开发跨平台应用的前端框架。
开发者通过编写 Vue.js 代码，uni-app 将其编译到iOS、Android、微信小程序、H5等多个平台，保证其正确运行并达到优秀体验。
<template><view class"content"></view&…
uniapp获取日期
1.使用new Date()方法获取系统今天的日期，显示格式为：2023-10-28
<template><view class"content">{{date}}</view>
</template>
<script>export default {data() {return {date: new Date().toISOString().sl…
uniapp安卓 华为商店 vivo商店 oppo 小米 上架问题 Android中怎么才能不提前申请权限
问题描述
提交 小米 oppo 市场审核失败，原因是提前向用户申请开启通讯录、定位、短信、录音、相机和日历等权限。 解决方案：
是否有使用 READ_PHONE_STATE 权限，如果有使用 oaid 代替；是否有使用第三方 SDK，如果有关…
uniapp webview H5跳转微信小程序
第一步：manifest.json 第二步：index.html
<!DOCTYPE html>
<html lang"zh-CN"><head><meta charset"utf-8"><meta http-equiv"X-UA-Compatible" content"IEedge"><title>…
【uniapp】微信小程序 ， 海报轮播图弹窗，点击海报保存到本地，长按海报图片分享，收藏或保存
uivew 2.0 uniapp 海报画板 DCloud 插件市场
第一步，下载插件并导入HbuilderX
第二步，文件内 引入 海报组件
<template><painter ref"haibaorefs"></painter>
<template>
<script>import painter from /comp…
uni-app中使用iconfont彩色图标
uni-app中使用iconfont彩色图标 大家好，今天我们来学习一下uni-app中使用iconfont彩色图标，好好看，好好学，超详细的 第一步 首先，从iconfont官网（iconfont-阿里巴巴矢量图标库）选择自己需要的图…
uniapp中mixins的使用
mixins 是一个 js 对象，它可以包含我们组件中JS部分的任意功能选项，如：data、components、methods、created、computed 等等。我们只要将公用的功能以对象的方式传入 mixins 选项中，当组件使用 mixins 对象时所有 mixins 对象都将…
带你用uniapp从零开发一个仿小米商场_10. 首页开发
图标菜单栏开发
轮播图开发完成后,就是图标菜单栏了
可以看出这些图标都是一样的样式,所以可以勇哥flex布局让他们每个占百分之20 代码如下,既然都是一样的那就直接用个循环嵌套一下 data数据如下 同样,为了能让这段代码能在别的地方也用到,我直接把它封装成组件
<templ…
uniapp之屏幕右侧出现滚动条去掉、隐藏、删除【好用！】
目录 问题解决大佬地址最后 问题 解决
在最外层view上加上class“content”;输入以下样式。注意：两个都必须存在在生效。
.content {/* 跟屏幕高度一样高,不管view中有没有内容,都撑开屏幕高的高度 */height: 100vh; overflow: auto;
}
.content::-webkit-scrollb…
克魔助手：方便查看iPhone应用实时日志和奔溃日志工具
查看ios app运行日志
摘要
本文介绍了一款名为克魔助手的iOS应用日志查看工具，该工具可以方便地查看iPhone设备上应用和系统运行时的实时日志和奔溃日志。同时还提供了奔溃日志分析查看模块，可以对苹果奔溃日志进行符号化、格式化和分析，极…
uniapp中组件库的Radio 单选框丰富的使用方法
目录
#平台差异说明
#基本使用
#自定义形状
#禁用radio
#是否禁止点击提示语选中复选框
#自定义颜色
#横向排列形式
#横向两端排列形式
API
#Radio Props
#radioGroup Props
#radio Event
#radioGroup Event 单选框用于有一个选择，用户只能选择其中一个…
uniapp的小程序在v-for循环 的时候可以自由只显示2条数据
uniapp的小程序在v-for循环 的时候可以自由只显示2条数据
v-for"item in goods.slice(0, 4)"此时只需要在对应的集合的对象加 .slice(0, 4) 方法，其中是从0-4个对象的内容
uni-app：通过三目运算动态增加样式效果
效果 代码
第一条：当变量line的值等于abc时，class就等于yes,反之class等于no（显然等于abc，执行yes,前景色为红色）
第一条：当变量line1的值等于abc时，class就等于yes,反之class等于noÿ…
计算机毕业设计ssm+vue基本微信小程序的高速公路服务区充电桩在线预订系统 uniapp 小程序
项目介绍 随着网络技术的发展,当前人们的生活模式发生了巨大的变化,特别是以电子商务为代表的产业影响了人们的生活。当前,电子商务成为振兴国家经济的重要手段,电子商务为人们的生活提供了极大的便利,帮助企业降低销售成本,提高销售效率。高速公路服务区作为传统的实体行业,经…
Uni-app使用vant和uview组件
目录 1.安装vant组件
1.1安装前需知 1.2.安装
1.3.创建uni-app项目
2.安装uview-ui组件
2.1官网
2.2安装
2.3安装成功 1.安装vant组件
1.1安装前需知
小程序能使用vant-weapp组件，且官网的安装是直接导入小程序中，不能直接导入uni-app框架中
V…
【uniapp微信小程序】跨平台使用echarts的方案选择踩坑
一、前言
使用Uniapp（vue）开发微信小程序，想用echarts图表实现类似github热力图的效果。 简要列一些可行或不可行的方案。
二、方案对比
1. 【应用】：微信小程序原生开发
有echarts官网提供的跨平台方案：在微信小程…
在Uniapp中使用Echarts创建可视化图表
在uniapp中可以引入echarts创建数据可视化图表。
1. 安装Echarts
使用npm安装echarts插件，命令如下：
npm install echarts --save2. 引入Eharts
在需要使用Echarts的页面引入：
import *as echarts from echarts3. 创建实例
创建画布元素…
uniapp步骤(语法简单就是结合了微信小程序和vue)
uni-app 使用vue的语法小程序的标签和API。
一、开发规范
为了实现多端兼容，综合考虑编译速度、运行性能等因素，uni-app 约定了如下开发规范：
1、页面文件遵循 Vue 单文件组件 (SFC) 规范：https://vue-loader.vuejs.org/zh/…
【具体到每一步】从0制作一个uniapp的新闻类页面（界面篇）
目录
项目初始化 / 基础配置
项目创建 配置路由/页面/tabbar
pages.json配置tabbar 配置图标/静态资源
导航栏和字体颜色 scroll-view实现横向滚动条样式
公共模块定义components组件
新建组件 使用组件
组件里的结构
布局个人中心页面
组件差异化处理
数据传递
导航…
image的mode参数以及详细介绍
scaleToFill：缩放模式，不保持纵横比缩放图片，使图片的宽高完全拉伸至填满 image 元素aspectFit：缩放模式，保持纵横比缩放图片，使图片的长边能完全显示出来aspectFill：缩放模式，保持纵…
在 uniapp 项目上使用 uView UI框架
在 uniapp 项目上使用 uView UI框架 前言(废话) ---- 不看也行 刚工作不久, 公司直接给了一手新项目, 微信小程序的, 经常听到群里有小伙伴用这两套进行开发, 感觉很香, 所以决定我也用这一套整整 用 uniapp 创建uniapp容易, 结果引用 uView 的时候有点懵… 决定整一手教程, 如…
uniapp 之 uniapp app 与uniapp H5的通信 webview，以及处理H5页面的手机物理返回问题
目录 app给H5传参：通过h5地址传参app给H5传参：通过方法evalJS传参H5给app传参：通过web-view 组件的message绑定的方法处理H5页面的手机物理返回问题 APP端：
<web-view :webview-styles"webviewStyles" :src"sr…
【uni-app】uni-app获取当前环境信息
uni-app获取当前环境信 使用uniapp 的 壳嵌套vue开发的网页端项目链接，在该Vue项目中获取当前环境是否为APP或者微信小程序，对不同环境下做专属的操作 引用依赖的文件
在 web-view 加载的 HTML 中调用 uni 的 API，需要在 HTML 中引用必要的 …
使用Vue3 + Vite创建uni-app项目（Webstorm）
使用Vue3 Vite创建uni-app项目（Webstorm）
参考：前端VUE3Vite UniAPP-- 框架搭建_uniapp vite-CSDN博客 // 参考github.com的库：https://github.com/dcloudio/uni-preset-vue
npx degit dcloudio/uni-preset-vue#vite-ts vite-vu…
uniappVue3版本中组件生命周期和页面生命周期的详细介绍
一、什么是生命周期？ 生命周期有多重叫法，有叫生命周期函数的，也有叫生命周期钩子的，还有钩子函数的，其实都是代表，在 Vue 实例创建、更新和销毁的不同阶段触发的一组钩子函数，这些生命周期函数…
![[uniapp] uni-ui+vue3.2小程序评论列表组件 回复评论 点赞和删除](https://img-blog.csdnimg.cn/direct/a621fe757f96448ca37f260b46c2e355.png#pic_center)
[uniapp] uni-ui+vue3.2小程序评论列表组件 回复评论 点赞和删除
先看效果 下载地址
uni-app官方插件市场: cc-comment组件
环境
基于vue3.2和uni-ui开发; 依赖版本参考如下: "dependencies": {"dcloudio/uni-mp-weixin": "3.0.0-3090820231124001","dcloudio/uni-ui": "^1.4.28","…
uniapp中uview组件库丰富的Table 表格的使用方法
目录
#平台差异说明
#基本使用
#兼容性
#API
#Table Props
#Td Props
#Th Props 表格组件一般用于展示大量结构化数据的场景
#平台差异说明
AppH5微信小程序支付宝小程序百度小程序头条小程序QQ小程序√√√√√√√
#基本使用
本组件标签类似HTML的table表格&#…
uniapp请求封装
这里就简单记录一下吧，也做了挺长时间uniapp了，希望下次换个项目做的时候，能直接从这里拷过去用
大家都知道再uniapp中给我们提供的uni.request()来供我们发请求使用，它里面有 success、fail、complete三个回调函数，如…
uniapp 开发小程序，封装一个方法，让图片使用线上地址
1.在main.js文件中，添加以下代码： 复制使用：
// 图片使用网络地址
Vue.prototype.localImgSrc function(img){//项目的地址域名，例如百度return "https://baidu.cn/static/index/images/" img;
}2.在页面中直接使用&…
uniapp 微信小程序 锚点跳转
uniapp文档
以下是我遇到的业务场景，是点击商品分类的某一类 然后页面滚动至目标分类，
首先第一步是设置锚点跳转的目的地，在目标的dom上面添加id属性 然后给每个分类每一项添加点击事件，分类这里的item数据里面有一字段是和上…
uni-app:通过ECharts实现数据可视化-如何引入项目
效果 引入文件位置 代码
<template><view id"myChart"></view>
</template>
<script>
import echarts from /static/js/echarts.js // 引入文件
export default {mounted() {// 初始化EChartsconst myChart echarts.init(document…
uni-app中轮播图实现大图预览
参考效果
当轮播图滑动切换的时候更新自定义下标，当图片被点击的时候大图预览。
参考代码
商品详情页轮播图交互
<script setup lang"ts">
// 轮播图变化时
const currentIndex ref(0)
const onChange: UniHelper.SwiperOnChange (ev) > …
uniapp：动态修改页面标题
我们经常遇到这种情况，点击新增按钮，进入一个空白表单页面，点击修改按钮，其实也是进入这个表单页面，只是表单内容已经被数据库的记录反显了，为了区别页面，我们还需要动态设置页面的标题…
uniapp实现App弹窗更新升级（完整版）热更新
大佬网址：
https://blog.csdn.net/m0_48507640/article/details/120471420
uniapp 在uni.scss 根据@mixin定义方法 、通过@include全局使用
在官方文档中提及到uni.scss中变量的使用，而我想定义方法，这样写css样式更方便 一、官方文档的介绍
根据官方文档我知道，在这面定义的变量全局都可使用。接下来我要在这里定义方法。 二、在uni.scss文件中定义方法
我在uni.scss文件中定义了…
uniapp 创建组件
组件：用于将某个功能的 HTML、CSS、JS 封装到一个文件中，提高代码的复用性和可维护性。
创建组件
一、在根目录中创建 components 文件夹，右键点击新建组件。 二、输入组件名称、选择默认模板、点击创建组件。 三、在组件中正常编写内容即可…
解决uniapp打包过大问题的实用方法
开发者在使用uniapp开发跨平台应用时，可能会遇到打包过大的问题。过大的应用包不仅会增加用户下载和安装的成本，还会影响应用的性能和加载速度。本篇博客将介绍一些解决uniapp打包过大问题的实用方法，帮助开发者优化应用的大小和性能。
1、移…
uniapp组件和周期的知识点以及怎么使用
UniApp是一个使用Vue.js开发跨平台应用的框架，它可以将代码编译成微信小程序、支付宝小程序、H5、App等多个平台的应用。在UniApp中，组件是构建应用界面的基本单位，而生命周期则是组件在实例化、挂载、更新和销毁过程中的一系列方法。
以下是…
uniapp 单位rpx ，设计稿尺寸px处理方式
1.使用postcss-px2rpx 插件做全局的单位转换 npm install postcss-px2rpx -D npm 安装 2.postcss.config.js修改 module.exports {plugins: {postcss-px2rpx: {// 设计稿宽度，默认750designWidth: 750,// 需要转换的最小像素值，默认1pxminPixelValue: 1…
socket.d.js v2.3.4 支持“微信“、“uniapp“
Socket.D
是基于"事件"和"语义消息""流"的网络应用层协议。有用户说，“Socket.D 之于 Socket，尤如 Vue 之于 Js、Mvc 之于 Http”。支持 tcp, udp, ws, kcp 传输。协议特点可参考《官网介绍》。
Socket.D.js 兼容更新说…
uniapp 制作 wgt 包（用于 app 的热更新）
升级版本号 修改 manifest.json 的配置，应用版本名称和应用版本号 必须高于上一版的值。 制作 wgt 包 发布 wgt 包 打开 uni-admin 项目的升级中心 上传后会自动生成下载链接 app 的静默热更新 发布新版后，用户打开app，后台会自动下载 wgt…
基于uniapp的商城外卖小程序
博主主页：猫头鹰源码 博主简介：Java领域优质创作者、CSDN博客专家、公司架构师、全网粉丝5万、专注Java技术领域和毕业设计项目实战 主要内容：毕业设计(Javaweb项目|小程序等)、简历模板、学习资料、面试题库、技术咨询 文末联系获取 项目介绍…
使用UniApp实现视频数组自动下载与播放功能：一步步指导
🌷🍁 博主猫头虎 带您 Go to New World.✨🍁 🦄 博客首页——猫头虎的博客🎐 🐳《面试题大全专栏》 文章图文并茂🦕生动形象🦖简单易学！欢迎大家来踩踩~🌺 &a…
uni-app checkout（多选）radio（单选）选中之后样式不会出现钩子
前言 最近在实际开发过程中发现项目的多选和单选选中之后都是只有颜色，没有钩子，或者是另外图案 刚开始并不重视，猜测可能是微信基础库的bug，可能换个基础库就行了，或者是编辑器显示问题 最后在查阅之后才发现&#…
uview 1 uni-app表单 number digit 的输入框有初始化赋值后，但是校验失败
背景：
在onReady初始化规则 onReady() { this.$refs.uForm.setRules(this.rules); }, 同时：ref,model,rules,props都要配置好。 报错
当input框限定type为number，digit类型有初始值不做修改动作,直接提交会报错，验…
uniapp优化h5项目-摇树优化，gzip压缩和删除console.log
1.摇树优化
勾选摇树优化,打包删除死代码 2.gzip压缩和删除console.log
安装插件webpack和compression-webpack-plugin webpack插件 npm install webpack4.46.0 --save-devcompression-webpack-plugin插件
npm install compression-webpack-plugin6.1.1 --save-devconst Com…
uniapp:如何实现点击图片可以全屏展示预览
这个需要使用uniapp中的api：uni.previewImage，使用方法如下
1、html
<template><view><image src"图片路径" click"preview"></image></view>
</template>
2、JavaScript
<script>
e…
spring boot + uniapp 微信公众号 jsapi 支付
后端支付类
package com.ruoyi.coupon.payment;import com.google.gson.Gson;
import com.ruoyi.coupon.payment.dto.PayParamJsapiDto;
import com.ruoyi.coupon.payment.dto.RefundParam;
import com.ruoyi.coupon.service.ICouponConfigService;
import com.wechat.pay.jav…
uniapp x 相比于其他的开发系统框架怎么样？
首先我们要知道niapp这是一种基于Vue.js开发的跨平台应用框架，可以将同一套代码同时运行在多个平台上，包括iOS、Android、H5等。相比其他开发系统框架，他有什么优点呢？让我们共同探讨一下吧！ 图片来源：unia…
uniapp+vue3打包问题记录
**背景：**打包app出现问题，只显示底部导航的文字，其他一片空白
1. pages.json文件：tabBar中的iconPath图标格式不支持svg，只支持：png, jpg, jpeg的格式，当图片改为.png的时候可以正常显示
2. …
uniapp 设置字体常用属性
1、字体大小
font-size:26rpx;
2、文字加线
1）下划线：text-decoration\:underline2）删除线：text-decoration\:line-through3）上划线：text-decoration\:overline3、字体加粗
font-weight\:bold;
4、字体…
uniapp学习总结
文章目录前言一、学习Uni-app用到的技术1、 [uni-app官网](https://uniapp.dcloud.net.cn)2、 [HTML](https://www.w3school.com.cn/html/index.asp)3、[JS](https://www.w3school.com.cn/js/index.asp)4、[ES6](http://caibaojian.com/es6/)5、[CSS](https://www.w3school.com…
uniapp 开发小记
uniapp 开发小记 简单回顾下，如有纰漏后续更新。 建议vue-cli的脚手架模式，统一IDE为vscode降低切换成本。
建立脚手架：
npm i -g vue/cli
vue create -p dcloudio/uni-preset-vue uni-templatenpm run dev:platform
npm run build:platfor…
uni-App踩坑记录
1、uni自己封装的axios在真机中失效，发不出请求
uniapp中使用axios 需要配置适配器 (添加适配器有点费劲，直接封装uni自带请求也可以)
axios-adapter-uniapp传送门 axios.defaults.adapter function(config) { //自己定义个适配器，用来…
uni-app获取系统信息（手机牌子、手机型号、屏幕宽度、屏幕高度）
uni.getSystemInfo({success(res) {console.log(res.brand) //手机牌子console.log(res.model) //手机型号console.log(res.screenWidth) //屏幕宽度console.log(res.screenHeight) //屏幕高度}) .exec()}});
如下 官网链接：系统信息的概念 | uni-app官网
uniapp：签字版、绘画板 插件l-signature
官方网站：LimeUi - 多端uniapp组件库 使用步骤：
1、首先从插件市场将代码下载到项目
海报画板 - DCloud 插件市场 2、下载后，在项目中的uni_modules目录（uni_modules优点：不需要import引入，还可以快捷更新…