vue列表添加多个选中状态

在这里插入代码片
1.在vue template中添加选择种状态
<template>
在点击的状态中添加选中状态
<li class="Course-left-er-ul-lin" 
    v-for="(item,index) in Courselist" 
       :key="index"
   >
    <span 
         :class="{'Course-left-er-ul-link':selected.indexOf(item)!=-1}"
         @click="Courseuy(index,item)">{{item.title}}
   	</span>
 </li>
</template>
2.在vue  data里面添加数组
data(){
	return{
		 selected:[],
           huio:[],
	}
}
3.在methods添加点击事件
Courseuy:function(index,item){
            // // 添加状态
            // if(this.selected.indexOf(item) !==-1){
            //     this.selected.splice(this.selected.indexOf(item),1)//取消
            // }else{
            //     this.selected.push(item)//添加数组中
            // }
            // // 遍历数组
            // this.huio=this.selected.map(yui=>{
            //     return (yui.code)
            // })
            // // console.log(this.huio)
            // // 数组求和
            // this.rtyy=this.huio.reduce((x,y)=>{
            //     return(x+y)
            // },0)//0为初始值,无初始值报错

        },
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值