单选框样式改变，逻辑

最新推荐文章于 2023-06-27 14:10:05 发布

柚子只会ctrl c+v

最新推荐文章于 2023-06-27 14:10:05 发布

阅读量340

点赞数

文章标签：前端 java html

本文链接：https://blog.csdn.net/qq_58620659/article/details/126367974

版权

设定一个在data中参数index93为是否改变样式，当点击其中一个按钮时，将该按钮的index赋值给index93,然后在行内通过三元表达式判断，如果index == index93时，样式改变，若是不相等，样式则为空

//H5结构
<view class="title">选择加油金额</view>
<view class="con" 
    :class="index == index93?'celectMoney':''" //通过判断index是否是选中的序号来改变样式
    v-for="(item,index) in moneyLists" :key="index" @click="setType3(index)">
	{{parseFloat(item.price)}}
</view>

//Js逻辑
 data () {
    return {
      index93：0 //选中样式变色的序号
   }
}
 methods： {
//通过传过来的index来设置改变样式的index93
setType3(index) {
		this.index93 = index
	}
}