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

使用小程序实现左侧菜单，右侧列表双向联动效果

news 2026/3/30 22:49:20

目录

  • 引言
    • 理解双向联动效果的重要性
    • scrollview属性介绍
  • 实现左侧菜单
    • 数据准备
    • 渲染菜单列表
    • 监听菜单点击事件
  • 实现右侧列表
    • 数据结构设计
    • 初始数据渲染
    • 监听列表滚动事件
  • 左侧菜单与右侧列表联动
    • 获取当前滚动位置
    • 计算对应菜单项
    • 联动效果优化
  • 用户体验考虑
    • 平滑滚动效果
    • 菜单高亮状态

相关文章：

使用小程序实现左侧菜单，右侧列表双向联动效果

目录 引言理解双向联动效果的重要性scrollview属性介绍实现左侧菜单数据准备渲染菜单列表监听菜单点击事件实现右侧列表数据结构设计初始数据渲染监听列表滚动事件左侧菜单与右侧列表联动获取当前滚动位置计算对应菜单项联动效果优化用户体验考虑平滑滚动效果菜单高亮状态...

编程日记 2023/8/26 5:52:07

selenium中处理验证码问题

验证码 基本作用：可以实现当前访问页面的数据安全性、还可以减少用户的并发数； 类型：1、纯数字、纯字母；2、汉字组合；3、数学运算题；4、滑动；5、图片（选不同的、选相同、成语顺序&…...

编程日记 2023/8/26 5:51:05

EMR电子病历系统 SaaS电子病历编辑器源码 电子病历模板编辑器

EMR（Electronic Medical Record）指的是电子病历。它是一种基于电子文档的个人医疗记录，可以包括病人的病史、诊断、治疗方案、药物处方、检查报告和护理计划等信息。EMR采用计算机化的方式来存储、管理和共享这些信息，以便医生和医…...

编程日记 2023/8/26 5:50:04

一些自定义hooks

文章目录 1、点击框外隐藏弹窗hook 1、点击框外隐藏弹窗hook **描述：**有一个需要自己封装弹窗的组件，实现点击弹窗框外时隐藏弹窗 代码： import { useEffect } from “react”; // 点击框外hooks import { useEffect } from "react&q…...

编程日记 2023/8/26 5:49:02

基于Citespace、vosviewer、R语言的文献计量学可视化分析技术及全流程文献可视化SCI论文高效写作方法

文献计量学是指用数学和统计学的方法，定量地分析一切知识载体的交叉科学。它是集数学、统计学、文献学为一体，注重量化的综合性知识体系。特别是，信息可视化技术手段和方法的运用，可直观的展示主题的研究发展历程、研究现状、研究…...

编程日记 2023/8/26 5:48:00

lEC 61068-2-14_2023环境试验.第2-14部分:试验.试验N:温度变化, 最新版发布

https://download.csdn.net/download/m0_67373485/88251313 lEC 61068-2-14_2023环境试验.第2-14部分:试验.试验N:温度变化 A change of temperature test is intended to determine the effect on the specimen of a changeof temperature or a succession of changes of tem…...

编程日记 2023/8/26 5:46:59

CFDEM学习笔记

本文用来记录自己学习CFDEM的笔记。 资料总结 虚拟机：链接：https://pan.baidu.com/s/1MPMTJQfl76mW0H5bbT_rAg 提取码：rqli 开机密码：530944988 知乎博客：作者说明了如何关闭颗粒碰撞计算来达到提升计算速度。 Githu…...

编程日记 2023/8/26 5:45:58

SpringBoot入门篇1 - 简介和工程创建

目录 SpringBoot是由Pivotal团队提供的全新框架， 其设计目的是用来简化Spring应用的初始搭建以及开发过程。 1.创建入门工程案例 ①创建新模块，选择Spring初始化，并配置模块相关基础信息 ②开发控制器类 controller/BookController.jav…...

编程日记 2023/8/26 5:44:57

MyBatis-Plus updateById不更新null值

文章目录 前言方式一 调整全局的验证策略方式二 调整字段验证注解方式三 使用 UpdateWrapper 前言 在 MyBatis-Plus 中，使用updateById，null字段并不会更新，其实是和更新的策略有关，当然，也有插入策略，本文…...

编程日记 2023/8/26 5:43:56

用pytorch实现AlexNet

AlexNet经典网络由Alex Krizhevsky、Hinton等人在2012年提出，发表在NIPS，论文名为《ImageNet Classification with Deep Convolutional Neural Networks》，论文见：http://www.cs.toronto.edu/~hinton/absps/imagenet.pdf &#xf…...

编程日记 2023/8/26 5:42:55

LeetCode560.和为k的子数组

这道题我用的是暴力法，当然也是不断的提交不断发现问题改出来的，比如我之前是算到和大于目标值就break，其实不行因为后面还可以有负数，我把break删了。后面和为目标之后就答案1然后break然后下一次遍历，测试用例中就出…...

编程日记 2023/8/26 5:41:52

echarts 的dataZoom滑块两端文字被遮挡

问题： 期望： 解决方案： 1：调整宽度（4版本的没有width属性） 2. 参考：echarts图标设置dataZoom拖拽时间轴时自动调整两侧文字的位置_datazoom 位置_乌栖曲的博客-CSDN博客 设置文字的定位 cons…...

编程日记 2023/8/26 5:40:50

MongoDB基本使用

在 MongoDB 中我们可以使用use命令来创建数据库，如果该数据库不存在，则会创建一个新的数据库，如果该数据库已经存在，则将切换到该数据库。使用use命令创建数据库的语法格式如下： --use database_name use my_db1;数据…...

编程日记 2023/8/26 5:39:49

C++ 中的左值（Lvalues）和右值（Rvalues）

C 中有两种类型的表达式： 左值（lvalue）：左值参数是可被引用的数据对象，例如，变量、数组元素、结构成员、引用和解除引用的指针都是左值。非左值包括字面常量（用引号起的字符串除外，…...

编程日记 2023/8/26 5:38:47

html流光按钮

出处bilibili猫咪爱狗 <!DOCTYPE html> <html><head><style>body {/*内容居中&#xff0c;背景色*/height: 100vh;display: flex;justify-content: center; align-items: center;background-color: #000;}a { /*水平垂直居中*/position: re…...

编程日记 2023/8/26 5:37:46

HAProxy+nginx搭建负载均衡群集

目录 一、常见的Web集群调度器 二、HAProxy群集介绍 1、Haproxy的特性 : 2、Haproxy常用的调度算法 ① 轮询调度&#xff08;Round Robin&#xff09; ② 最小连接数&#xff08;Least Connections&#xff09; ③ 基于来源访问调度算法&#xff08;Source Hashing&am…...

编程日记 2023/8/26 5:36:44

logback-spring.xml 的配置及详解（直接复制粘贴可用）

logback-spring.xml 的配置及详解 一、注意实现二、配置及详解 一、注意实现 logback-spring.xml 中有三处需要根据实际业务进行修改&#xff0c;直接查找“&#xff08;根据业务修改&#xff09;”即可进行定位。 如果不想修改&#xff0c;直接复制粘贴到自己系统运行也可以&…...

编程日记 2023/8/26 5:35:36

C语言易错点整理

前言&#xff1a; 本文涵盖了博主在平常写C语言题目时经常犯的一些错误&#xff0c;在这里帮大家整理出来&#xff0c;一些易错点会帮大家标识出来&#xff0c;希望大家看完这篇文章后有所得&#xff0c;引以为戒~ 一、 题目&#xff1a; 解答&#xff1a; 首先在这个程序中…...

编程日记 2023/8/26 5:34:35

60.每日一练：回文数（力扣）

目录 问题描述 代码解决以及思想 解法&#xff08;一&#xff09; 知识点 解法&#xff08;二&#xff09; 问题描述 代码解决以及思想 解法&#xff08;一&#xff09; class Solution { public:bool isPalindrome(int x) {string arr to_string(x); // 将整数转换为…...

编程日记 2023/8/26 5:33:33

算法通关村第5关【青铜】| Hash和队列的特征

1.Hash基础 &#xff08;1&#xff09;基础 哈希也称为散列&#xff0c;通过算法变成固定长度的输出值&#xff0c;存入对应的位置 例如这个算法为取模算法&#xff0c;indexnumber 模 7 存入1到15 &#xff08;2&#xff09;碰撞处理 当多个元素映射到同一位置上时就产生…...

编程日记 2023/8/26 5:32:32

3种方案实现小米智能家居与Home Assistant无缝集成

3种方案实现小米智能家居与Home Assistant无缝集成 【免费下载链接】ha_xiaomi_home Xiaomi Home Integration for Home Assistant 项目地址: https://gitcode.com/GitHub_Trending/ha/ha_xiaomi_home 你是否遇到过智能家居设备品牌碎片化的困扰&#xff1f;是否希望用统…...

编程新知 2026/3/30 22:42:02

别再乱配了！华为防火墙+S5700三层交换机组网，这5个坑我帮你踩过了

华为防火墙与S5700三层交换机组网避坑指南&#xff1a;5个致命错误与解决方案 刚接手华为防火墙与S5700三层交换机的组网项目时&#xff0c;我以为按标准模板配置就能万事大吉。直到凌晨三点还在机房排查网络不通的故障&#xff0c;才明白教科书式的配置在实际环境中远远不够。…...

编程新知 2026/3/30 22:38:01

ros2 跟着官方教学从零开始 CS

ros2 从零开始10 服务者和消费者C/S 前言 上节课介绍写了简单的Topic订阅模型。本章我们将要学习C/S模型&#xff0c;即服务者和消费者模型 背景 前面服务概念时提到过&#xff0c;服务是ROS2 节点的另一种通信方式。服务基于调用与响应模型&#xff0c;而非发布者-订阅者主题模…...

编程新知 2026/3/30 22:30:00

从WordPress同步到数据库：一个真实案例拆解n8n节点间的“数据对话”

从WordPress到数据库&#xff1a;用n8n构建数据管道的实战解剖 当你点击WordPress后台的"发布"按钮时&#xff0c;一篇新文章如何穿越数字世界&#xff0c;精准落入目标数据库的表格中&#xff1f;这背后是一场由n8n节点编排的精密数据芭蕾。本文将带你走进一个真实的…...

编程新知 2026/3/30 21:47:06

实战：基于Local Path Provisioner与Helm的RustFS云原生存储部署详解

1. RustFS与云原生存储架构解析 第一次接触RustFS是在去年帮客户设计对象存储方案时&#xff0c;当时被它用Rust语言实现的内存安全特性吸引。作为一款兼容S3协议的开源分布式存储系统&#xff0c;RustFS在性能测试中表现出色——单节点吞吐量能达到1.2GB/s&#xff0c;延迟控制…...

编程新知 2026/3/30 21:10:56

Windows 11 零基础搞定 Coze Studio 本地部署：Docker 配置 + 豆包模型实战

Windows 11 零基础搞定 Coze Studio 本地部署&#xff1a;Docker 配置 豆包模型实战 1. 环境准备与Docker安装 对于Windows 11用户来说&#xff0c;Docker是运行Coze Studio的基础环境。与Linux或macOS不同&#xff0c;Windows平台需要特别注意虚拟化支持和镜像源配置。 硬…...

编程新知 2026/3/30 20:04:24

CopyManga下载器新手指南：从入门到精通的漫画收藏解决方案

CopyManga下载器新手指南&#xff1a;从入门到精通的漫画收藏解决方案 【免费下载链接】copymanga-downloader 使用python编译exe/bash/命令行参数来下载copymanga(拷贝漫画)中的漫画&#xff0c;支持批量选话下载和获取您收藏的漫画并下载&#xff01;(windows&linux支持&…...

编程新知 2026/3/30 19:21:24

AIGlasses_for_navigation 开发环境快速配置：Anaconda虚拟环境指南

AIGlasses_for_navigation 开发环境快速配置&#xff1a;Anaconda虚拟环境指南 你是不是也遇到过这种情况&#xff1a;好不容易在本地跑通了一个项目&#xff0c;换台电脑或者更新了几个库&#xff0c;结果就报了一堆莫名其妙的错误。或者&#xff0c;你想同时维护两个需要不同…...

编程新知 2026/3/30 18:02:34

Android14 SurfaceFlinger启动流程与线程调度机制解析

1. SurfaceFlinger的启动入口与初始化流程 Android显示系统的核心服务SurfaceFlinger由init进程启动&#xff0c;这个设计保证了它在系统早期就能准备好图形合成能力。main函数作为入口点&#xff0c;首先做了一系列关键初始化&#xff1a; 设置Binder线程池的最大线程数为4&…...

编程新知 2026/3/30 16:01:02

我的LVDS信号有振铃？可能是端接电阻没选对！从仿真到实测的端接方案选择指南

LVDS信号振铃问题全解析&#xff1a;从端接电阻选择到实测验证 振铃现象是LVDS信号传输中最令人头疼的问题之一。当你在示波器上看到信号边沿出现振荡波形时&#xff0c;第一反应可能是怀疑PCB布局或信号源质量。但经验丰富的工程师都知道&#xff0c;80%的振铃问题根源在于端接…...

编程新知 2026/3/30 14:56:37