用vue写这个现实显示隐藏的,怎么写方便而且快速呢? 我每次都是用的jq

用vue写这个现实显示隐藏的,怎么写方便而且快速呢? 我每次都是用的jq


类似于这种的


https://img.mukewang.com/5c934010000171f305540361.jpg


我每次都是用的


         //需要点击的东西循环

            $(".ull>li").each(function(i){

                //发生点击事件的时候

                        $(this).click(function(){

                            //哪里需要切换 切换的地方

                            $(".p1>div").eq(i).show().siblings().hide();

                            $(this).addClass("on").siblings().removeClass("on");

                        })

                    })

                    

现在我想用vue里面的写,我想给每个加个show的条件,但是那要需要写4个,很麻烦,请问有什么简单快速的方法吗?


慕村9548890
浏览 780回答 2
2回答

慕尼黑8549860

你的意思tab加点击高亮么?可以给tab 渲染的数据加属性 循环的时候设置data-index={{index}} 点击的时候处理 通过active属性渲染高亮classdata:{tabIndex:0}var tabList=[{name:'a',active:true},{name:'a',active:false},{name:'a',active:false}]changeTab:function(e){    var index=e.target.getAttribute('data-index'),    tabList[index].active=true    tabList[this.data.tabIndex].active=false}
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript