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

前端vue-关于标签切换的实现

 首先是循环,使用v-for=“(item,index)  in list”   :key=“item.id”

然后当点击哪个的时候再切换,使用v-bind:class="  "或者是:class="  ",如果都是用active的话,那么每一个标签都是被选中的状态,但是我们需要的是点中哪个再选中哪个,所以我们在后面加上一个条件,active:index===current,current在下面的data中需要先定义一下。

要想实现切换功能,我们给标签ui里面的li一个点击事件,@click=“current=index”。实现current变化,而不是控制台手动加减。


http://www.kler.cn/news/311842.html

相关文章:

  • 【Verilog学习日常】—牛客网刷题—Verilog快速入门—VL24
  • 基于CNN的10种物体识别项目
  • Spark-ShuffleWriter-UnsafeShuffleWriter
  • react是什么?
  • 数据结构、STL
  • 私域直播平台带源码
  • FRIDA-JSAPI:Java使用
  • leetcode:字符串中的第一个唯一字符
  • YOLOv10轻量化快速涨点之改进AKConv
  • Linux:vim编辑技巧
  • 【STL】priority_queue 基础,应用与操作
  • C++ 头文件 .h和.hpp的介绍与区别
  • 深度学习常见面试题及答案(11~15)
  • [Linux]自定义shell详解
  • HTML/CSS/JS学习笔记 Day4(CSS--C1 选择器声明)
  • .dav视频文件及格式转换
  • HashMap高频面试知识点
  • 【Ubuntu】ubuntu如何使用ufw(Uncomplicated Firewall)管理防火墙?一文带你学会!
  • Ubuntu-24.04中Docker-Desktop无法启动
  • 怎么操作使http变成https访问?
  • 力扣 中等 2300.咒语和药水的成功对数
  • OpenAI最新发布的o1-preview模型,和GPT-4o到底哪个更强?
  • 驱动---动态模块编译
  • win11开始按钮点不开(已解答)
  • sql中拼接操作
  • 从“治理”到“智理”,看大模型如何赋能智慧政务
  • Linux 信号的产生
  • Windows本地pycharm使用远程服务器conda虚拟环境
  • 【Android】Handler用法及原理解析
  • Rust编程的作用域与所有权