如何在vuetify中过滤子项

时间:2020-05-20 09:08:41

标签: vue.js vuetify.js

我在vuetify项目中有一个抽屉,它包含下拉菜单,并且我正在使用的抽屉正在按我给予的权限访问每个下拉菜单,并且它可以正常工作,但是它过滤了下拉菜单中的所有内容菜单,但是我要过滤的是特定的子项,我该怎么做。 这就是我尝试过的

    <script>
    export default {
      data: () => ({
        permission: '',
        filtereditems: [],
        items: [
          {
            group: '/group1',
            title: 'school',
            children: [
              {
                title: 'teachers',
              },
              {
                title: 'students',
              },
            ],
          },
          {
            group: '/group12',
            title: 'hostpital',
            children: [
              {
                title: 'doctor',
              },
              {
                title: 'patient',
              },
            ],
          },
        ],
      )},

      created () {
        this.permission = localStorage.getItem('permissions')
        const per = this.permission
        console.log(per)
        if (per === 'school') {
          this.filtereditems = this.items.filter(item => (item.title === 'school'))
          this.filtereditems = this.items.children.filter(item => (item.title === 'teacher'))
        } else if (per === 'hostpital') {
          this.filtereditems = this.items.filter(item => (item.title === 'hostpital'))
        }
      },
    }
    </script>

this.filtereditems = this.items.filter(item => (item.title === 'school'))过滤器可以使学校下拉菜单很好,但 this.filtereditems = this.items.children.filter(item => (item.title === 'teacher'))不过滤 儿童用品

this is the output

this is my code

1 个答案:

答案 0 :(得分:1)

不过滤子项

更像是找不到任何匹配项

如果您要查找字符串中的短语,无论它在哪里,都可以使用string.includes

item.title.includes('school')

-编辑

获取子项目的示例代码

const data = {
  filtereditems: [],
  items: [{
      group: '/group1',
      title: 'school',
      children: [{
          title: 'teachers',
        },
        {
          title: 'students',
        },
      ],
    },
    {
      group: '/group12',
      title: 'hostpital',
      children: [{
          title: 'doctor',
        },
        {
          title: 'patient',
        },
      ],
    },
  ]
}

data.filtereditems = data.items.find(item => item.title.includes('school'))
data.filtereditems = data.filtereditems.children.find(item => !item.title.includes('teachers'))

console.log(data.filtereditems);