Блог

У меня есть выбираемый вид дерева Vuetify

 <v-treeview
    :load-children="fetchUsers"
    :items="user_tree_list"
    :open.sync="user_tree_open"
    :active="activeUserUidArray"
    class="user-tree-user"
    transition
    multiple-active
    selected-color="#060080"
    color="#07b53b"
    selectable
    hoverable
    dense
    open-on-click
    activatable
    item-children="children"
    item-key="uid"
    item-text="name"
    indeterminate-icon="mdi-chevron-right-box"
    @input="handleTreeSelection"
    v-on:update:active="user_tree_active_method"
>
 

Я хочу программно определить, когда пользователь нажимает на стрелку или поле выбора.

Проверив их документ, я не смог найти никакого доступного решения.

Пожалуйста, помогите, если вы знакомы с Vuetify и treeview.

При нажатии на стрелку переключения v-treeview генерируется событие с именем update:open . И когда флажок установлен, v-treeview input происходит событие.

Так что вы могли бы просто соответствующим образом обработать эти события:

 <template>
  <v-treeview
    selectable
    :items="items"
    @update:open="onOpen"
    @input="onSelected"></v-treeview>
</template>

<script>
export default {
  methods: {
    onOpen(e) {
      // ignore initial open
      if (!this.__initial) {
        this.__initial = true
        return
      }

      console.log('toggle arrow clicked', e)
    },
    onSelected(e) {
      console.log('checkbox clicked', e)
    }
  }
}
</script>
 

Единственное предостережение, которое следует отметить, — update:open событие срабатывает при инициализации, поэтому вам, возможно, потребуется проверить его.

ДЕМОНСТРАЦИЯ