vue案例 - 使用vue实现自定义多选与单选的答题功能
4月底立得flag,五月底插上小旗,结果拖到六月底七月初才来执行。说什么工作忙都是借口,就是睡的比猪早,起的比猪晚。 本来实现多选单选这个功能,vue组件中在表单方面提供了一个v-model指令,非常的善解“猿”意, 能把我们的多选单选功能很完美且很强大得双向绑定起来,实现多选、单选、任意选...根本不在话下。 但是,凡事都有一个但是! 但是奈何这个项目设计稿的缘故,使用原生的表单组件是不可能使用了,请看ui图: 可悲的是,这个项目两个月后,我才来做项目复盘, 话说也就在此时,我才发现有一种更简单的方式来实现并且应用上v-model, 为什么要为了样式放弃功能然后自己吭哧吭哧傻滴呼呼的用js来实现了类似双向绑定的感觉!!! flag:今天先专注把我费劲巴拉手动搬得砖总结一下,明天(07-05)我再把所谓的最简单的方法做出来贴这里~ 2018-07-05 16:04:43 flag处理完毕!地址: https://www.cnblogs.com/padding1015/p/9268863.html 这个需求的难点在于以下几点: 1.单选点击后选中状态,需满足如下: a) 每次点击只能选中其中一个 b) 当选中时再次点击其他选项需要切换选择对应点击项 c) 选中时点击自身无显示上的反应(同样的逻辑再做一遍也无妨,即再加一遍类名也看不出来) 2.多选样式展示,需满足如下: