javascript - 如下代码，怎么在depts_click事件触发时，控制的is_open只在当前元素生效？
<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>
页面效果
共有2个答案
你的在数组的每个对象中放一个 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" >
...
每一个depts_click都传入下标, 根据下标控制每一个的展开与收起
-
问题内容： 有什么方法可以获取触发事件的元素的ID？ 我在想类似的东西： 当然，如果从第一种形式触发事件，则var 应该包含id ；如果从第二种形式触发事件，则var 应该包含id 。 问题答案： 在jQuery中，始终指触发事件的元素，其中传递给函数的参数在哪里。 还请注意，这也将起作用，但它不是jQuery对象，因此，如果您希望在其上使用jQuery函数，则必须将其称为，例如：
-
本文向大家介绍iframe里面的元素触发父窗口元素事件的jquery代码，包括了iframe里面的元素触发父窗口元素事件的jquery代码的使用技巧和注意事项，需要的朋友参考一下 例如父窗口定义了一个事件。 top: $(dom1).bind('topEvent', function(){}); 那么iframe里面的元素怎样触发父窗口dom1的事件呢？这样吗？ $(dom1, parent.do
-
为什么我需要这个功能？我正在建立一个应用程序，在这个应用程序，有3下拉菜单，5下拉列表（喜欢选择）。所有这些都是角指令。让我们假设所有这些指令都是不同的。所以我们有8个指令。它们都需要一个相同的功能：当点击元素的侧面时，需要隐藏下拉菜单。 我有两个解决方案，但都有问题： 解决方案A： 解决方案B在我的应用程序中工作，我现在正在使用。但问题是它会导致性能问题。太多的点击事件处理每一个单一的点击在应用
-
本文向大家介绍怎么使css样式只在当前组件中生效？相关面试题，主要包含被问及怎么使css样式只在当前组件中生效？时的应答技巧和注意事项，需要的朋友参考一下 <style scoped> </style>
-
问题内容： 我在我的Web应用程序中同时使用了Bootstrap和AngularJS。我很难让两个人一起工作。 我有一个元素，它具有属性 我想在用户在字段中输入时更新属性。该函数已正确触发，但是除非我使用，这是jQuery方式，而不是AngularJS方式，否则我无法访问触发事件的元素。 使AngularJS与旧式JS模块一起工作的最佳方法是什么。 问题答案： 不会将DOM元素传递给函数。这里将参
-
问题内容： 我有一个运行正常的更改事件，但需要递归进行。 因此，我有一个在更改时触发的函数，该函数将基于类选择器“更改”其他下拉菜单（注意“ drop downS”，可能有多个）。此代理更改不会触发功能，因此会失败。我如何使它工作？ 码 到目前为止，这些建议似乎可行，但是由于change事件触发了ajax发布，因此现在似乎在此处失败。我将尝试使用它，但这是我感到另一个问题的东西。 问题答案： 使用