van-tabbar-item选中active数据变了,图标没变

van-tabbar-item选中active状态没变

1.在 van-tabbar 中,你需要使用 v-model 来绑定当前激活的 tab 的索引。确保你为 van-tabbar 组件绑定了正确的索引,并且这个索引是动态更新的。例如:

复制代码
    <van-tabbar v-model="active" @change="onChange">
      <van-tabbar-item icon="home-o">标签</van-tabbar-item>
      <van-tabbar-item icon="search">标签</van-tabbar-item>
      <van-tabbar-item icon="friends-o">标签</van-tabbar-item>
      <van-tabbar-item icon="setting-o">标签</van-tabbar-item>
    </van-tabbar>

2. 检查 active 值的动态更新

复制代码
export default {
  data() {
    return {
      active: 0 // 默认选中第一个标签
    };
  },
 methods: {
   
    onChange(event) {
      // event 的值为当前选中项的索引
      this.active = event
      console.log(this.active, 'active')

    },
  }
}
相关推荐
一 乐1 小时前
动漫书销售商城|基于springboot + vue动漫书销售商城(源码+数据库+文档)
java·数据库·vue.js·spring boot·毕业设计
卓怡学长1 小时前
w214基于jsp知道特产网
java·intellij-idea
步行cgn1 小时前
Spring 注解使用详解
java·spring
一条小小yu2 小时前
Spring IoC的理解
java·后端·spring
跨境小彭2 小时前
Temu拉美站点铺货实操复盘:手动复制痛点与批量自动化解决方案
服务器·人工智能·搜索引擎·自动化·temu电商运营
落魄实习生2 小时前
Agent Scope Java 2.x 系列【7】工具使用
java·开发语言·ai
前端snow2 小时前
ai agent --- postgreSQL 关系型数据库
前端
心之语歌2 小时前
Tkinter 画布基本梳理
运维·服务器·python
旺仔学长 哈哈2 小时前
springboot钓鱼爱好者交流平台APP设计与实现
java·spring boot·mysql·充电桩管理系统
卷无止境3 小时前
ECharts:把数据变成故事的可视化利器
前端