uview 组件遇到的问题以及响应的改造

uview组件版本 2.0.36

u-action-sheet 选项太多,占满屏幕,设置滚动

问题描述: u-action-sheet组件绑定的选项过多的时候,会充满全屏

解决方案: 设置滚动

  1. 找到文件 /uni_modules/uview-ui/components/u-action-sheet/u-action-sheet.vue
  2. 找到 u-action-sheet__item-wrap 的类名(注意搜索时要精确匹配类名)
    <view class="u-action-sheet__item-wrap">
  3. 修改成
    <scroll-view class="u-action-sheet__item-wrap" scroll-y style="min-height: 100rpx;max-height: 700rpx;">
  4. 标签结尾的 </view> 也要替换成 </scroll-view>
  5. 可以重启项目看下!

替换的代码大致在 u-aciton-sheet.vue 组件的 35行左右,替换部分的代码大致如下:

			<slot><u-line v-if="description"></u-line><scroll-view class="u-action-sheet__item-wrap" scroll-y style="min-height: 100rpx;max-height: 700rpx;"><!-- <view class="u-action-sheet__item-wrap"> --><template v-for="(item, index) in actions"><!-- #ifdef MP --><button:key="index"class="u-reset-button":openType="item.openType"@getuserinfo="onGetUserInfo"@contact="onContact"@getphonenumber="onGetPhoneNumber"@error="onError"@launchapp="onLaunchApp"@opensetting="onOpenSetting":lang="lang":session-from="sessionFrom":send-message-title="sendMessageTitle":send-message-path="sendMessagePath":send-message-img="sendMessageImg":show-message-card="showMessageCard":app-parameter="appParameter"@tap="selectHandler(index)":hover-class="!item.disabled && !item.loading ? 'u-action-sheet--hover' : ''"><!-- #endif --><viewclass="u-action-sheet__item-wrap__item"@tap.stop="selectHandler(index)":hover-class="!item.disabled && !item.loading ? 'u-action-sheet--hover' : ''":hover-stay-time="150"><template v-if="!item.loading"><textclass="u-action-sheet__item-wrap__item__name":style="[itemStyle(index)]">{{ item.name }}</text><textv-if="item.subname"class="u-action-sheet__item-wrap__item__subname">{{ item.subname }}</text></template><u-loading-iconv-elsecustom-class="van-action-sheet__loading"size="18"mode="circle"/></view><!-- #ifdef MP --></button><!-- #endif --><u-line v-if="index !== actions.length - 1"></u-line></template><!-- </view> --></scroll-view></slot>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/diannao/56958.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

git分支模型

定义分支 长期分支 指长期存在的分支&#xff0c;也叫固定分支 developmaster 短期分支 短分支没有固定的分支名。但是有分支名规范 feature分支hotfix分支 分支模型 暂时无法在文档外展示此内容 参考 分支的目的是隔离&#xff0c;但多一个分支也意味着维护成本的增加。…

NFT Insider #152:The Sandbox Alpha 第4季开启

市场数据 加密艺术及收藏品新闻 Realm of Historia 推出首个以古老文化遗址为主题的 NFT 系列 专注于文化遗产保护的区块链平台 Realm of Historia 正通过推出首个 NFT 系列扩大其全球影响力。该系列以亚美尼亚的古代遗址 Carahunge 为主题&#xff0c;这一遗址已有 7500 多年…

EDM邮件营销,如何确保高频率发送不触发限制

EDM邮件营销需选对平台&#xff0c;遵守反垃圾邮件法规&#xff0c;高效管理邮件列表&#xff0c;合理制定发送频率&#xff0c;优化内容与设计&#xff0c;用智能化工具测试与优化&#xff0c;监控送达和反馈&#xff0c;维持良好ISP关系&#xff0c;确保高效安全发送不封号。…

13.3寸三防平板大尺寸+高速运行提升工业软件操作体验

在工业领域&#xff0c;移动设备的应用日益广泛&#xff0c;其性能直接影响着工作效率和数据安全。传统的工业平板电脑常常面临着屏幕尺寸过小、运行速度缓慢、以及抗环境能力不足等问题&#xff0c;这些都制约了工业软件的流畅运行和高效应用。而一款搭载先进硬件配置的13.3寸…

线性代数基础02_矩阵(下)向量

目录 一、矩阵&#xff08;下&#xff09; 1、伴随矩阵 2、逆矩阵 3、初等变换 4、矩阵的标准形 4.1行阶梯形矩阵 4.2简化行阶梯型矩阵 二、向量 1、定义 2、向量的运算 3、矩阵的特征值和特征向量 4、向量的模 5、向量的内积 一、矩阵&#xff08;下&#xff09;…

动态规划-子数组系列——乘积最大子数组

1.题目解析 题目来源&#xff1a;152.乘积最大子数组——力扣 测试用例 2.算法原理 1.状态表示 由于题目给的数组中可以包含负数&#xff0c;因此求最大乘积有两种情况&#xff1a; a.负数乘以最小数得出最大乘积 b.整数乘以最大数得出最大乘积 所以需要两个表分别求出最大最…

Ajax(web笔记)

文章目录 1.Ajax的概念2.Ajax 的作用3.原生Ajax4.Axios4.1Axios的概念4.2Axios入门 1.Ajax的概念 AsynchronousJavaScriptAndXML&#xff0c;异步的JavaScript和XML 2.Ajax 的作用 数据交换:过Ajax可以给服务器发送请求&#xff0c;并获取服务器响应的数据。异步交互:可以在…

R语言医学数据分析实践-R编程环境的搭建

【图书推荐】《R语言医学数据分析实践》-CSDN博客 《R语言医学数据分析实践 李丹 宋立桓 蔡伟祺 清华大学出版社9787302673484》【摘要 书评 试读】- 京东图书 (jd.com) R语言编程_夏天又到了的博客-CSDN博客 R语言对编程环境的要求不高&#xff0c;可以在多种操作系统平台上…

找寻孤独伤感视频素材的热门资源网站推荐

在抖音上&#xff0c;伤感视频总是能够引起观众的共鸣&#xff0c;很多朋友都在寻找可以下载伤感视频素材的地方。作为一名资深的视频剪辑师&#xff0c;今天我来分享几个提供高清无水印伤感素材的网站&#xff0c;如果你也在苦苦寻找这些素材&#xff0c;不妨看看以下推荐&…

【软件运行类文档】项目试运行方案,试运行计划书(word原件)

一、 试运行目的 &#xff08;一&#xff09; 系统功能、性能与稳定性考核 &#xff08;二&#xff09; 系统在各种环境和工况条件下的工作稳定性和可靠性 &#xff08;三&#xff09; 检验系统实际应用效果和应用功能的完善 &#xff08;四&#xff09; 健全系统运行管理体制&…

RabbitMQ进阶_延迟消息

文章目录 一、 死信交换机和延迟消息1.1、 死信交换机1.2、 延迟消息 二、 DelayExchange插件三、 实现时的优化 在电商的支付业务中&#xff0c;对于一些库存有限的商品&#xff0c;为了更好的用户体验&#xff0c;通常都会在用户下单时立刻扣减商品库存。例如电影院购票、高铁…

How to install Node.js and NPM on CentOS

How to install Node.js and NPM on CentOS Download Node.js 菜鸟教程-Node.js 安装配置 Introduction Node.js is a JavaScript runtime built on Chrome’s V8 JavaScript engine. Node.js uses an event-driven, non-blocking I/O model that makes it lightweight and…

今日指数项目集成SpringSecurity

项目集成SpringSecurity ​ 在第一章我们是基于SpringSecurity、JWT技术实现前后端无状态化认证授权&#xff0c;而我们当前的项目是前后端分离的架构&#xff0c;同样也可借助Security框架和Jwt实现前后端的无状态认证授权操作&#xff1b; 1、项目自定义认证过滤器 1.1 依…

特斯拉Robotaxi发布会2024:自动驾驶未来的开端

引言 2024年10月&#xff0c;特斯拉在洛杉矶举行了一场引发全球科技界高度关注的发布会&#xff0c;主题为“We Robot”。这场发布会展示了特斯拉的最新自动驾驶技术&#xff0c;包括无人驾驶出租车Cybercab和无人驾驶厢式货车Robovan&#xff0c;并且还展示了人形机器人Optim…

D43【python 接口自动化学习】- python基础之函数

day43 装饰器&#xff08;上&#xff09; 学习日期&#xff1a;20241020 学习目标&#xff1a;函数&#xfe63;- 56 装饰器&#xff1a;函数嵌套的定义与调用的区别 学习笔记&#xff1a; 变量作用域 变量读取顺序&#xff1a;local-》enclosed-》global-》builtin # 变量…

c语言经典100例

1.字符串转为数字 #include <stdio.h>int strToInt(char *s) {int num0;int sign1;int step1;if (*s -){sign -1;s;}while (*s > 0&&*s < 9){num num*10(*s-0);step 10;s;}return num*sign; }int main() {char a[10] "-1234";char *s a ;pr…

数据库知识点整理

DDL DDL-数据库操作 show databases ------------ 查看所有数据库 select database(); ----------查看当前数据库 create database 数据库名&#xff1b;---- 创建数据库 use 数据库名&#xff1b; --------------使用数据库 drop database 数据库名&#xff1b;--…

自由学习记录(11)

Surface Effector 2D Platform Effector 2D 向上跳跃穿过天花板的功能 平台效应器不用变Trigger&#xff0c;因为本来就是要有碰撞的 use one way grouping是让所有相关联的碰撞器都可以单面跳墙 默认不勾选&#xff0c;左右两边没有摩擦力和弹力&#xff0c;要自己先设置sid…

poisson过程——随机模拟(Python和R实现)

Python实现 exponential()使用&#xff0c;自动poisson过程实现。 import numpy as np import matplotlib.pyplot as plt# Parameters lambda_rate 5 # rate parameter (events per time unit) T 10 # total time# Generate Poisson process times np.random.exponential(…

SpringBoot+MyBatis+MySQL项目基础搭建

一、新建项目 1.1 新建springboot项目 新建项目 选择SpringBoot&#xff0c;填写基本信息&#xff0c;主要是JDK版本和项目构建方式&#xff0c;此处以JDK17和Maven举例。 1.2 引入依赖 选择SpringBoot版本&#xff0c;勾选Lombok&#xff0c;Spring Web&#xff0c;MyBa…