Bagaimana untuk menetapkan atribut berbilang subitem v-treeview

Question

Katakan saya mempunyai item pembolehubah dengan struktur berikut: [{id:1,name:'value1',item_nested:[{id:2,name:'value2',},{id:3,name:'value3',nested_item : [{id:4,name:'value4'}]}]}] Dalam v-treeview kita mempunyai prop yang dipanggil item-children yang menerima rentetan yang membolehkan untuk menetapkan sifat mana yang akan dirujuk sebagai anak . pada mulanya

P粉850680329 · Answer

VTreeView使用一个string sebagai kunci kanak-kanak, jadi - tanpa melanjutkan/menimpa komponen asal - saya tidak nampak cara untuk menyediakan kunci alternatif untuk kanak-kanak itu.

Walau bagaimanapun, anda sentiasa boleh "menaip semula" objek yang anda mahu dipaparkan dalam VTreeview (coretan kod ini hanya digunakan untuk kes khusus ini, tetapi boleh digeneralisasikan kepada kes lain):

new Vue({
  el: '#app',
  vuetify: new Vuetify(),
  computed: {
    // "re-keying" items:
    modifiedTreeviewItems() {
      const updateItemKeys = (items) => {
        if (!items.length) return []

        const mapped = items.map((item) => {
          const {
            item_nested = [], nested_item = [], ...rest
          } = item
          const children = item_nested.length ? item_nested : nested_item.length ? nested_item : []
          return {
            ...rest,
            children: updateItemKeys(children),
          }
        })
        return mapped
      }
      return updateItemKeys(this.treeviewItems)
    },
  },
  data() {
    return {
      treeviewItems: [{
        id: 1,
        name: 'value1',
        item_nested: [{
            id: 2,
            name: 'value2',
          },
          {
            id: 3,
            name: 'value3',
            nested_item: [{
              id: 4,
              name: 'value4'
            }]
          }
        ]
      }]
    }
  },
})

Bagaimana untuk menetapkan atribut berbilang subitem v-treeview

membalas semua(1)saya akan balas