美文网首页
Vue列表多想选中和单向选中效果

Vue列表多想选中和单向选中效果

作者: Madrigal_cdfa | 来源:发表于2019-10-17 11:20 被阅读0次

问题:Vue项目会遇到一些选中高亮效果,将选项列表写入组件,需要让组件即支持单选也支持多选,通过传入props参数取分单选还是多选。

解决:通过一个参数来取分是单选还是多选,再通过一个数组来存放选中的列表索引(index),给列表绑定class,使存放索引列表中包含的索引的item显示高亮class

:class="[selectIndex.indexOf(index)>-1?'selected':' ']"

然后只需要操作存放index 的数组就可以了,单选就替换,多选就添加。

相关文章

网友评论

      本文标题:Vue列表多想选中和单向选中效果

      本文链接:https://www.haomeiwen.com/subject/pcsmmctx.html