前言:
平时在用选项卡这个组件的时候,经常会遇到需要取消选中的需求,但是选项卡本身又不支持重复点击取消选中项。不过好在选项卡有一个自定义的动作——设置选中项,当我们设置选中项为0时,就可以达到取消选中的效果。那么,要如何实现重复点击同一个选项时,取消选中呢?
实现思路:
1.首先假设大屏上有这样一个选项卡:
2.然后我们在大屏上添加一个图片,这张图片的宽高和单个选项一模一样,不过图片的透明度需要设置为0
3.调整两个组件的图层位置,保证图片组件位于选项卡组件之上。
4.接下来,我们需要给选项卡添加一个自定义事件,当选中项改变时,我们把图片组件移动到该选项之上,这里我只添加了一个s=1时的事件,实际上有几个选项就需要添加几个这样的自定义事件。
5.然后我们再给图片组件添加一个点击的自定义事件,当点击图片时,设置选项卡的选中项为0,同时将图片自己移动到画布外。
6.如此这般,即可完成点击已选中的选项后,取消选中的效果。
文章
3.2K人气
8粉丝
1关注
©Copyrights 2016-2022 杭州易知微科技有限公司 浙ICP备2021017017号-3 浙公网安备33011002011932号
互联网信息服务业务 合字B2-20220090