uniapp数据渲染点击改变当前值颜色

思路:
1.拿到数组的每一个对象,通过页面渲染拿到;
2定义一个变量,让其默认值为0,
3为每个对象定义一个点击事件并传一个索引值(index)
4通过点击事件将索引值赋值给变量
5定义一个样式
6通过绑定样式,如果点击的对象其 变量===索引值,那么将样式赋值,否则为空


			{{item}}
		
export default {
		data() {
			return {
				arr:[
				'航海王','火影忍者','七龙珠'
				],
				isActive:0
			}
		},
methods: {
			btn(index){
				console.log(index)
				this.isActive = index
				console.log(this.isActive)
			}
            
		},
.title {
		font-size: 36rpx;
		color: pink;
	}

你可能感兴趣的:(笔记,vue)