Vue.js 如何";停止“;事件?

Vue.js 如何";停止“;事件?,vue.js,vuetify.js,Vue.js,Vuetify.js,我正在学习Vuetifyjs并尝试编写“文件浏览器”。 有一个例子: 我不明白如何确保当您单击右侧图标时,“树”中的条目不会变为“活动”。 可能需要“停止”活动,但我不知道如何进行。 告诉我。 谢谢。 我想点击这个菜单: 变成这样: 不像现在: 片段: {{open?'mdi folder open':'mdi folder'}} {{files[item.file]} {{item.name} 更多 mdi信息变量 信息 电源\u设置\u新建 地位 创造 改名 文件副本 复制 mdi文件夹


我正在学习Vuetifyjs并尝试编写“文件浏览器”。
有一个例子:
我不明白如何确保当您单击右侧图标时,“树”中的条目不会变为“活动”。
可能需要“停止”活动,但我不知道如何进行。
告诉我。
谢谢。

我想点击这个菜单:

变成这样:

不像现在:

片段:


{{open?'mdi folder open':'mdi folder'}}
{{files[item.file]}
{{item.name}
更多
mdi信息变量
信息
电源\u设置\u新建
地位
创造
改名
文件副本
复制
mdi文件夹升级版
创建文件夹
删除
删除

要在单击时删除项目的蓝色突出显示,请从v-treeview组件中删除“可激活”:

<v-treeview
  v-model="tree"
  :open="open"
  :items="items"
  activatable
  hoverable
  item-key="name"
  open-on-click >

要在单击时删除项目的蓝色突出显示,请从v-treeview组件中删除“可激活”:

<v-treeview
  v-model="tree"
  :open="open"
  :items="items"
  activatable
  hoverable
  item-key="name"
  open-on-click >

这里发生的是,您的单击事件正在传播到其父元素,因此当您单击图标以显示菜单时,它也会触发父元素(文件或文件夹容器)的单击事件。 您可以在第44行的v-btn中添加
@click.stop
,如下所示:

<template v-slot:activator="{ on }">
              <!--
              -->
              <v-btn
                  v-show="hover"
                  icon
                  small
                  v-on="on"
                  class="pa-0 ma-0"
                  @click.stop
              >
                <v-icon small class="pa-0 ma-0">more_vert</v-icon>

              </v-btn>
            </template>

更多
这将阻止事件传播到其父元素,您可以在此处尝试:


现在,当您单击按钮时,它将显示您的菜单,并且不会更改文件或文件夹的活动或非活动状态。

这里发生的是,您的单击事件正在传播到其父元素,因此,当您单击图标以显示菜单时,它还会触发父元素(文件或文件夹容器)的单击事件。 您可以在第44行的v-btn中添加
@click.stop
,如下所示:

<template v-slot:activator="{ on }">
              <!--
              -->
              <v-btn
                  v-show="hover"
                  icon
                  small
                  v-on="on"
                  class="pa-0 ma-0"
                  @click.stop
              >
                <v-icon small class="pa-0 ma-0">more_vert</v-icon>

              </v-btn>
            </template>

更多
这将阻止事件传播到其父元素,您可以在此处尝试:


现在,当您单击按钮时,它将显示您的菜单,并且不会更改您的文件或文件夹的活动或非活动状态。

所说的“活动”是指以蓝色突出显示的吗?是的,“活动”是指以蓝色突出显示的。所说的“活动”是指以蓝色突出显示的吗?是的,“活动”是蓝色的。因此它不适合我。我希望当你点击“文件菜单”时,如果文件是“活动的”,那么它将保持活动状态,如果它是“非活动的”,那么它将保持不活动状态,菜单将打开。对不起,我不明白,请更具体一些。什么是“文件菜单”?整个菜单?你指的是什么文件?所以不适合我。我希望当你点击“文件菜单”时,如果文件是“活动的”,那么它将保持活动状态,如果它是“非活动的”,那么它将保持不活动状态,菜单将打开。对不起,我不明白,请更具体一些。什么是“文件菜单”?整个菜单?你指的是什么文件?