高度uniapp swiper
uniapp-1记
《Vue.js 核心技术解析 与 uni-app 跨平台实战开发》 这本书听、读了2天，收获一般，所以我打算从兴趣点入手。 上面截取了某游戏社交平台的应用操作界面，可以看到它使用的双导航，即在上方有一排： （推荐、影帝赠礼、新闻、更新、活动），默认推荐，而其实这上面这一排也仅仅对应着 下面的tabB ......
uniApp 仿微信下拉菜单
uniApp 仿微信下拉菜单 手指长按事件longpress @longpress="longpress(index,$event)" 下拉菜单 <!-- 长按的下拉菜单 --> <view class="jh-w-200 jh-h-60-min jh-dropDownMenu jh-shadow- ......
uniapp微信小程序表单输入框上移事件
一、问题 uniapp制作的微信小程序表单，在使用真机调试时，点击输入框输入内容时，出现输入框上移的情况 二、找原因 窗体高度固定，导致软键盘弹出时输入框上移 三、解决办法 1、uniapp官网关于软键盘弹出问题的解决方法 在pages.json中配置的写输入框表单的 style "app-plus ......
uniapp小程序小bug，扫码进入小程序场景值为1001的情况之一。
首先，这个问题原因是这样的用户第一次扫码进入小程序在app.vue 的onLaunch下拿不到optiond的query对象的值场景值为1001，按照正常来说扫码进来应该是1047。排查原因只有用户在打开小程序的情况下 没有杀掉进程只是切换页面到微信主页进行扫码进入小程序，结果就会出现扫码进入小程序 ......
将微信小程序源码自动转换为uniapp vue3/vite源码
uniapp目前已经支持vue3语法了，对于想将微信小程序代码迁移到uniapp vue3的小伙伴来说，迁移的工作量无疑是比较大的。本人开发了自动转换工具可以自动实现代码转换，并且保证了可读性。 基本原理： wxml-compiler：wxml → posthtml-parser → AST → t ......
uniapp开发nuve原生瀑布流组件waterfall列表后边出现空白的处理方法
异常描述： 首页有轮播、广告位、瀑布流商品列表，但是使用了原生组件waterfall的商品列表后边出现了大面积空白。 解决方法： 将waterfall放到父容器下边或者直接放到template下边作为父容器，给父容器设置高度设置为窗口高度，除瀑布流展示的列表外，其他的组件都放在中即可。 <templ ......
uniapp做app跳转小程序支付功能
1.app里面代码 app向小程序路径传参的时候，如果太长或者是里面有特殊符号建议先使用编码然后再小程序端解码实现传送（编码代码如下） encodeURIComponent(JSON.stringify(params)) // 编码 JSON.parse(decodeURIComponent(opt ......
uniapp小程序所遇到的bug
最近小程序添加好多条条框框的规矩比如 1、登录的时候要弹出隐私规则的弹窗 2、要使用的api涉及到隐私的一定要在隐私规则里配置，在微信公众平台的设置里，更新隐私规则 3、.如果涉及到手机号登录的小程序，则需要有游客模式，就是不可以在登录的时候向用户获取手机号，要在具体功能的前面获取手机号等隐私，可以 ......
uniapp app横屏竖屏问题导致样式紊乱
最近做了一个点击签名然后要让app自动横屏的功能，此功能难点在于退出横屏的时候，会导致竖屏的页面紊乱。 首先如果要让app横屏，要先在manifest.json的源码视图app-plus里添加"flexible": true,表示app可以横竖切换 然后在想要横屏的页面里加上 onShow() { ......
uniapp-ucloud 数据库里面添加记录
要保持 本地跟云端的表一致。 同步。 还有设置权限 const db = uniCloud.database() const jiemengCollection = db.collection('jiemeng') for (const row of data) { console.log(row) ......
uniapp 动态修改顶部导航栏右侧按钮 titleNView（APP-PLUS、H5）
1 <script> 2 export default { 3 onReady() { 4 // 已渲染 5 var pages = getCurrentPages(); 6 var page = pages[pages.length - 1]; 7 8 // #ifdef H5 9 documen ......
uniapp 打包缺陷
uniapp 打包时候 会把 所有用到的公共组件和公共封装打包到一起，在首页直接加载，这样会严重影响首屏的显示速度 目前没有找到好的 最小化 分离 首屏依赖的打包方式 考虑可行的方案 1. 写一个webpack插件，通过分析 指定模块的依赖，将模块 和 模块依赖 分别打包 2. 深入 webpack ......
uniapp微信小程序自定义隐私权限弹窗
插件地址：https://ext.dcloud.net.cn/plugin?id=14576#detail 样式小改动 <template> <view class="xh-privacy"> <!-- 默认主题 --> <view :style="'background:'+background+ ......
如何通过CSS将高度从0过渡到auto？
内容来自 DOC https://q.houxu6.top/?s=如何通过CSS将高度从0过渡到auto？ 你可以尝试使用max-height属性来实现这个效果，而不是使用height属性。这样，在悬停时，<ul>的高度会逐渐增加，而不会出现突然跳跃的情况。以下是修改后的CSS代码： #child0 ......
uniapp开发编写nvue报警Unhandled error during execution of render function
关键的两行报错如下： [Vue warn]: Unhandled error during execution of render function [Vue warn]: Unhandled error during execution of scheduler flush. This is li ......
背景图高度铺满，宽度自适应
header { max-width: 100vw; height: calc(100vh - 66.51px); position: relative; background-position: center; background-size: auto 100%; } 效果 ......
uniapp实现路由拦截
背景 在APP中，跳转页面需要判断是否有权限跳转，比如是否登录。开发环境是TMUI+VUE3+TS，这难免有一些限制，在网上搜索后，发现简书网站有个博主写的链接正合我意，不过他的是JavaScript+uniapp原生开发，根据我的需求，自己稍微改了些。 0x01 复制代码 简书博客链接：https ......
uniapp项目APP端安卓ios权限检测教程
导语：在 APP 的日常开发过程中，权限检测与授权是不可避免的一项重要的功能，下面就简单介绍一下如何检测和授权的方法。 目录 原理 方法 实战 原理 此授权方法主要是依托于 HTML5 产业联盟的HTML5+规范实现的。 HTML5 产业联盟官网 获取当前操作系统名称 可以使用uni.getSyst ......
SKU规格-uniapp小程序
<template> <view class="body"> <view class="tablist" v-if="isShow"> <view class="tab" v-for="(Aitem,Aindex) in tablist" :key="Aindex"> <view class="ta ......
Uniapp中弹窗
Uniapp中弹窗 直接上代码 uni.showModal({ title: '提示', content: '这是一个自定义按钮文字的模态对话框', confirmText: '自定义确定', // 自定义确定按钮的文字 cancelText: '自定义取消', // 自定义取消按钮的文字 succ ......
在 uniapp 项目中集成 echarts 图表
1. 项目结构 2. 获取 ECharts 库文件 ECharts在线构建 下载后重命名为：echarts.full.js / echarts.full.min.js 3. 获取 ECharts 地图数据 点此下载 下载后移动到项目结构目录的 geo 位置 4. 编写 ECharts 组件 <tem ......
uniapp的hbuilder命令行总结
HbuilderX通过菜单进行打包，实际上运行的是 /Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/bin/uniapp-cli.js 这个文件 会调用/Applications/HBuilderX.app/Cont ......
uniapp之微信小程序 支付
一、注册微信支付商户号（由上级或法人注册） 注册链接：https://pay.weixin.qq.com/index.php/apply/applyment_home/guide_normal#none，如图 注意：需要由主管及更上级领导进行注册，成为公司收款账户 （企业注册需要材料：营业执照、对公 ......
uniapp的easycom模式
uniapp的easycom模式，无需import和注册components，即可在页面使用固定目录下的组件。 这个目的是简化引用，其实还挺坑的。 1. 直接使用组件，全局又搜索不到引用，第一感觉让人摸不着头脑 2. 不引用组件，文件下放了多个组件，不知道到底使用了哪个 3. 进行组件优化，要删除或 ......
display 属性为 table-row 的元素中调整子元素的高度占比
初始状态效果和代码大致意思如下，业务上需要让TEST1占满td的全部高度 原始 期望 <tr style="display: table-row; background-color: lightgray;"> <td style="display: table-cell; width: 50px;" ......
uniapp 预览pdf app端使用自定义导航时铺满全屏，需要留出导航栏
1、安装pdf预览插件：hybrid 插件（网上资料很多） 2、封装预览vue页面（重点在加粗部分，使用原生导航没有问题，但是使用自定义导航就把状态栏全部盖住了） <template> <view class="page"> <web-view :webview-styles="webviewSty ......
微信小程序--顶部导航栏的高度偏差问题
顶部导航栏的结构： 已知： 获取系统信息：wx.getSystemInfoSync() 获取胶囊信息：wx.getMenuButtonBoundingClientRect() wx.getSystemInfoSync().statusBarHeight;//状态栏高度 wx.getMenuButto ......
uniapp h5低版本Android显示空白
前言：uniapp写的H5访问一直空白，打包app就可以正常显示，排查说是箭头函数低版本不支持，一顿操作npm，还是一样空白。 最后：需要发行打包h5才能正常访问，服了也没告诉我啊。注：打包出来访问报错Uncaught SyntaxError: Unexpected token '<'，访问空白问题 ......
使用uniapp+uView制作表单踩坑事件
一、问题描述 制作表单过程中使用了uniapp的日期选择组件uni-datetime-picker和uView的u-picker组件 在实际编写过程中模拟器和安卓机的真机调试上，显示没有任何问题 但是 在使用IOS设备进行调试过程中，出现了弹窗遮挡的情况 二、寻找解决办法 1、第一反应为组件不兼容I ......
uniapp引入H5调试vConsole
在真机环境下调试移动端H5的时候，无法像浏览器一样打开控制台进行console调试，那么我们可以在前端项目中引入vconsole，便于我们在真机环境下调试移动端H5项目 vConsole是一个轻量、可拓展、针对手机网页的前端开发者调试面板。 详细文档可查看：https://gitee.com/mir ......