ecmascript-6 - ES6：如何使用映射过滤状态数组

Question

我有以下状态数组称为structure：

var structure = [
    { id: 0, label: "Dashboard", link: "/test/dashboard", icon: <HomeIcon /> },
    {
      id: 1,
      label: "Test1",
      link: "/test1",
      icon: <InboxIcon />,
    },
    {
      id: 2,
      label: "Test2",
      link: "/test2",
      icon: <PresentToAllIcon />,
    },
    { id: 3, type: "divider" },
    {
      id: 4,
      label: "Test3",
      link: "/test3",
      icon: <ListAltIcon />,
      children: [
        {
          label: "Test4",
          link: "/test4",
          icon: <LanguageIcon />,
        },
        {
          label: "Test5",
          link: "/test5",
          icon: <ListIcon />,
        },
      ],
    },
    {
      id: 5,
      label: "Test6",
      link: "/test6",
      icon: <DescriptionIcon />,
    },
    {
      id: 6,
      label: "Test7",
      link: "/test7",
      icon: <AccountBalanceWallet />,
      children: [
        {
          label: "Test8",
          link: "/test8",
          icon: <FaceIcon />,
        },
        {
          label: "Test9",
          link: "/test9",
          icon: <TransferWithinAStationIcon />,
        },
        {
          label: "Test10",
          link: "/test10",
          icon: (
            <Avatar alt="Test" src={testlogo} className={classes.small} />
          ),
        },
        {
          label: "Test11",
          link: "/test11",
          icon: <PeopleAlt />,
        },
      ],
    },
    {
      id: 7,
      label: "Test12",
      link: "/test12",
      icon: <EditIcon />,
    },
  ];

我想使用另一个数组对其进行过滤，该modules数组如下所示：

["Miscellaneous","Test Converter"]

到目前为止我所做的是

modules.forEach((modulesMap) => {
    structureNew = structure.filter(
      (structureFiltered) => structureFiltered.label == modulesMap
    );
  });

任何人都知道如何正确地做到这一点？我的代码遇到的问题是它覆盖或替换了当前变量structureNew

我希望它也被附加到一个状态数组中，所以它看起来有点类似于structure

标签： ecmascript-6

Answer 1

试试这个，我只是对你的代码做了一些小改动

var structure = [
    { id: 0, label: "Dashboard", link: "/cpex/dashboard", icon: '<HomeIcon />' },
    {
      id: 1,
      label: "Inward",
      link: "/cpex/inward",
      icon: '<InboxIcon />',
    },
    {
      id: 2,
      label: "Outward",
      link: "/cpex/outward",
      icon: '<PresentToAllIcon />',
    },
    { id: 3, type: "divider" },
    {
      id: 4,
      label: "Proof List",
      link: "/cpex/prooflist",
      icon: '<ListAltIcon />',
      children: [
        {
          label: "Proof Web",
          link: "/cpex/prooflist/web",
          icon: '<LanguageIcon />',
        },
        {
          label: "Proof Others",
          link: "/cpex/prooflist/others",
          icon: '<ListIcon />',
        },
      ],
    },
    {
      id: 5,
      label: "Miscellaneous",
      link: "/cpex/misc",
      icon: '<DescriptionIcon />',
    },
    {
      id: 6,
      label: "RPS",
      link: "/cpex/rps",
      icon: '<AccountBalanceWallet />',
      children: [
        {
          label: "Client Maintenance",
          link: "/cpex/rps/clientmaintenance",
          icon: '<FaceIcon />',
        },
        {
          label: "Process SFTP",
          link: "/cpex/rps/sftp",
          icon: '<TransferWithinAStationIcon />',
        },
        {
          label: "Process PESONet",
          link: "/cpex/rps/pesonet",
          icon: (
            '<Avatar alt="Pesonet" src={pesonetlogo} className={classes.small} />'
          ),
        },
        {
          label: "Override Enrollment",
          link: "/cpex/rps/overrideenrollment",
          icon: '<PeopleAlt />',
        },
      ],
    },
    {
      id: 7,
      label: "Message Converter",
      link: "/cpex/message",
      icon: '<EditIcon />',
    },
  ];
  
  var modules=["Miscellaneous","Message Converter"]
  var structureNew=[]
  
  modules.forEach((modulesMap,i) => {
    let arrs = structure.filter(
      (structureFiltered) => structureFiltered.label == modulesMap
    );
   structureNew= structureNew.concat(...arrs)
  });
  
  console.log('RESULT:'+JSON.stringify(structureNew))
  
  debugger