uniapp 实现切换tab锚点定位到指定位置

1.主要使用uniapp scroll-view 组件的scroll-into-view属性实现功能

2.代码如下

javascript 复制代码
  <scroll-view
      :scroll-into-view="intoView"
    >
       <u-tabs

          class="tabs-list"
          @change="tabChange"
          :list="tabList"
        
        >
        </u-tabs>
        <view id="1"></view>
           <view id="2"></view>
           <view id="3"></view>
           <view id="4"></view>
    </scroll-view>
javascript 复制代码
      tabList: [
        {
          name: "1",
          id: "1",
        },
        {
          name: "2",
          id: "2",
        },
        {
          name: "3",
          id: "3",
        },
        {
          name: "4",
          id: "5",
        },
      ],
      intoView: "",
    tabChange(e) {
      this.intoView = e.id;
    },
相关推荐
恩创软件开发4 分钟前
创业日常2026-1-8
java·经验分享·微信小程序·小程序
想用offer打牌33 分钟前
一站式了解Spring AI Alibaba的流式输出
java·人工智能·后端
Lonely丶墨轩34 分钟前
从登录入口窥见架构:一个企业级双Token认证系统的深度拆解
java·数据库·sql
m0_738120721 小时前
应急响应——知攻善防靶场Linux-1详细应急过程
linux·运维·服务器·网络·web安全·ssh
GHL2842710901 小时前
无法连接服务端socket
linux·服务器·网络
kylezhao20191 小时前
S7-1200 CPU 与 S7-200 SMART S7通信(S7-1200 作为服务器)
运维·服务器
阿华hhh2 小时前
项目(购物商城)
linux·服务器·c语言·c++
掘根2 小时前
【仿Muduo库项目】EventLoop模块
java·开发语言
摸鱼仙人~2 小时前
大模型文章生成的风格个性化与多文体写作:一套可落地的方法论
linux·运维·服务器
信码由缰2 小时前
Java 中的 AI 与机器学习:TensorFlow、DJL 与企业级 AI
java