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;
}
相关推荐
lili-felicity27 分钟前
React Native for Harmony:登录页“记住密码+深色模式适配”完整实现
javascript·react native·react.js
摘星编程31 分钟前
Flutter for OpenHarmony 实战:CustomScrollView 自定义滚动视图详解
android·javascript·flutter
xiaomin-Michael32 分钟前
websocket学习
javascript
xiaomin-Michael33 分钟前
JS setTimeout
javascript
Irene199134 分钟前
Vue3 <script setup> 中不需要使用 defineComponent
vue.js·definecomponent
confiself35 分钟前
前端代码渲染截图方案
前端
xkxnq1 小时前
第二阶段:Vue 组件化开发(第 21天)
前端·javascript·vue.js
wayne2141 小时前
Zustand在ReactNative中的工程实践与性能优化总结
javascript·react native·react.js
阿珊和她的猫1 小时前
深入理解 React 中的 Render Props 模式
前端·react.js·状态模式