Javascript 如何检查数组的值并根据条件删除某些属性？

我有这样一个数组：

PermissionList:[“RealPersonTab”、“LegalPersonTab”、“CustomerUserTab”、…]

.我还有另一个类似这样的数组：

customerSubMenu: [
        {
          id: 1,
          name: "RealPerson",
          to: "/main/customers/real",
          accessKey:"RealPersonTab"
        },
        {
          id: 1.1,
          name: "LegalPerson",
          to: "/main/customers/legal",
          accessKey:"LegalPersonTab"
        },
        {
          id: 1.2,
          name: "CustomerUser",
          to: "/main/users/customer",
          accessKey:"CustomerUserTab"
        },
        {
          id: 1.3,
          name: "OfficeUser",
          to: "/main/users/official",
          accessKey:"OfficeUserTab"
        },   
      ],

这就是我如何使用客户子菜单的方法：

   {customerSubMenu.map((link) => {
                        return (
                          <div key={link.id}>
                            <ul className="space">
                              <li onClick={() => this.handleClick(link.id) } className="sidebar-item">
                                <Link to={link.to}>
                                  <i className="sidebar-icon"></i>
                                    <span>
                                      {link.name}
                                    </span>
                                </Link>
                              </li>
                            </ul>
                          </div>
                        );
                      })}
                    </div>
                  ) :("")}

{customerSubMenu.map（（链接）=>{
返回(

this.handleClick（link.id）}className=“侧栏项”>
{link.name}


);
})}
) :("")}

---

我想要的是，例如，RealPersonTab不存在于PermissionList数组中的customerSubMenu数组中，删除其accessKey等于RealPersonTab

的对象听起来像是在将

客户子菜单映射到JSX之前尝试对其进行过滤

按
customerSubMenu
数组中具有
accessKey
属性的元素筛选
customerSubMenu
数组

customerSubMenu
  .filter(link => customerSubMenu.includes(link.accessKey))
  .map(link => { ..... JSX ......})

听起来您正在尝试在映射到JSX之前过滤
customerSubMenu

按
customerSubMenu
数组中具有
accessKey
属性的元素筛选
customerSubMenu
数组

customerSubMenu
  .filter(link => customerSubMenu.includes(link.accessKey))
  .map(link => { ..... JSX ......})

您只需将
customerSubMenu
的数组更新为与
PermissionList
中存在的
accessKey
项相同且经过修改的版本即可。你可以这样做

customerSubMenu = [...customerSubMenu].filter((menu) => {
    return PermissionList.indexOf(menu.accessKey) !== -1;
});

您只需将
customerSubMenu
的数组更新为与
PermissionList
中存在的
accessKey
项相同且经过修改的版本即可。你可以这样做

customerSubMenu = [...customerSubMenu].filter((menu) => {
    return PermissionList.indexOf(menu.accessKey) !== -1;
});

使用
Set的解决方案

const
permissionList=新集合（[“RealPersonTab”、“LegalPersonTab”、“CustomerUserTab]”），
customerSubMenu=[
{
id:1，
姓名：“真人”，
致：“/main/customers/real”，
accessKey:“RealPersonTab”，
},
{
id:1.1，
姓名：“LegalPerson”，
致：“/main/customers/legal”，
accessKey:“LegalPersonTab”，
},
{
id:1.2，
名称：“客户用户”，
致：“/main/users/customer”，
accessKey:“CustomerUserTab”，
},
{
id:1.3，
姓名：“公务员用户”，
致：“/main/users/official”，
accessKey:“OfficeUserTab”，
},
];
filteredMenu=customerSubMenu.filter（（c）=>permissionList.has（c.accessKey））；
console.log（filteredMenu）
使用
Set解决方案

const
permissionList=新集合（[“RealPersonTab”、“LegalPersonTab”、“CustomerUserTab]”），
customerSubMenu=[
{
id:1，
姓名：“真人”，
致：“/main/customers/real”，
accessKey:“RealPersonTab”，
},
{
id:1.1，
姓名：“LegalPerson”，
致：“/main/customers/legal”，
accessKey:“LegalPersonTab”，
},
{
id:1.2，
名称：“客户用户”，
致：“/main/users/customer”，
accessKey:“CustomerUserTab”，
},
{
id:1.3，
姓名：“公务员用户”，
致：“/main/users/official”，
accessKey:“OfficeUserTab”，
},
];
filteredMenu=customerSubMenu.filter（（c）=>permissionList.has（c.accessKey））；
console.log（filteredMenu）