Question

我正在尝试返回mobx存储区中的过滤列表，但无法弄清楚过滤器功能如何正常工作。我有一个看起来像这样的数组

      @observable files = ([
        {
        id: '1',
        fileType: 'Document',
        files: [
            {
              name: 'test1',
              size: '64kb',
              date: '2018-01-19'
            },
            {
              name: 'test2',
              size: '94kb',
              date: '2018-01-19'
            }
        ]
      },
      {
      id: '2',
      fileType: 'List',
      files: [
          {
            name: 'test3',
            size: '64kb',
            date: '2018-01-19'
          },
          {
            name: 'test4',
            size: '94kb',
            date: '2018-01-19'
          },
          {
            name: 'test5',
            size: '94kb',
            date: '2018-01-19'
          }
      ]
    } and so on...

我希望能够过滤所有名称this.files[x].files[x].name 然后返回结果。如果将“此处放置的内容”设置为this.files[0].files[0].name，则可以过滤名称的第一项。但是如何动态过滤所有名称？

  @observable filter = ""
  @computed get filteredFiles(){
    var matchesFilter = new RegExp(this.filter, "i")
    var filtered = this.files.filter(file => !this.filter || matchesFilter.test(What to put here?))
    return filtered
  }

Answer 1

将matchesFilter.test(What to put here?)更改为

file.files.some(nestedfile=>matchesFilter.test(nestedFile.name))

如果您还希望将内部文件列表过滤为仅匹配的文件，则需要.map数组

var filtered = this.files
  .filter(file =>
    !this.filter || file.files.some(nestedfile => matchesFilter.test(nestedFile.name)))
  .map(file => ({ ...file,
    files: file.files.filter(nesstedFile => matchesFilter.test(nestedFile.name))
  }));

在数组内部的数组上对项目进行过滤

1 个答案: