在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML/ vueJS中樹形圖全打開的問題

vueJS中樹形圖全打開的問題

現(xiàn)在因為寫了this.open = !this.open所以全部內(nèi)容都能展開,能否提供一下怎么修改成點擊一個其他都關(guān)閉只顯示一個二級菜單的形式。有想過綁定標識,但是這種寫法會一起綁定上。

<template>
  <li class="tree-menu-list">
    <a @click="toggle();sendParams()">
      <i v-if="isFolder" class="iconfont" :class="[open ? 'icon-jiantouarrow487': 'icon-iconfontjiantou']"></i>
      <i v-if="!isFolder" class="iconfont"></i>
      {{ model.menuName }}
    </a>
    <ul v-show="!open" v-if="isFolder">
       <tree-menu v-for="(item, index) in model.children" :model="item" :key="index"></tree-menu>
    </ul>
  </li>
</template>

<script>
export default {
  name: 'treeMenu',
  props: ['model'],
  data () {
    return {
      open: false,
      isFolder: this.model.children && this.model.children.length
    }
  },
  methods: {
    toggle: function () {
      if (this.isFolder) {
        this.open = !this.open
      }
    },
    sendParams: function () {
      this.$router.push({
        path: './info',
        name: 'info',
        query: {
          id: this.model.id,
          name: this.model.menuName
        }
      })
    }
  }
}
</script>
回答
編輯回答
憶當年

應該是你點擊拿到的 item中唯一的key 是否等于v-for中的item的key 已經(jīng)item.children為真來展開

2018年1月20日 04:19