vue循环列表点击选中,默认选中第一个

场景:vue循环列表点击选中某个区域,默认选中第一个区域效果

html代码

javascript 复制代码
 <div
                    class="muban_box"
                    v-for="(item, index) in arrTempList"
                    :class="{ act: actBoder == index }"
                    :key="index"
                    @click="show(item, index)"
                  >

js代码:

data数据

javascript 复制代码
actBoder:0

methods方法

javascript 复制代码
show(item, index){
	this.actBoder=index;
}

css

javascript 复制代码
.act{
border:2px solid red;
}
相关推荐
0思必得05 分钟前
[Web自动化] Selenium设置相关执行文件路径
前端·爬虫·python·selenium·自动化
雯0609~15 分钟前
hiprint:实现项目部署与打印1-官网提供普通html版本
前端·html
yuezhilangniao23 分钟前
AI智能体全栈开发工程化规范 备忘 ~ fastAPI+Next.js
javascript·人工智能·fastapi
不绝1911 小时前
UGUI——进阶篇
前端
~牧马~1 小时前
【记录63】electron打包vue项目之踩坑
vue.js·electron·electron与node兼容
Exquisite.1 小时前
企业高性能web服务器(4)
运维·服务器·前端·网络·mysql
铅笔侠_小龙虾2 小时前
Flutter Demo
开发语言·javascript·flutter
2501_944525542 小时前
Flutter for OpenHarmony 个人理财管理App实战 - 账户详情页面
android·java·开发语言·前端·javascript·flutter
计算机学姐2 小时前
基于SpringBoot的电影点评交流平台【协同过滤推荐算法+数据可视化统计】
java·vue.js·spring boot·spring·信息可视化·echarts·推荐算法
2601_949857432 小时前
Flutter for OpenHarmony Web开发助手App实战:快捷键参考
前端·flutter