实现效果

代码如下

<template><view id='app'><view class="aa"></view><iconfont name="left"></iconfont>姓氏:<input style="background-color: antiquewhite;" type="text" v-model="aa" @focus="focus()" class="input1">+</view>
</template><script>export default {data() {return {}},methods: {focus(value){console.log(111)this.pageScroll()},pageScroll() {// 先获取目标dom的实例信息// data即为实例信息, data.top, data.left, data.right, data.bottom即为dom的对应坐标uni.createSelectorQuery().select('.input1').boundingClientRect(data => { console.log("data.top",data.top)// 调用页面滚动的apiuni.pageScrollTo({duration: 100, // 滚动动画过渡时间scrollTop: data.top, // 滚动的值})}).exec();},},}
</script>
<style >.aa{height: 1300rpx;width: 100%;background-color: red;}
</style>

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

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

相关文章

【基础篇三】WebSocket:实时通信的革命

目录 一、传统HTTP的"痛点"分析 1.1 HTTP的单向通信模式 1.2 "实时"效果的痛苦尝试 ​编辑 1.3 性能对比分析 二、WebSocket 协议详解 2.1 WebSocket是什么&#xff1f; ​编辑 2.2 WebSocket的核心特性 2.2.1 全双工通信&#xff08;Full-Duple…

设计模式(十八)行为型:中介者模式详解

设计模式&#xff08;十八&#xff09;行为型&#xff1a;中介者模式详解中介者模式&#xff08;Mediator Pattern&#xff09;是 GoF 23 种设计模式中的行为型模式之一&#xff0c;其核心价值在于通过引入一个中介者对象来封装一组对象之间的交互&#xff0c;从而降低对象间的…

Upload-Labs通关全攻略详细版

前端校验绕过:pass 01 两种思路:1.通过抓包,修改后缀 2.前端禁用js绕过前端后缀检验 首先写一个木马,改为图片格式GIF89a<?php eval($_POST[cmd])?>抓包之后改为PHP格式: 使用蚁剑连接木马,第一次尝试一直是返回数据为空,原因是没有链接到木马,于是寻找木马地址…

C#观察者模式示例代码

using System; using System.Collections.Generic; using System.Threading;namespace RefactoringGuru.DesignPatterns.Observer.Conceptual {// Observer观察者 也可以叫做订阅者 subscriberspublic interface IObserver{// Receive update from subject// 接收来自主题的更新…

电子电子架构 --- 软件项目的开端:裁剪

我是穿拖鞋的汉子,魔都中坚持长期主义的汽车电子工程师。 老规矩,分享一段喜欢的文字,避免自己成为高知识低文化的工程师: 简单,单纯,喜欢独处,独来独往,不易合同频过着接地气的生活,除了生存温饱问题之外,没有什么过多的欲望,表面看起来很高冷,内心热情,如果你身…

Open CV图像基本操作可莉版

Open CV图像基本操作一、处理单个像素值访问像素值修改像素值二、处理单个ROI区域&#xff08;自选区域&#xff09;提取 ROI修改 ROI三、 处理图像通道通道分离通道合并四、处理整体图像缩放图像旋转图像平移图像翻转一、处理单个像素值 图像是由像素组成的矩阵&#xff0c;每…

k8s:将打包好的 Kubernetes 集群镜像推送到Harbor私有镜像仓库

本文介绍了在离线环境中部署Harbor镜像仓库的完整流程。首先通过脚本创建多个Harbor项目&#xff0c;然后使用KubeKey工具将预打包的Kubernetes镜像(kubesphere.tar.gz)推送到Harbor仓库。接着配置containerd以支持从私有仓库拉取镜像&#xff0c;包括设置TLS证书和镜像仓库端点…

IntelliJ IDEA中管理多版本Git子模块的完整指南

1.背景介绍项目是父子工程。父工程XXX-ZZZ-CCC。子模块XXX-api在线上git网站管理,有多个分支版本。现在需要接收别人代码&#xff0c;导入到本机管理。可以实现本机切换&#xff0c;修改&#xff0c;上传。2.创建本地仓库并拉取所有版本2.1.创建目录在D:\ideaworkspace\midend-…

Android ADB命令之内存统计与分析

一、核心命令总览工具 / 命令用途示例adb shell dumpsys meminfo查看设备全局内存状态adb shell dumpsys meminfoadb shell dumpsys meminfo <package>获取应用详细内存分类统计adb shell dumpsys meminfo com.example.appadb shell top动态查看进程内存和 CPU 占用adb s…

算法思维进阶 力扣 300.最长递增子序列 暴力搜索 记忆化搜索 DFS 动态规划 C++详细算法解析 每日一题

目录零、题目描述一、为什么这道题值得你深入理解&#xff1f;二、题目拆解&#xff1a;提取核心关键点三、明确思路&#xff1a;从暴力到优化的完整进化3. 进一步优化&#xff1a;动态规划&#xff08;自底向上递推&#xff09;4. 终极优化&#xff1a;贪心 二分查找&#xf…

图解网络-小林coding笔记(持续更新)

大纲 #mermaid-svg-trl6Q4B1uDO1z05w {font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;fill:#333;}#mermaid-svg-trl6Q4B1uDO1z05w .error-icon{fill:#552222;}#mermaid-svg-trl6Q4B1uDO1z05w .error-text{fill:#552222;stroke:#552222;}#merm…

安宝特案例丨AR+AI+SOP?3大技术融合革新军工航天领域

军工、航空、航天领域存在 “小批量、多品种、依赖人工经验装配”的特性&#xff0c;这长期制约着生产效率与产品质量的提升。 技术融合应用案例 1 Arbigtec 装配效率提升类&#xff1a; 某型导弹制导系统装配&#xff1a;采用 AR 眼镜与 AI 视觉引导系统&#xff0c;200 精…

ip link show 查看/配置网络接口

ip link show&#xff08;或简写为 ip link&#xff09;是 Linux 系统中用于查看和配置网络接口&#xff08;网卡、虚拟接口等&#xff09;的命令&#xff0c;属于 iproute2 工具集的一部分。它是现代 Linux 系统中替代传统 ifconfig 命令的更强大工具。命令详解 基本语法 ip l…

电科金仓新一代数据库一体机:以 “云数据库 - AI 版” 引领 AI 时代数据库变革

前言 AI时代的数据库一体机市场&#xff0c;只能用两个词来形容&#xff1a;高手云集&#xff0c;战况激烈&#xff01; 国际巨头仍在高端市场占据主导地位&#xff0c;但在国产替代的冲击下&#xff0c;也开始另寻突破口&#xff1b;国内科技大厂攻势迅猛&#xff0c;通过开源…

IT运维的365天--033 跨交换机部署没有单独供电口的爱快AP到另一个地方去

前情提要&#xff1a;由于工作需要&#xff0c;领导要求在车间也添加一个无线网络供员工和设备使用&#xff0c;之前公司已经有一个爱快网络供员工使用&#xff0c;且物理隔绝部署在集团办公楼这边了。我一向是不喜欢碰到一个小事就拉一条网线&#xff0c;那样不得搞的跟蜘蛛网…

Flutter开发实战之路由与导航

第5章:路由与导航 在移动应用开发中,页面间的跳转是最基本也是最重要的功能之一。就像我们在现实生活中需要从一个房间走到另一个房间一样,在App中,用户需要在不同的界面间自由切换。Flutter提供了强大而灵活的路由系统来管理这些页面跳转,本章将深入探讨Flutter的路由与…

Android 图像编辑实战指南:从基础操作到进阶效果

在移动应用中&#xff0c;图像编辑功能已成为标配 —— 社交 APP 需要裁剪头像&#xff0c;电商 APP 需要给商品图加水印&#xff0c;工具 APP 需要提供滤镜效果。看似简单的 “裁剪”“缩放” 背后&#xff0c;实则涉及 Bitmap 像素操作、内存管理、性能优化等核心技术。很多开…

Java从入门到精通!第十八天(JDK17安装以及网络编程) 完结篇!!!

三、网络编程1&#xff0e;网络编程概述Java 是 Internet 上的语言&#xff0c;它从语言级上提供了对网络应用程序的支持&#xff0c;程序员能够很容易开发常见的网络应用程序。2&#xff0e;网络的基础&#xff08;1&#xff09;计算机网络把分布在不同地理区域的计算机与专门…

C++ STL常用容器总结(vector, deque, list, map, set)

C STL常用容器总结&#xff08;vector, deque, list, map, set&#xff09;1. vector&#xff08;动态数组&#xff09;特点定义和初始化常用操作遍历方法2. deque&#xff08;双端队列&#xff09;特点定义和初始化常用操作3. list&#xff08;双向链表&#xff09;特点定义和…

智能小车(F103C8T6)RT-THREAD版

前言 前面几章学会了PWM,超声波等&#xff0c;现在刚好结合起来控制智能小车 1&#xff1a;环境 KEIL5.38 RT-THREAD 3.1.3 STM32F103C8T6 2&#xff1a;硬件配件&#xff08;原来网上买的一套&#xff09; STM32F103C8T6 一个 MCU底板 一个 SG90 舵机 一个 红外避障 2个 hc-…