小编Yoh*_*ias的帖子

如何使用 Quasar QexpansionItem 制作递归菜单

我想创建一个可以使用 Quasar Framework 中的 QExpansionItem 通过嵌套对象结构进行扩展的组件。

我制作了一个递归组件来尝试实现此目的,但没有像我希望的那样显示。这些项目以错误的方式重复,我不知道为什么。

我正在使用 Quasar V1.0.5,我使用 QexpansionItem 的组件

这里是菜单对象


[
{
    name: '1',
    icon: 'settings',
    permission: 'configuration',
    description: '1',
    url: '',
    children: [
      {
        name: '1.1',
        permission: 'configuration',
        url: '/insuranceTypes',
        icon: 'add',
        description: '1.1'
      },
      {
        name: '1.2',
        permission: 'configuration',
        url: '/insuranceTypes2',
        icon: 'phone',
        description: '1.2'
      }
    ]
  }, {
    name: '2',
    icon: 'person',
    permission: 'configuration',
    url: 'contacts',
    description: '2'
  }
  ]
Run Code Online (Sandbox Code Playgroud)

MenuComponent.vue,我在其中调用 side-tree-menu 组件

<q-list
        bordered
        class="rounded-borders q-pt-md"
      >
        <side-tree-menu :menu="menu"></side-tree-menu>

      </q-list>
Run Code Online (Sandbox Code Playgroud)

SideTreeMenuComponent.vue

<template>
  <div> …
Run Code Online (Sandbox Code Playgroud)

recursion vue.js vue-component quasar-framework

2
推荐指数
1
解决办法
4322
查看次数