当前位置: 首页 > 知识库问答 >
问题:

javascript - 如下代码,怎么在depts_click事件触发时,控制的is_open只在当前元素生效?

於乐
2023-06-12
<view class="depts" v-for="(depts,index) in resData.depts" :key="'depts'+index"
                v-if="resData.depts.length != 0">
                <view class="depts_content" @click="depts_click(depts)">
                    <view class="depts_content_right">
                        <view class="depts_arrow_icon">
                            <image :class="is_open == false? 'arrow_icon downIcon' : 'arrow_icon upIcon'"
                                :src="arrowIcon" v-show="(depts.subUsers + depts.subDepts != 0) && show_loading">
                            </image>
                            <u-loading-icon size="20" :show="is_loading"></u-loading-icon>
                        </view>
                    </view>
                </view>
            </view>

image.png
页面效果
image.png

共有2个答案

赵飞雨
2023-06-12

你的在数组的每个对象中放一个 is_open 字段来单独控制每个tab的状态,你可以在拿到 resData.depts 之后先初始化它

deptsList = resData.depts.map(item => {
    item.is_open = false
    return item
})

// dom 中
<view v-for="(depts, index) in deptsList" ...>
<view class="depts_content" @click="depts_click(depts, index)">
    ...
    <image :class="depts.is_open === false" >

...
訾俊名
2023-06-12

每一个depts_click都传入下标, 根据下标控制每一个的展开与收起

 类似资料:
  • 问题内容: 有什么方法可以获取触发事件的元素的ID? 我在想类似的东西: 当然,如果从第一种形式触发事件,则var 应该包含id ;如果从第二种形式触发事件,则var 应该包含id 。 问题答案: 在jQuery中,始终指触发事件的元素,其中传递给函数的参数在哪里。 还请注意,这也将起作用,但它不是jQuery对象,因此,如果您希望在其上使用jQuery函数,则必须将其称为,例如:

  • 本文向大家介绍怎么使css样式只在当前组件中生效?相关面试题,主要包含被问及怎么使css样式只在当前组件中生效?时的应答技巧和注意事项,需要的朋友参考一下 <style scoped> </style>

  • 本文向大家介绍iframe里面的元素触发父窗口元素事件的jquery代码,包括了iframe里面的元素触发父窗口元素事件的jquery代码的使用技巧和注意事项,需要的朋友参考一下 例如父窗口定义了一个事件。 top: $(dom1).bind('topEvent', function(){}); 那么iframe里面的元素怎样触发父窗口dom1的事件呢?这样吗? $(dom1, parent.do

  • div元素无法选择,受body的onselectstart影响。 实际上并不知道是哪个父元素。 用js如何移除这个事件?

  • 为什么我需要这个功能?我正在建立一个应用程序,在这个应用程序,有3下拉菜单,5下拉列表(喜欢选择)。所有这些都是角指令。让我们假设所有这些指令都是不同的。所以我们有8个指令。它们都需要一个相同的功能:当点击元素的侧面时,需要隐藏下拉菜单。 我有两个解决方案,但都有问题: 解决方案A: 解决方案B在我的应用程序中工作,我现在正在使用。但问题是它会导致性能问题。太多的点击事件处理每一个单一的点击在应用

  • 问题内容: 我在我的Web应用程序中同时使用了Bootstrap和AngularJS。我很难让两个人一起工作。 我有一个元素,它具有属性 我想在用户在字段中输入时更新属性。该函数已正确触发,但是除非我使用,这是jQuery方式,而不是AngularJS方式,否则我无法访问触发事件的元素。 使AngularJS与旧式JS模块一起工作的最佳方法是什么。 问题答案: 不会将DOM元素传递给函数。这里将参