vue两个按钮切换_在vue中实现多个按钮样式的点击切换?

2023-11-07

1.在vue中实现多个按钮样式的点击切换?有多个按钮,点击其中一个出现下划线,而另一个回到原始状态。

点击其中一个两个同时出现下划线样式:

再次点击两个都还原成最初的样式,即有下划线:

如何实现只有被点击的那一个才会出现下划线样式?

这个我写的代码

// 请把代码文本粘贴到下方(请勿用图片代替代码)

import HeaderTop from '../../components/HeaderTop/HeaderTop.vue'

import email from '../../pages/Login/email.vue'

import number from '../../pages/Login/number.vue'

export default {

name: "Login",

data(){

return{

comName:'number',

isShow:true,

flag:true

}

},

methods:{

changeColor:function(){

if(th

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

vue两个按钮切换_在vue中实现多个按钮样式的点击切换? 的相关文章

  • 房屋交接时需要注意些什么?

    在房屋交接时应该注意以下几点 一 进行水电煤气抄表 并计算金额 确定上下家各自承担的份额 上下家应在双方交接房屋时做好此项工作 以免交房后双方就这些小费用产生扯皮 二 办理有线电视的结算和更名手续 买卖双方在房屋买卖交易后一般不会忘了结算水
  • C++ 学习之旅(1)——编译器Compiler

    简单来说 由C 代码文件生成可执行文件的过程如下 mermaid svg GQamCVEXMVkYEemz font family trebuchet ms verdana arial sans serif font size 16px f
  • C语言字符串的经典例题

    1 统计单词的个数 include
  • 《编程珠玑》--读书笔记12章:取样问题

    第十二章 作者提出了一个问题 程序的输入包含两个整数m和n 其中m lt n 输出是0 n 1范围内的m个随机整数 不允许重复 有两种方法达到目的 1 思路 从r个剩余的整数中选出s个 以概率s r来选择下一个数 比如 m 2 n 5 选择
  • SaaS企业怎么做决策

    帆软会议室的墙上出现了 永不上市 利润分享 的字样 所有参观的SaaS创业者都被这八个字吸引 纷纷拿出手机拍照 帆软创始人薛宝表示 在帆软全国30多家办公室的墙上都贴着这8个大字 2006年 帆软用薛宝仅有的5000元积蓄创办了这家公司 从
  • linux进程及进程间同步通信机制

    进程 一 进程的存储器安排 这是 UNIX环境高级编程 中介绍的典型存储器安排 但现实也不一定非要如此 对于c c 来说 数据的存储方式还是认为3种 堆 栈 全局数据区 包括全局数据 静态数据 常量 二 僵尸进程和孤儿进程 进程在终止前向父
  • shiro基础

    shiro基础 shiro中有三大核心架构 subjects security manager realms 分别代表 使用shiro的主体 核心安全管理器和数据和安全管理的连接 使用shiro首先需要引入shiro需要的依赖 可以通过ma
  • 前端如何进行用户权限管理

    1 问题 假如在做一个管理系统 面向老师学生的 学生提交申请 老师负责审核 或者还需要添加其他角色 功能权限都不同 现在的问题是 每种角色登录看到的界面应该都是不一样的 那这个页面的区分如何实现呢 2 要不要给老师和学生各自设计一套页面 这
  • [论文阅读]《Database Maanagement Systems》-第九章

    第九章 TREE STRUCTURED INDEXING 树结构索引 P271 301 gracefully 优雅的 适当的 because it adjusts well to changes 因为它能很好地适应变化 page bound
  • 2013年11月21日星期四(地图)

    初始 DDraw BOB bob BOB textures tool mytool char buffer 80 BITMAP FILE bitmap8bit int world x 0 current position of viewin
  • 【vue2对接萤石云接口,实现摄像头直播页面的调取显示】

    vue2对接萤石云接口 实现摄像头直播页面的调取显示 使用ezuikit js插件 accessToken url 附上最新代码和demo 公司前端vue项目需要实现萤石云接口对接 买好萤石摄像头 注册萤石云账号并将设备添加到萤石云平台 开
  • 端口被占用怎么办?关闭占用端口的进程

    当你发现某个端口被占用时 但不知道是哪一个进程占用了端口 需要关闭占用该端口的进程 1 启动系统命令行 windows系统 win r 2 输入命令 netstat ano 可查看所有端口的使用情况 netstat aon findstr
  • Buck电路

    如果我们希望得到一个20V的直流电压源 我们能想到什么办法 很简单 从220V市电开始 通过变压器降压得到有效值为20V的电压 通过整流桥整流得到不稳定的直流电 接着用一个大的电解电容滤波 就可以得到20V的电压 那么如果我们现在希望得到一
  • 微信python小课_微信上其实还有很多你不知道的事,Python微信平台开发编写实录...

    本文主要讲述如何利用Python开发微信公众平台 说明 如果你是Python小白 爬虫小白 觉得本节课程的代码晦涩难懂 没关系 不需要懂 按照步骤一步步操作就可以了 这一节我们主要是搭框架 几乎没有真正的爬虫代码 这些代码和操作 你可能一生
  • POI生成excel表格——简单例子

    导入包 poi 2 5 1 jar User类 提供数据用 package com xk poi import java util ArrayList import java util List public class User priv
  • Linux 关于读者与写者同步互斥问题的解析

    在操作系统课程中 读者与写者问题 或是称作生产者与消费者问题 一直是同步与互斥问题的经典例子 在大学的操作系统课程中也是作为经典例子进行讲解 今天我们就来解析一下读者与写者的互斥同步关系 首先要做的是先了解一下问题的内容 首先需要肯定的是先
  • pycharm的使用技巧与遇到的问题

    文章目录 pycharm的console控制台无法使用 python运行时报错can t find main module in xxx 的解决办法 设置用ctrl 鼠标滚轮调整代码字体大小 console中无法导入常用标准库 刚安装的py
  • 【C++基础】公有继承,保护继承,私有继承

    目录 公有继承 public 保护继承 protected 私有继承 private 公有继承 保护继承 私有继承小结 公有继承 public 公有继承 对父类的公有成员和保护成员的访问属性不变 子类 派生类 的新增成员可以访问基类的公有成
  • Python中的UI设计程序Designer配置

    1 确认安装了Designer 我的基本开发环境是由安装Anaconda后一体化配置的 因此随之也安装了Designer应用程序 具体到我的电脑而言 安装后的路径是 E Python Anaconda3 Scripts designer e

随机推荐