当前位置: 首页 > news >正文

uView使用心得

说实话我不爱用这个库,感觉很鸡肋,坑很多,可能没用习惯

picker选择器

绑定默认值是通过设置index,并且这个index需要通过api设置进去,设置defalutindex绑定值无效(只有初始化可以,后面动态改变就不行-如果这是个公共使用的,一个页面有多个地方用,那么它的index就要设置不一样);

datetime日期组件

本身他也是一种picker,所以它也有上面picker的问题,需要通过api设置,v-model也是不行(当然一个页面只有一个日期就没问题);
然后它还不支持秒,按理说秒不秒其实无所谓,但遇上了我们刁钻的测试,I 服了 YOU(测试),就是说我可以不用,但是你不能没有,你没有让我咋搞啊,本来打算直接在组件上改,但是后来发现已经有同事专门复制了一份出来改造过(针对这种需要改组件库的我拓展下https://blog.csdn.net/hclle/article/details/120305538),那我也在页面上改好喽,改起来倒也不难,我就大概说下,你就在组件里搜“minute”,照着minute后面加second,但有几处比较隐晦,你测试的时候打打断点,打打console.log定位下基本就解决了,需要实现的是年月日 时分秒和时分秒。

Upload上传

app上无法获取name,在app上它返回的是这些东西
在这里插入图片描述
那我们只能从其它字段下手了,这里我选择的url(和thumb是一样的),然后采用截取的方式,获取最后一个斜杠后面的内容作为name,其实这个name本身就是前端自己定义的,你就获取个时间戳当name也无所谓。
然后后续我又遇到有的图片可以跟表单一起提交成功,有的又不可以,自己观察又问后端是因为name太长了,后面又截取了一下。

const string = file.url.split('/')
// 取最后一个'/'为name,并且截取name的后xx位(因为后端限制了name最大长度)
name = string[string.length - 1].slice(-xx)

popup弹窗层

我的mode设置为right,默认它的位置就在右边最顶部,我们的需求是希望它在页面标题栏的下方,他的文档有一个safeAreaInsetTop: true留出顶部安全距离,但是我不知道为什么没实现,我踩了很多坑,四五处设置不停互换配合(safeAreaInsetTop,top、background-color css),并且还要打包在手机上安装才能测出效果(模拟器跟真机不一致),说实话这一块还是挺乱的,我都不知道该如何描述,我写下我试过的几种效果吧,这块只做参考,我也不想再继续研究了,觉得乱的可以忽略不看。
第一张是我最终要实现的效果,第二张是遇到的坑效果(配合不好就是这样的效果,首先是白色区域间距过大,其次是顶部没有在标题的下面)
在这里插入图片描述
在这里插入图片描述
它生成的标签结构是这样的
在这里插入图片描述
第一处、第二处都是组件自己生成的标签,第三处是我页面的内容了。
下面写下几种配合效果

1、safeAreaInsetTop:true(内容顶部有空白,白色背景间距),u-slide-right-enter-to top:100rpx(顶部有间隙,遮罩层间隙,不够,间隙最小), 第三处页面class background-color: '#fff' 
2、safeAreaInsetTop:false(内容顶部有空白,无白色背景间距), top:86rpx(顶部有间隙,遮罩层间隙,不够,间隙比上面的大),  第三处页面class background-color: '#fff' 
3、safeAreaInsetTop:true(顶部有空白,白色背景间距), top:0rpx(默认就是0,顶部有间隙,遮罩层间隙,不够,间距和第二个一样),  第三处页面class background-color: '#fff' 
4、safeAreaInsetTop:true(无白色背景间距), top:100rpx(顶部有间隙,遮罩层间隙,够了,刚好在标题下面), u-popup__content background-color:#fff。这个也是理想中的效果,推荐
5、safeAreaInsetTop:true(有白色背景间距), top:92rpx(顶部有间隙,间隙和第二个一样), 第三处页面class background-color: '#fff' 
6、safeAreaInsetTop:true(无白色背景间距), top:100(顶部有间隙,够了), 第三处页面class background-color: '#fff' , u-popup__content background-color: transparent,最终代码里是这样实现的

其实在第4次测试已经实现了,并且这个时候我也大概观察出来为什么,我也是想验证下我想的对不对,所以才有了第6次,但后面感觉实在太麻烦了,我的猜想还是有点模棱两可(可以看下我的胡言乱语,safeAreaInsetTop:true,会与顶部留出安全距离,看来是页面内容和顶部的距离,此时 u-popup__content设置了白色背景那这个间距就出来了,所以它俩不能配合,如果白色背景要设置在u-popup__content上,那么safeAreaInsetTop就只能用false),就没继续了。

相关文章:

uView使用心得

说实话我不爱用这个库,感觉很鸡肋,坑很多,可能没用习惯 picker选择器 绑定默认值是通过设置index,并且这个index需要通过api设置进去,设置defalutindex绑定值无效(只有初始化可以,后面动态改变…...

RabbitMQ(高阶使用)死信队列

文章内容是学习过程中的知识总结,如有纰漏,欢迎指正 文章目录 一、什么是死信队列? 二、死信队列使用场景 三、死信队列如何使用 四、打车超时处理 1.打车超时实现 以下是本篇文章正文内容 一、什么是死信队列? 先从概念解释上搞…...

怎么安装docker-compose

使用下列命令下载docker-compose(可选择其他版本) wget https://github.com/docker/compose/releases/download/v2.16.0/docker-compose-linux-x86_64 --no-check-certificate然后把该文件移动到/usr/local/bin/并重命名 mv docker-compose-linux-x86_…...

【机器学习】--- 自监督学习

1. 引言 机器学习近年来的发展迅猛,许多领域都在不断产生新的突破。在监督学习和无监督学习之外,自监督学习(Self-Supervised Learning, SSL)作为一种新兴的学习范式,逐渐成为机器学习研究的热门话题之一。自监督学习…...

【Linux修行路】网络套接字编程——UDP

目录 ⛳️推荐 前言 六、Udp Server 端代码 6.1 socket——创建套接字 6.2 bind——将套接字与一个 IP 和端口号进行绑定 6.3 recvfrom——从服务器的套接字里读取数据 6.4 sendto——向指定套接字中发送数据 6.5 绑定 ip 和端口号时的注意事项 6.5.1 云服务器禁止直接…...

哈希表数据结构学习

哈希表数据结构学习 哈希表基本概念哈希方法单值哈希与多值哈希哈希冲突1. 开放寻址法(Open Addressing)2. 链地址法(Chaining)3. 再哈希法(Rehashing)4. 建立公共溢出区(Overflow Area&#xf…...

数据结构——“二叉搜索树”

二叉搜索树是一个很重要的数据结构,它的特殊结构可以在很短的时间复杂度找到我们想要的数据。最坏情况下的时间复杂度是O(n),最好是O(logn)。接下来看一看它的接口函数的实现。 为了使用方便,这里采用模版的方式: 一、节点 temp…...

Java零基础-Java对象详解

哈喽,各位小伙伴们,你们好呀,我是喵手。运营社区:C站/掘金/腾讯云/阿里云/华为云/51CTO;欢迎大家常来逛逛 今天我要给大家分享一些自己日常学习到的一些知识点,并以文字的形式跟大家一起交流,互…...

从Prompt到创造:解锁AI的无限潜能

文章目录 🍊AI内容创作核心:提示词Prompt1 什么是提示词工程?1.1 提示词的原理是什么?1.2 提示词工程师:百万年薪的职业?1.3 谁都能成为提示词工程师吗? 2 提示词书写的基本技巧3 常见的提示词框架3.1 CO-…...

sqlgun靶场攻略

打开界面 1.输入框测试回显点 -1union select 1,2,3#出现回显点 2.查看数据库名 -1union select 1,2,database()# 3.查看表名 -1union select 1,2,group_concat(table_name) from information_schema.tables where table_schemasqlgunnews# 4.查看admin表中列名 -1union se…...

《网络协议 - HTTP传输协议及状态码解析》

文章目录 一、HTTP协议结构图二、HTTP状态码解读1xx: 信息响应类2xx: 成功响应类3xx: 重定向类4xx: 客户端错误类5xx: 服务器错误类 一、HTTP协议结构图 二、HTTP状态码解读 HTTP状态码(英语:HTTP Status Code)是用以表示网页服务器超文本传…...

9.11 QT ( Day 4)

一、作业 1.Widget.h #ifndef WIDGET_H #define WIDGET_H#include <QWidget> #include <QTimerEvent> //定时器类 #include <QTime> #include <QtTextToSpeech> //文本转语音类QT_BEGIN_NAMESPACE namespace Ui { class Widget; } QT_END_NAMESPACEcl…...

利用AI驱动智能BI数据可视化-深度评测Amazon Quicksight(四)

简介 随着生成式人工智能的兴起&#xff0c;传统的 BI 报表功能已经无法满足用户对于自动化和智能化的需求&#xff0c;今天我们将介绍亚马逊云科技平台上的AI驱动数据可视化神器 – Quicksight&#xff0c;利用生成式AI的能力来加速业务决策&#xff0c;从而提高业务生产力。…...

2024.9最新:CUDA安装,pytorch库安装

目录 一、CUDA安装 1.查看自己电脑适配的CUDA的最高版本 2.安装CUDA 3.检查环境变量是否配置&#xff0c;安装是否成功 二、pytorch库安装 1.pytorch库下载 2.选择合适的版本 3.查看版本 一、CUDA安装 1.查看自己电脑适配的CUDA的最高版本 在命令提示符里输入nvidia-…...

Vue3.0组合式API:setup()函数

1、什么是组合式API Vue 3.0 中新增了组合式 API 的功能&#xff0c;它是一组附加的、基于函数的 API&#xff0c;可以更加灵活地组织组件代码。通过组合式 API 可以使用函数而不是声明选项的方式来编写 Vue 组件。因此&#xff0c;使用组合式 API 可以将组件代码编写为多个函…...

利用AI驱动智能BI数据可视化-深度评测Amazon Quicksight(三)

简介 随着生成式人工智能的兴起&#xff0c;传统的 BI 报表功能已经无法满足用户对于自动化和智能化的需求&#xff0c;今天我们将介绍亚马逊云科技平台上的AI驱动数据可视化神器 – Quicksight&#xff0c;利用生成式AI的能力来加速业务决策&#xff0c;从而提高业务生产力。…...

2022高教社杯全国大学生数学建模竞赛C题 问题一(1) Python代码演示

目录 问题 11.1 对这些玻璃文物的表面风化与其玻璃类型、纹饰和颜色的关系进行分析数据探索 -- 单个分类变量的绘图树形图条形图扇形图雷达图Cramer’s V 相关分析统计检验列联表分析卡方检验Fisher检验绘图堆积条形图分组条形图分类模型Logistic回归随机森林import matplotlib…...

Qt QSerialPort数据发送和接收DataComm

文章目录 Qt QSerialPort数据发送和接收DataComm2.添加 Qt Serial Port 模块3.实例源码 Qt QSerialPort数据发送和接收DataComm Qt 框架的Qt Serial Port 模块提供了访问串口的基本功能&#xff0c;包括串口通信参数配置和数据读写&#xff0c;使用 Qt Serial Port 模块就可以…...

macOS上谷歌浏览器的十大隐藏功能

谷歌浏览器&#xff08;Google Chrome&#xff09;在macOS上拥有一系列强大而隐蔽的特性&#xff0c;这些功能能显著提高您的浏览体验。从多设备同步到提升安全性和效率&#xff0c;这些被低估的功能等待着被发掘。我们将逐步探索这些功能&#xff0c;帮助您最大化利用谷歌浏览…...

【C++篇】C++类与对象深度解析(二):类的默认成员函数详解

文章目录 【C篇】C类与对象深度解析&#xff08;二&#xff09;前言1. 类的默认成员函数2. 构造函数2.1 函数名与类名相同2.2 无返回值2.3 对象实例化时系统会自动调用2.4 构造函数可以重载2.5 默认构造函数的生成规则2.6 无参构造函数与全缺省构造函数的关系2.7 内置类型与自定…...

地震勘探——干扰波识别、井中地震时距曲线特点

目录 干扰波识别反射波地震勘探的干扰波 井中地震时距曲线特点 干扰波识别 有效波&#xff1a;可以用来解决所提出的地质任务的波&#xff1b;干扰波&#xff1a;所有妨碍辨认、追踪有效波的其他波。 地震勘探中&#xff0c;有效波和干扰波是相对的。例如&#xff0c;在反射波…...

深入浅出:JavaScript 中的 `window.crypto.getRandomValues()` 方法

深入浅出&#xff1a;JavaScript 中的 window.crypto.getRandomValues() 方法 在现代 Web 开发中&#xff0c;随机数的生成看似简单&#xff0c;却隐藏着许多玄机。无论是生成密码、加密密钥&#xff0c;还是创建安全令牌&#xff0c;随机数的质量直接关系到系统的安全性。Jav…...

HTML 列表、表格、表单

1 列表标签 作用&#xff1a;布局内容排列整齐的区域 列表分类&#xff1a;无序列表、有序列表、定义列表。 例如&#xff1a; 1.1 无序列表 标签&#xff1a;ul 嵌套 li&#xff0c;ul是无序列表&#xff0c;li是列表条目。 注意事项&#xff1a; ul 标签里面只能包裹 li…...

Nginx server_name 配置说明

Nginx 是一个高性能的反向代理和负载均衡服务器&#xff0c;其核心配置之一是 server 块中的 server_name 指令。server_name 决定了 Nginx 如何根据客户端请求的 Host 头匹配对应的虚拟主机&#xff08;Virtual Host&#xff09;。 1. 简介 Nginx 使用 server_name 指令来确定…...

华硕a豆14 Air香氛版,美学与科技的馨香融合

在快节奏的现代生活中&#xff0c;我们渴望一个能激发创想、愉悦感官的工作与生活伙伴&#xff0c;它不仅是冰冷的科技工具&#xff0c;更能触动我们内心深处的细腻情感。正是在这样的期许下&#xff0c;华硕a豆14 Air香氛版翩然而至&#xff0c;它以一种前所未有的方式&#x…...

深度学习水论文:mamba+图像增强

&#x1f9c0;当前视觉领域对高效长序列建模需求激增&#xff0c;对Mamba图像增强这方向的研究自然也逐渐火热。原因在于其高效长程建模&#xff0c;以及动态计算优势&#xff0c;在图像质量提升和细节恢复方面有难以替代的作用。 &#x1f9c0;因此短时间内&#xff0c;就有不…...

【Nginx】使用 Nginx+Lua 实现基于 IP 的访问频率限制

使用 NginxLua 实现基于 IP 的访问频率限制 在高并发场景下&#xff0c;限制某个 IP 的访问频率是非常重要的&#xff0c;可以有效防止恶意攻击或错误配置导致的服务宕机。以下是一个详细的实现方案&#xff0c;使用 Nginx 和 Lua 脚本结合 Redis 来实现基于 IP 的访问频率限制…...

Neko虚拟浏览器远程协作方案:Docker+内网穿透技术部署实践

前言&#xff1a;本文将向开发者介绍一款创新性协作工具——Neko虚拟浏览器。在数字化协作场景中&#xff0c;跨地域的团队常需面对实时共享屏幕、协同编辑文档等需求。通过本指南&#xff0c;你将掌握在Ubuntu系统中使用容器化技术部署该工具的具体方案&#xff0c;并结合内网…...

LangChain【6】之输出解析器:结构化LLM响应的关键工具

文章目录 一 LangChain输出解析器概述1.1 什么是输出解析器&#xff1f;1.2 主要功能与工作原理1.3 常用解析器类型 二 主要输出解析器类型2.1 Pydantic/Json输出解析器2.2 结构化输出解析器2.3 列表解析器2.4 日期解析器2.5 Json输出解析器2.6 xml输出解析器 三 高级使用技巧3…...

【Java多线程从青铜到王者】单例设计模式(八)

wait和sleep的区别 我们的wait也是提供了一个还有超时时间的版本&#xff0c;sleep也是可以指定时间的&#xff0c;也就是说时间一到就会解除阻塞&#xff0c;继续执行 wait和sleep都能被提前唤醒(虽然时间还没有到也可以提前唤醒)&#xff0c;wait能被notify提前唤醒&#xf…...