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

微信小程序4-内容溢出滚动条

感谢阅读,初学小白,有错指正。

一、功能描述

在前一篇文章的隐藏框页面的功能里(《微信小程序3-显标记信息和弹框》),我想添加一个内容溢出的时候,可通过滑动滚动条,实现查看溢出部分的内容,走了很多弯路。最大的问题就是在微信小程序编辑器中能够显示正常,但是进入安卓真机实测,就不能用。

二、修改内容

index.wxml修改

<scroll-view scroll-y="true" show-scrollbar="{{false}}" enhanced="{{true}}" animation="{{animationData}}" class="infobox" wx:if="{{showInfoBoxStatus}}"><text>隐藏页面具体展示内容</text><text>隐藏页面具体展示内容</text><text>隐藏页面具体展示内容</text><text>隐藏页面具体展示内容</text><text>隐藏页面具体展示内容</text><text>隐藏页面具体展示内容</text><text>隐藏页面具体展示内容</text><text>隐藏页面具体展示内容</text><text>隐藏页面具体展示内容</text><text>隐藏页面具体展示内容</text><text>隐藏页面具体展示内容</text><text>隐藏页面具体展示内容</text><text>隐藏页面具体展示内容</text><text>隐藏页面具体展示内容</text><text>隐藏页面具体展示内容</text><text>隐藏页面具体展示内容</text></scroll-view>

1、容器需要是scroll-view,而不是view。

2、scroll-y="true"用于表示y轴(竖直方向)开启溢出滚动的功能,scroll-y表示x轴(水平方向)

3、show-scrollbar="{{false}}" enhanced="{{true}}"两个加一起表示隐藏滚动条,不想隐藏就可以不用加这两个。

我用了很长时间排查问题,就是因为scroll-y="true"没加,这个非常重要,会导致微信小程序IDE工具预览滚动条正常,但是上实机测试就不能用。最终通过这个参数解决。

index.wxss修改

.infobox {overflow-y: scroll;position: fixed;height: 40%;width: 100%;bottom: 0;left: 0;background: rgba(219, 241, 243, 0.863);padding-top: 20rpx;position: absolute;
}

其中overflow-y: scroll;height: 40%;必须要有。我一开始height: 40%;

三、效果展示

相关文章:

微信小程序4-内容溢出滚动条

感谢阅读&#xff0c;初学小白&#xff0c;有错指正。 一、功能描述 在前一篇文章的隐藏框页面的功能里&#xff08;《微信小程序3-显标记信息和弹框》&#xff09;&#xff0c;我想添加一个内容溢出的时候&#xff0c;可通过滑动滚动条&#xff0c;实现查看溢出部分的内容&a…...

python源码实例游戏开发小程序办公自动化网络爬虫项目开发源码(250+个项目、26.6GB)

文章目录 源代码下载地址项目介绍预览 项目备注源代码下载地址 源代码下载地址 点击这里下载源码 项目介绍 python源码实例游戏开发小程序办公自动化网络爬虫项目开发源码(250个项目、26.6GB) 预览 项目备注 1、该资源内项目代码都经过测试运行成功&#xff0c;功能ok的情…...

ProjectSend 身份认证绕过漏洞复现(CVE-2024-11680)

0x01 产品描述: ProjectSend 是一个开源文件共享网络应用程序,旨在促进服务器管理员和客户端之间的安全、私密文件传输。它是一款相当流行的应用程序,被更喜欢自托管解决方案而不是 Google Drive 和 Dropbox 等第三方服务的组织使用。0x02 漏洞描述: ProjectSend r1720 之前…...

算法训练-搜索

搜索 leetcode102. 二叉树的层序遍历 法一&#xff1a;广度优先遍历 leetcode103. 二叉树的锯齿形层序遍历 法一&#xff1a;双端队列 法二&#xff1a;倒序 法三&#xff1a;奇偶逻辑分离 leetcode236. 二叉树的最近公共祖先 法一&#xff1a;递归 leetcode230. 二叉…...

【C++】map和set

个人主页 &#xff1a; zxctscl 如有转载请先通知 文章目录 1. 关联式容器2. 键值对3. set3.1 set的模板参数列表3.2 set的构造3.3 set的迭代器3.4 set的容量3.5 set修改操作3.6 multiset 4. map4.1 map的模板参数说明4.2 map的构造4.3 map的迭代器4.4 map的容量与元素访问4.5 …...

MongoDB安装|注意事项

《疯狂Spring Boot讲义》是2021年电子工业出版社出版的图书&#xff0c;作者是李刚 《疯狂Spring Boot终极讲义》不是一本介绍类似于PathVariable、MatrixVariable、RequestBody、ResponseBody这些基础注解的图书&#xff0c;它是真正讲解Spring Boot的图书。Spring Boot的核心…...

使用playwright自动化测试时,npx playwright test --ui打开图形化界面时报错

使用playwright自动化测试时&#xff0c;npx playwright test --ui打开图形化界面时报错 1、错误描述&#xff1a;2、解决办法3、注意符号的转义 1、错误描述&#xff1a; 在运行playwright的自动化测试项目时&#xff0c;使用npm run test无头模式运行正常&#xff0c;但使用…...

Linux ufw 命令详解

简介 UFW(Uncomplicated Firewall) 简单防火墙是一款基于 iptables 构建的、用于管理防火墙规则的用户友好型工具。它简化了在 Linux 系统上配置防火墙的过程。 安装 在 Ubuntu/Debian 上安装 sudo apt update sudo apt install ufw在 CentOS/Red Hat 上安装 sudo yum ins…...

3248. 矩阵中的蛇

3248. 矩阵中的蛇 题目链接&#xff1a;3248. 矩阵中的蛇 代码如下&#xff1a; class Solution { public:int finalPositionOfSnake(int n, vector<string>& commands){int i 0, j 0;for (string& command : commands){if (command "LEFT") { j…...

图片的懒加载

目录 懒加载的来源 事件监听 IntersectionObserver 懒加载的来源 图片的来加载其实就是延迟加载&#xff0c;我们知道浏览器的可视范围是有限的&#xff0c;现在网页的内容越来越丰富&#xff0c;一般网页的内容都是需要滚动才能完成浏览 如果网页有很多图片&#xff0c;然…...

网络脚本生成器

网络官网地址 网络配置生成工具 终端-接入-汇聚-核心-防火墙-互联网路由器 一 开局配置 华为设备配置命令 system-viewsysname SW-JR-Switchvlan 10 vlan 20 vlan 30 vlan 40 quitinterface Vlan-interface 40 ip address 192.168.40.1 255.255.255.0 quitip route-static 1…...

Kibana server is not ready yet

遇到“Kibana server is not ready yet”错误通常表示Kibana无法连接到Elasticsearch。以下是一些常见原因及其解决方案&#xff1a; 1.常见原因 1.1.Elasticsearch未运行&#xff1a; 确保Elasticsearch服务已启动并正常运行。您可以通过访问 http://localhost:9200 来检查…...

Git 高频命令及其功能、作用与使用场景

在软件开发的世界里&#xff0c;Git 已经成为了版本控制的代名词。无论你是开发小型项目还是参与大型团队协作&#xff0c;Git 都是你不可或缺的得力助手。今天我们来聊聊 Git 中的一些高频命令&#xff0c;了解它们的功能、作用以及常见的使用场景&#xff0c;帮助你在日常开发…...

将word里自带公式编辑器编辑的公式转换成用mathtype编辑的格式

文章目录 将word里自带公式编辑器编辑的公式转换成用mathtype编辑的格式MathType安装问题MathType30天试用延期MathPage.wll文件找不到问题 将word里自带公式编辑器编辑的公式转换成用mathtype编辑的格式 word自带公式编辑器编辑的公式格式&#xff1a; MathType编辑的格式&a…...

【HarmonyOS】Component组件引入报错 does not meet UI component syntax.

【HarmonyOS】Component组件引入报错 一、问题背景 有时会碰到引入组件时&#xff0c;无法import引入组件&#xff0c;导致引入的组件报错。 或者提示does not meet UI component syntax. &#xff08;不符合UI组件语法。&#xff09; 如下图所示&#xff0c;在引入组件时&a…...

力扣-图论-1【算法学习day.51】

前言 ###我做这类文章一个重要的目的还是给正在学习的大家提供方向和记录学习过程&#xff08;例如想要掌握基础用法&#xff0c;该刷哪些题&#xff1f;&#xff09;我的解析也不会做的非常详细&#xff0c;只会提供思路和一些关键点&#xff0c;力扣上的大佬们的题解质量是非…...

使用lumerical脚本语言创建定向耦合器并进行数据分析(纯代码实现)

本文使用lumerical脚本语言创建定向耦合器波导、计算定向耦合器的偶数和奇数模式、分析定向耦合器的波长依赖性、分析定向耦合器的间隙依赖性(代码均有注释详解)。 一、绘制定向耦合器波导 1.1 代码实现 # 这段代码主要实现了绘制定向耦合器波导几何结构的功能。通过定义各种…...

Java面试要点50 - List的线程安全实现:CopyOnWriteArrayList

文章目录 一、引入二、实现原理解析2.1 写时复制机制2.2 读写分离策略 三、性能测试分析四、应用场景分析4.1 事件监听器管理4.2 缓存实现 五、最佳实践建议5.1 性能优化技巧5.2 常见陷阱规避 总结 一、引入 在并发编程中,线程安全的集合类扮演着重要角色。CopyOnWriteArrayLi…...

python脚本实现csv中百度经纬度转84经纬度

数据准备 csv文件,带百度经纬度字段:bd09_x,bd09_y 目的 将百度经纬度转换为84经纬度,并在csv文件中添加两个字段:84_x,84_y python脚本 from ChangeCoordinate import ChangeCoordimport pandas as pd import numpy as npcoord = ChangeCoord()def bd09_to_wgs84...

Vue2和Vue3的区别

响应式系统 Vue 2 技术基础&#xff1a;使用 Object.defineProperty 实现响应式。局限性&#xff1a; 无法监听新增属性&#xff1a;如果在创建实例后添加新属性&#xff0c;这些属性不会自动成为响应式的。数组变更检测问题&#xff1a;直接通过索引设置值或长度不会触发更新…...

JavaEE-经典多线程样例

文章目录 单例模式设计模式初步引入为何存在单例模式饿汉式单例模式饿汉式缺陷以及是否线程安全懒汉式单例模式基础懒汉式缺陷以及是否线程安全懒汉式单例模式的改进完整代码(变量volatile) 阻塞队列生产者消费者模型生产者消费者模型的案例以及优点请求与响应案例解耦合削峰填…...

Android显示系统(04)- OpenGL ES - Shader绘制三角形

一、前言&#xff1a; OpenGL 1.0采用固定管线&#xff0c;OpenGL 2.0以上版本重要的改变就是采用了可编程管线&#xff0c;Shader 编程是指使用着色器&#xff08;Shader&#xff09;编写代码来控制图形渲染管线中特定阶段的处理过程。在图形渲染中&#xff0c;着色器是在 GP…...

PMP–一、二、三模、冲刺–分类–10.沟通管理

文章目录 技巧十、沟通管理 一模10.沟通管理--1.规划沟通管理--文化意识--军事背景和非军事背景人员有文化差异5、 [单选] 项目团队由前军事和非军事小组成员组成。没有军事背景的团队成员认为前军事团队成员在他们的项目方法中过于结构化和僵化。前军事成员认为其他团队成员更…...

flutter windows 使用c++、dll等实践记录

在flutter的windows平台引入dll文件 https://juejin.cn/post/7223676609794015287 google官方说法&#xff08;感觉不太实用&#xff09; https://groups.google.com/a/dartlang.org/g/misc/c/fyh2W38AEVo Using a C DLL in Flutter Windows desktop app&#xff08;未尝试&…...

JUnit介绍:单元测试

1、什么是单元测试 单元测试是针对最小的功能单元编写测试代码&#xff08;Java 程序最小的功能单元是方法&#xff09;单元测试就是针对单个Java方法的测试。 2、为什么要使用单元测试 确保单个方法运行正常&#xff1b; 如果修改了代码&#xff0c;只需要确保其对应的单元…...

电脑插入耳机和音响,只显示一个播放设备

1. 控制面板-硬件和声音-Realtek高清音频-扬声器-设备高级设置-播放设备里选择使用前部和后部输出设备同时播放两种不同的音频流 在声音设置中就可以看到耳机播放选项...

【每日刷题】Day162

【每日刷题】Day162 &#x1f955;个人主页&#xff1a;开敲&#x1f349; &#x1f525;所属专栏&#xff1a;每日刷题&#x1f34d; &#x1f33c;文章目录&#x1f33c; 1. 3302. 字典序最小的合法序列 - 力扣&#xff08;LeetCode&#xff09; 2. 44. 通配符匹配 - 力扣&…...

使用 EasyExcel 实现高效的 Excel 读写操作

在日常开发中&#xff0c;Excel 文件的读写操作是一个常见的需求。EasyExcel 是阿里巴巴开源的一个高性能、易用的 Excel 读写库&#xff0c;可以大幅提高处理 Excel 文件的效率。它通过事件驱动模型优化了大数据量 Excel 的读写性能&#xff0c;非常适合处理大文件或高并发场景…...

千益畅行,旅游卡有些什么优势?

千益畅行共享旅游卡是一种创新的旅游服务模式&#xff0c;旨在通过整合各类旅游资源&#xff0c;为用户提供一站式的旅游解决方案。这张旅游卡支持2至6人同行&#xff0c;涵盖了接机、酒店、用餐、大巴、导游、景区门票等服务&#xff0c;用户只需自行承担往返交通费用即可享受…...

Hive分区裁剪(Partition Pruning)详解

Hive分区裁剪是一种优化技术&#xff0c;旨在查询时只读取与条件匹配的分区&#xff0c;从而减少不必要的数据扫描。这种机制依赖于分区表的设计和查询优化器的工作&#xff0c;特别是在处理大规模数据时&#xff0c;分区裁剪可以显著提高查询性能。 1. 什么是分区裁剪&#xf…...

云原生数据库 PolarDB

PolarDB 是阿里云推出的一款云原生数据库&#xff0c;旨在为企业提供高性能、高可靠性的数据库解决方案。它基于云计算环境设计&#xff0c;特别适用于云上的大规模数据处理和存储需求。PolarDB 是一种兼具关系型数据库&#xff08;RDS&#xff09;和分布式数据库特性的新型数据…...

数据库原理-期末基础知识

1、数据库管理系统有哪些功能&#xff1f; 数据定义功能、数据操作功能、数据库的运行管理、数据库的建立与维护。 2、数据库设计分哪几个阶段&#xff1f; 需求分析->概念设计->逻辑设计->物理设计->数据库实施->数据的运营与维护 3、简述三级封锁协议的内…...

Java版-速通数据结构-树基础知识

现在面试问mysql,红黑树好像都是必备问题了。动不动就让手写红黑树或者简单介绍下红黑树。然而&#xff0c;我们如果直接去看红黑树&#xff0c;可能会一下子蒙了。在看红黑树之前&#xff0c;需要先了解下树的基础知识&#xff0c;从简单到复杂&#xff0c;看看红黑树是在什么…...

量化交易系统开发-实时行情自动化交易-8.4.MT4/MT5平台

19年创业做过一年的量化交易但没有成功&#xff0c;作为交易系统的开发人员积累了一些经验&#xff0c;最近想重新研究交易系统&#xff0c;一边整理一边写出来一些思考供大家参考&#xff0c;也希望跟做量化的朋友有更多的交流和合作。 接下来会对于MT4/MT5平台介绍。 MetaT…...

Git 的基本概念和使用方式

Git是一个分布式版本控制系统&#xff0c;用于跟踪文件内容的变化和协作开发。 Git的主要概念包括&#xff1a; 仓库&#xff08;Repository&#xff09;&#xff1a;存储代码和历史记录的地方。可以是本地仓库&#xff08;Local Repository&#xff09;或远程仓库&#xff08…...

Conda-Pack打包:高效管理Python环境

在Python开发中&#xff0c;环境管理是一个不可忽视的重要环节。Conda是一个流行的包管理器和环境管理器&#xff0c;它允许用户创建隔离的环境&#xff0c;以避免不同项目之间的依赖冲突。Conda-pack是一个工具&#xff0c;可以帮助我们将一个conda环境打包成一个可移植文件&a…...

Python语法基础---正则表达式

&#x1f308;个人主页&#xff1a;羽晨同学 &#x1f4ab;个人格言:“成为自己未来的主人~” 我们这个文章所讲述的&#xff0c;也是数据分析的基础文章&#xff0c;正则表达式 首先&#xff0c;我们在开始之前&#xff0c;引出一个问题。也是我们接下来想要解决的问题。…...

深入理解ROS中的参数服务器及其应用

深入理解ROS中的参数服务器及其应用 在Robot Operating System (ROS) 中&#xff0c;参数服务器&#xff08;Parameter Server&#xff09;是一个中心化服务&#xff0c;它允许节点在运行时存储和检索配置信息。这种机制是为了支持数据的共享和灵活的参数管理而设计的&#xf…...

Kafka 常见面试题深度解析

一、基础概念 1. 请简要介绍 Kafka 的基本架构。 Kafka 主要由生产者&#xff08;Producer&#xff09;、消费者&#xff08;Consumer&#xff09;、代理&#xff08;Broker&#xff09;、主题&#xff08;Topic&#xff09;和分区&#xff08;Partition&#xff09;等组成。…...

数学建模之熵权法

熵权法 概述 **熵权法(Entropy Weight Method,EWM)**是一种客观赋权的方法&#xff0c;原理&#xff1a;指标的变异程度越小&#xff0c;所包含的信息量也越小&#xff0c;其对应的权值应该越低&#xff08;例如&#xff0c;如果对于所有样本而言&#xff0c;某项指标的值都相…...

交易所 Level-2 历史行情数据自动化导入攻略

用户部署完 DolphinDB 后&#xff0c;需要将历史股票数据批量导入数据库&#xff0c;再进行数据查询、计算和分析等操作。DolphinDB 开发了 ExchData 模块&#xff0c;主要用于沪深交易所 Level-2 行情原始数据的自动化导入&#xff0c;目前已支持的数据源包括&#xff1a; 沪…...

从 scratch开始构建一个最小化的 Hello World Docker 镜像-docker的镜像源头

在这篇文章中&#xff0c;我们将学习如何从零开始构建一个最小化的 Docker 镜像&#xff0c;基于 scratch 镜像&#xff0c;并在其中运行一个简单的 “Hello World” 程序。 Scratch 是一个空白的基础镜像&#xff0c;适用于构建轻量化、独立的容器。由于 scratch 不包含任何系…...

【openGauss︱PostgreSQL】openGauss或PostgreSQL查表、索引、序列、权限、函数

【openGauss︱PostgreSQL】openGauss或PostgreSQL查表、索引、序列、权限、函数 一、openGauss查表二、openGauss查索引三、openGauss查序列四、openGauss查权限五、openGauss或PostgreSQL查函数六、PostgreSQL查表七、PostgreSQL查索引八、PostgreSQL查序列九、PostgreSQL查权…...

MySQL - 性能优化

使用 Explain 进行分析 Explain 用来分析 SELECT 查询语句&#xff0c;开发人员可以通过分析 Explain 结果来优化查询语句。 比较重要的字段有: select_type : 查询类型&#xff0c;有简单查询、联合查询、子查询等 key : 使用的索引 rows : 扫描的行数 type &#xff1a;…...

数据结构:二叉树遍历

在 JavaScript 中实现二叉树的遍历&#xff0c;可以使用递归或迭代的方式。以下是三种常见的遍历方式&#xff1a;前序遍历&#xff08;Pre-order&#xff09;、中序遍历&#xff08;In-order&#xff09;和后序遍历&#xff08;Post-order&#xff09;。 定义二叉树节点类 c…...

【热门主题】000075 探索嵌入式硬件设计的奥秘

前言&#xff1a;哈喽&#xff0c;大家好&#xff0c;今天给大家分享一篇文章&#xff01;并提供具体代码帮助大家深入理解&#xff0c;彻底掌握&#xff01;创作不易&#xff0c;如果能帮助到大家或者给大家一些灵感和启发&#xff0c;欢迎收藏关注哦 &#x1f495; 目录 【热…...

mac启动jmeter

// 设置使用java8&#xff0c;使用21版本会有问题 export JAVA_HOME/Library/Java/JavaVirtualMachines/jdk1.8.0_221.jdk/Contents/Home/ export PATH$JAVA_HOME/bin:$PATH cd /Users/user/software/apache-jmeter-5.1.1 //设置不使用代理 sh jmeter -Jhttp.proxyHost -J…...

JavaScript的作用域与闭包

文章目录 一. 什么是作用域?二. var a 2是如何赋值并添加到作用域中的?三. 作用域链四. js中的各种作用域五. 闭包?六. 参考 今天开始读了《你所不知道的JavaScript(上卷)》的一部分, 自己对于 JS 的理解还是非常浅薄的; 本着学习与分享的目的, 对这本书的第一章的内容进行…...

Qt入门7——Qt事件

目录 1. Qt事件介绍&#xff1a; 2. 事件的处理 示例1&#xff1a;鼠标进入(enterEvent)与离开事件(leaveEvent) 示例2&#xff1a;鼠标点击事件(mousePressEvent) 示例3&#xff1a;鼠标移动事件(mouseMoveEvent) 3. 按键事件 4. 定时器 5. 窗口事件 1. Qt事件介绍&a…...

【Linux操作系统】多线程控制(创建,等待,终止、分离)

目录 一、线程与轻量级进程的关系二、进程创建1.线程创建线程创建函数&#xff08;pthread&#xff09;查看和理解线程id主线程与其他线程之间的关系 三、线程等待&#xff08;回收&#xff09;四、线程退出线程退出情况线程退出方法 五、线程分离线程的优点线程的缺点 一、线程…...