当前位置: 首页 > 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 内置类型与自定…...

CTF show Web 红包题第六弹

提示 1.不是SQL注入 2.需要找关键源码 思路 进入页面发现是一个登录框&#xff0c;很难让人不联想到SQL注入&#xff0c;但提示都说了不是SQL注入&#xff0c;所以就不往这方面想了 ​ 先查看一下网页源码&#xff0c;发现一段JavaScript代码&#xff0c;有一个关键类ctfs…...

在rocky linux 9.5上在线安装 docker

前面是指南&#xff0c;后面是日志 sudo dnf config-manager --add-repo https://download.docker.com/linux/centos/docker-ce.repo sudo dnf install docker-ce docker-ce-cli containerd.io -y docker version sudo systemctl start docker sudo systemctl status docker …...

多种风格导航菜单 HTML 实现(附源码)

下面我将为您展示 6 种不同风格的导航菜单实现&#xff0c;每种都包含完整 HTML、CSS 和 JavaScript 代码。 1. 简约水平导航栏 <!DOCTYPE html> <html lang"zh-CN"> <head><meta charset"UTF-8"><meta name"viewport&qu…...

【Oracle】分区表

个人主页&#xff1a;Guiat 归属专栏&#xff1a;Oracle 文章目录 1. 分区表基础概述1.1 分区表的概念与优势1.2 分区类型概览1.3 分区表的工作原理 2. 范围分区 (RANGE Partitioning)2.1 基础范围分区2.1.1 按日期范围分区2.1.2 按数值范围分区 2.2 间隔分区 (INTERVAL Partit…...

2023赣州旅游投资集团

单选题 1.“不登高山&#xff0c;不知天之高也&#xff1b;不临深溪&#xff0c;不知地之厚也。”这句话说明_____。 A、人的意识具有创造性 B、人的认识是独立于实践之外的 C、实践在认识过程中具有决定作用 D、人的一切知识都是从直接经验中获得的 参考答案: C 本题解…...

在web-view 加载的本地及远程HTML中调用uniapp的API及网页和vue页面是如何通讯的?

uni-app 中 Web-view 与 Vue 页面的通讯机制详解 一、Web-view 简介 Web-view 是 uni-app 提供的一个重要组件&#xff0c;用于在原生应用中加载 HTML 页面&#xff1a; 支持加载本地 HTML 文件支持加载远程 HTML 页面实现 Web 与原生的双向通讯可用于嵌入第三方网页或 H5 应…...

rnn判断string中第一次出现a的下标

# coding:utf8 import torch import torch.nn as nn import numpy as np import random import json""" 基于pytorch的网络编写 实现一个RNN网络完成多分类任务 判断字符 a 第一次出现在字符串中的位置 """class TorchModel(nn.Module):def __in…...

用机器学习破解新能源领域的“弃风”难题

音乐发烧友深有体会&#xff0c;玩音乐的本质就是玩电网。火电声音偏暖&#xff0c;水电偏冷&#xff0c;风电偏空旷。至于太阳能发的电&#xff0c;则略显朦胧和单薄。 不知你是否有感觉&#xff0c;近两年家里的音响声音越来越冷&#xff0c;听起来越来越单薄&#xff1f; —…...

免费PDF转图片工具

免费PDF转图片工具 一款简单易用的PDF转图片工具&#xff0c;可以将PDF文件快速转换为高质量PNG图片。无需安装复杂的软件&#xff0c;也不需要在线上传文件&#xff0c;保护您的隐私。 工具截图 主要特点 &#x1f680; 快速转换&#xff1a;本地转换&#xff0c;无需等待上…...

Python 实现 Web 静态服务器(HTTP 协议)

目录 一、在本地启动 HTTP 服务器1. Windows 下安装 node.js1&#xff09;下载安装包2&#xff09;配置环境变量3&#xff09;安装镜像4&#xff09;node.js 的常用命令 2. 安装 http-server 服务3. 使用 http-server 开启服务1&#xff09;使用 http-server2&#xff09;详解 …...