Question

我正在尝试使用Vuetify的Treeview显示作物病害诊断键。 Treeview提供了一个道具“ load-children”，如果要扩展的项具有为空数组的item-children属性，则该函数将运行一个函数。

该如何修改才能将父代的ID传递给函数？在树的这一点上，我们将到达已指出的病原体-我想将其ID（例如下面数据中的ID 333、666、999）传递给函数，以在单击该病原体时加载有关该病原体的其他资源。

我的典型数据集（以及Vuetify的演示函数“ fetchUsers”）如下：

export default {
    name: "key",
    data() {
        return {
          active: [],
          items: [
            {
              id: 1,
              name: 'Roots :',
              children: [
                { id: 2,
                  name: 'Seedlings',
                  children: [
                    {   id: 123,
                        name: 'Watery rot in root/stem near the soil line',
                        children: [
                          {id:333,name: 'Damping off',children: []}
                        ]}
                  ]},
                { id: 3,
                  name: 'Larger plants',
                  children: [
                    {id:124, name: 'Brown, sunken lesions near soil-line', children: [
                        {id:666,name: 'Rhizoctonia root rot',children: []}
                      ]},
                    {id:125, name: 'Soft wet rot at base of stem extending to roots', children: [
                        {id:999,name: 'Bacterial soft rot',children: []}
                      ]}
                  ]},
              ]
            },
          ]
        }
    },
    methods: {
      async fetchUsers (item) {
        return fetch('https://jsonplaceholder.typicode.com/users')
          .then(res => res.json())
          .then(json => (item.children.push(...json)))
          .catch(err => console.warn(err))
      },
    }
}

我正在使用的模板是

<v-treeview
:items="items"
:active.sync="active"
:load-children="fetchUsers"
activatable
open-on-click
transition

也许信息已经在fetchUsers（item）中传递了-如果是这种情况，那么我如何读取该信息？迄今为止我的尝试

methods: {
      async fetchUsers (item) {
        console.log('item='+item[0].id);

触发了有关“无法读取未定义的属性'id'的错误。

谢谢，汤姆。

Answer 1

我需要的信息正在“ item”中传递-item.id是给我的，而不是item [0] .id！

在Vuetify的treeview组件中传递父ID以起作用

1 个答案: