uniapp使用uni-swipe-action后右侧多了小于1px的间隙
问题:uniapp使用uni-swipe-action后右侧多了小于1px的间隙。且在真机上没有问题,但是在微信开发者工具中有问题。
代码如下:在滑动滑块或者点击这个区域时,就会出现问题。

<scroll-view :scroll-y="true" :style="'height:'+contentHeight+'px'" :enable-back-to-top="true"><!-- 有商品展示 --><view class="cart-box" v-if="goodsList.length>0"><uni-swipe-action class="goods-list" v-for="item in goodsList" :key="item.goods_id"><uni-swipe-action-item class="swipe-goods-item" :right-options="options"@click="sliderClick($event, item.goods_id)"><view class="goods-display"><view class="radio"><radio class="radio" @click="clickCurRadio(item.goods_id,item.checked)":value="item.goods_id" :checked="item.checked?true:false" color="#bc2840"style="transform:scale(0.9)" /></view><bjs-settle-goods class="bjs-goods" :goods="item"><template v-slot:cart><view class="goods-promo">限时购</view><view class="goods-price-desc">优惠已降价¥38</view><view class="goods-price"><bjs-price :price="item.goods_price"></bjs-price><uni-number-box class="number-box" v-model="item.cart_counts"@change="changeQuality($event,item)" /></view></template></bjs-settle-goods></view></uni-swipe-action-item></uni-swipe-action></view></scroll-view>
怀疑是,父级容器cart-box和子级uni-swipe-action宽度没有完全相等导致。而容器都没有设置固定宽度值,父级容器cart-box只设置了padding: 10px 10px;
尝试使用伪元素:after没用
解决:在子级容器添加padding-right:5px(值必须固定)撑满容器,并且设置 display: flex;
.cart-box {background-color: #f5f3f4;padding: 10px 10px;.goods-list {padding: 10px 10px;background-color: $whiteBgColor;display: flex;border-radius: 6px;flex-direction: column;.swipe-goods-item {// 父级goods-list 宽度和滑块宽度不一致,导致右侧1px间隙padding-right: 5px;display: flex;}.goods-display {height: 100%;display: flex;.radio {width: 8%;height: 100%;@extend .displayCenter;}.bjs-goods {width: 92%;display: flex;}.goods-promo {margin: 5px 0;width: fit-content;border: 1px solid $redColor;padding: 5px;border-radius: 5px;font-size: 15px;color: $redColor;}.goods-price {margin: 5px 0;display: flex;justify-content: space-between;.number-box {margin-left: 10px;}}}}}
相关文章:
uniapp使用uni-swipe-action后右侧多了小于1px的间隙
问题:uniapp使用uni-swipe-action后右侧多了小于1px的间隙。且在真机上没有问题,但是在微信开发者工具中有问题。 代码如下:在滑动滑块或者点击这个区域时,就会出现问题。 <scroll-view :scroll-y"true" :style&quo…...
随手笔记——演示如何提取 ORB 特征并进行匹配
随手笔记——演示如何提取 ORB 特征并进行匹配 说明知识点源代码 说明 演示如何提取 ORB 特征并进行匹配 知识点 特征点由关键点(Key-point)和描述子(Descriptor)两部分组成。 ORB 特征亦由关键点和描述子两部分组成。它的关键…...
Python访问者模式介绍、使用
目录 一、Python访问者模式介绍 二、访问者模式使用 一、Python访问者模式介绍 访问者模式(Visitor Pattern)是一种行为型设计模式,它能够将算法与对象结构分离,使得算法可以独立于对象结构而变化。这个模式的主要思想是&#…...
深度学习实际使用经验总结
以下仅是个人在使用过程中的经验总结,请谨慎参考。 常用算法总结 图像分类 常用算法(可作为其他任务的骨干网络):服务端:VGG、ResNet、ResNeXt、DenseNet移动端:MobileNet、ShuffleNet等适用场景&#x…...
【广州华锐互动】AR智慧机房设备巡检系统
AR智慧机房设备巡检系统是一种新型的机房巡检方式,它通过使用增强现实技术将机房设备、环境等信息实时呈现在用户面前,让巡检人员可以更加高效地完成巡检任务。 首先,AR智慧机房设备巡检系统具有极高的智能化程度。该系统可以根据用户设定的…...
关于Ubuntu 18.04 LTS环境下运行程序出现的问题
关于Ubuntu 18.04 LTS环境下运行程序出现的问题 1.运行程序时出现以下情况 2.检查版本 strings /lib/x86_64-linux-gnu/libc.so.6 |grep GLIBC_ 发现Ubuntu18.04下的glibc版本最高为2.27,而现程序所使用的是glibc2.34,所以没办法运行, 3.解决办法 安装glibc2.34库, …...
「苹果安卓」手机搜狗输入法怎么调整字体大小及键盘高度?
手机搜狗输入法怎么调整字体大小及键盘高度? 1、在手机上准备输入文字,调起使用的搜狗输入法手机键盘; 2、点击搜狗输入法键盘左侧的图标,进入更多功能管理; 3、在搜狗输入法更多功能管理内找到定制工具栏,…...
【人工智能】神经网络、前向传播、反向传播、梯度下降、局部最小值、多层前馈网络、缓解过拟合的策略
神经网络、前向传播、反向传播 文章目录 神经网络、前向传播、反向传播前向传播反向传播梯度下降局部最小值多层前馈网络表示能力多层前馈网络局限缓解过拟合的策略前向传播是指将输入数据从输入层开始经过一系列的权重矩阵和激活函数的计算后,最终得到输出结果的过程。在前向…...
一个tomcat部署两个服务的server.xml模板
一个服务的文件夹名字叫hospital,一个服务的文件夹叫ROOT,一个tomcat运行两个服务如何配置呢?注意一个appBase为webapps,另一个appBase为webapps1,当然也可以放在一个webappps里面。 <Service name"Catalina">&l…...
CentOS 7安装Docker
文章目录 安装Docker1.CentOS安装Docker1.1.卸载(可选)1.2.安装docker1.3.启动docker1.4.配置镜像加速 2.CentOS7安装DockerCompose2.1.下载2.2.修改文件权限2.3.Base自动补全命令: 3.Docker镜像仓库3.1下载一个镜像 安装Docker Docker 分为 …...
Nginx前端部署
1. 前端打包 执行如下命令,构建前端代码,构建成功后会在目录dist下生成构建完成的文件,将dist整个文件夹拷贝到服务器中 npm install npm run build dev 2.nginx配置 进入nginx目录/usr/local/nginx/conf,修改nginx.conf文件&a…...
17网商品详情API:使用与数据解析方法
17网是一家知名的电商平台,提供了大量的商品选择。开发者可以通过17网的商品详情API来快速获取和展示商品的详细信息。 17网商品详情API简介 介绍17网商品详情API的作用和目的,解释为何使用该API可以实现丰富的商品详情展示功能。 获取API访问权限 说…...
解决新版 Idea 中 SpringBoot 热部署不生效
标题 依赖中添加 <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-devtools</artifactId> <scope>runtime</scope> <opt…...
Node.js: express + MySQL实现修改密码
实现修改密码,本篇文章实现修改密码只考虑以下几个方面: (1),获取旧密码 (2),获取新密码 (3),将获取到的旧密码与数据库中的密码进行比对…...
ArduPilot之433电传模块集成之H7Dual飞控Rx/Tx丝印问题
ArduPilot之433电传模块集成之H7Dual飞控Rx/Tx丝印问题 1. 源由2. 安装3. 排查3.1 电气连接3.2 软件配置3.3 模块测试3.4 通信测试3.5 定位问题 4. 总结5. 参考资料 1. 源由 鉴于最近iNav最新固件6.1.1出现远航炸机,还是回到相对可靠的Ardupilot,在Mavl…...
python爬虫优化手段
当使用Python进行网络资源爬取时,会涉及到网络请求、数据处理和存储等操作,这些操作可能会对电脑性能产生一定的影响。以下是一些关于Python爬取网络资源的常见注意事项: 网络请求频率:频繁的网络请求可能会对电脑性能产生较大的影…...
Bootstrap-学习文档
Bootstrap 简介 什么是 Bootstrap? Bootstrap 是一个用于快速开发 Web 应用程序和网站的前端框架。 Bootstrap是前端开发中比较受欢迎的框架,简洁且灵活。它基于HTML、CSS和JavaScript,HTML定义页面元素,CSS定义页面布局&#x…...
【图像分类】CNN + Transformer 结合系列.1
介绍三篇结合使用CNNTransformer进行学习的论文:CvT(ICCV2021),Mobile-Former(CVPR2022),SegNetr(arXiv2307). CvT: Introducing Convolutions to Vision Transformers, …...
Stable Diffusion - 扩展 SegmentAnything 和 GroundingDINO 实例分割算法 插件的配置与使用
欢迎关注我的CSDN:https://spike.blog.csdn.net/ 本文地址:https://blog.csdn.net/caroline_wendy/article/details/131918652 Paper and GitHub: Segment Anything: SAM - Segment Anything GitHub: https://github.com/facebookresearch/s…...
自然语言处理从入门到应用——LangChain:提示(Prompts)-[基础知识]
分类目录:《自然语言处理从入门到应用》总目录 模型编程的新方法是使用提示(Prompts)。提示指的是模型的输入。这个输入通常由多个组件构成。PromptTemplate负责构建这个输入,LangChain提供了多个类和函数,使得构建和处…...
使用docker在3台服务器上搭建基于redis 6.x的一主两从三台均是哨兵模式
一、环境及版本说明 如果服务器已经安装了docker,则忽略此步骤,如果没有安装,则可以按照一下方式安装: 1. 在线安装(有互联网环境): 请看我这篇文章 传送阵>> 点我查看 2. 离线安装(内网环境):请看我这篇文章 传送阵>> 点我查看 说明:假设每台服务器已…...
java 实现excel文件转pdf | 无水印 | 无限制
文章目录 目录 文章目录 前言 1.项目远程仓库配置 2.pom文件引入相关依赖 3.代码破解 二、Excel转PDF 1.代码实现 2.Aspose.License.xml 授权文件 总结 前言 java处理excel转pdf一直没找到什么好用的免费jar包工具,自己手写的难度,恐怕高级程序员花费一年的事件,也…...
DAY 47
三、通道注意力 3.1 通道注意力的定义 # 新增:通道注意力模块(SE模块) class ChannelAttention(nn.Module):"""通道注意力模块(Squeeze-and-Excitation)"""def __init__(self, in_channels, reduction_rat…...
cf2117E
原题链接:https://codeforces.com/contest/2117/problem/E 题目背景: 给定两个数组a,b,可以执行多次以下操作:选择 i (1 < i < n - 1),并设置 或,也可以在执行上述操作前执行一次删除任意 和 。求…...
如何为服务器生成TLS证书
TLS(Transport Layer Security)证书是确保网络通信安全的重要手段,它通过加密技术保护传输的数据不被窃听和篡改。在服务器上配置TLS证书,可以使用户通过HTTPS协议安全地访问您的网站。本文将详细介绍如何在服务器上生成一个TLS证…...
高危文件识别的常用算法:原理、应用与企业场景
高危文件识别的常用算法:原理、应用与企业场景 高危文件识别旨在检测可能导致安全威胁的文件,如包含恶意代码、敏感数据或欺诈内容的文档,在企业协同办公环境中(如Teams、Google Workspace)尤为重要。结合大模型技术&…...
Module Federation 和 Native Federation 的比较
前言 Module Federation 是 Webpack 5 引入的微前端架构方案,允许不同独立构建的应用在运行时动态共享模块。 Native Federation 是 Angular 官方基于 Module Federation 理念实现的专为 Angular 优化的微前端方案。 概念解析 Module Federation (模块联邦) Modul…...
Ascend NPU上适配Step-Audio模型
1 概述 1.1 简述 Step-Audio 是业界首个集语音理解与生成控制一体化的产品级开源实时语音对话系统,支持多语言对话(如 中文,英文,日语),语音情感(如 开心,悲伤)&#x…...
Java + Spring Boot + Mybatis 实现批量插入
在 Java 中使用 Spring Boot 和 MyBatis 实现批量插入可以通过以下步骤完成。这里提供两种常用方法:使用 MyBatis 的 <foreach> 标签和批处理模式(ExecutorType.BATCH)。 方法一:使用 XML 的 <foreach> 标签ÿ…...
【电力电子】基于STM32F103C8T6单片机双极性SPWM逆变(硬件篇)
本项目是基于 STM32F103C8T6 微控制器的 SPWM(正弦脉宽调制)电源模块,能够生成可调频率和幅值的正弦波交流电源输出。该项目适用于逆变器、UPS电源、变频器等应用场景。 供电电源 输入电压采集 上图为本设计的电源电路,图中 D1 为二极管, 其目的是防止正负极电源反接, …...
