第七节 卡片选中,设置默认

1.卡片选中
html:
<li v-for="(item,index) in filterAddress" v-bind:class="{'check':index==currentIndex}" @click="currentIndex=index">
<!--循环判断currenIndex,控制当前选中卡片的样式-->
js:
data:{
currentIndex:0,
},


2.设置默认
html:
<div class="addr-opration addr-set-default" v-if="!item.isDefault">
<a href="javascript:;" class="addr-set-default-btn" @click="setDefault(item.addressId)"><i>设为默认</i></a>
</div>
<div class="addr-opration addr-default" v-if="item.isDefault">默认地址</div>
js:
setDefault: function (addressId) {
this.addressList.forEach(function (address,index) {
if(address.addressId==addressId){
address.isDefault=true;
}else{
address.isDefault=false;
}
})
}
效果:
 

最新文章

  1. 在线教学、视频会议 Webus Fox(3) 客户端开发手册
  2. mysql sys table
  3. Sass 默认样式库
  4. Java 图片切圆角,消除锯齿
  5. k-d tree算法
  6. hdu5024(dp)
  7. 手机web——自适应网页设计(html/css控制) - 51CTO.COM
  8. NRF24L01无线通讯模块驱动
  9. LAMP学习小记
  10. java.IO层次体系结构
  11. Linux设备树(三 属性)
  12. js 取得当天0点 / 23:59:59 时间
  13. ASP.NET Core 2.1 使用Docker运行
  14. 通过几个例子看sed的模式空间与保持空间
  15. 移动端web禁止长按选择文字以及弹出菜单
  16. 机器学习进阶-图像基本操作-数值计算 1.cv2.add(将图片进行加和) 2.cv2.resize(图片的维度变换) 3.cv2.addWeighted(将图片按照公式进行重叠操作)
  17. 8.css内容移出与精灵图
  18. Window10中创建目录连接点
  19. SV中的随机化
  20. JAVA复习笔记:内存结构和类加载

热门文章

  1. 云脉推出表格识别API接口可以自助接入
  2. OSG和osgearth显示中文(转载)
  3. animate的{queue:false,duration:400}意思
  4. iOS 环信消息撤回
  5. hadoop在windows下安装运行
  6. Nancy简单实战之NancyMusicStore(一):准备工作和搭建项目
  7. vue.js环境搭建
  8. BZOJ-2768: [JLOI2010]冠军调查(超级裸的最小割)
  9. twemproxyRedis协议解析探索——剖析twemproxy代码正编
  10. MATLAB绘制等高线和梯度场