Reactnative 使用NextJS映射从数组中提取用户角色

我几周前开始研究NextJ，但我很难使用map从列表中提取值，其中一个项目具有特定键的多个值.

我正在try 创建一个RCM菜单.如果角色只有一个价值观，那么一切都会正常运行.然而，当我try 添加多个值时，我无法使其工作.

我的数组:

export const links = [
  {
    name: 'TIMETRACKER',
    href: '/dashboard/timetracker',
    icon: ClockIcon,
    role: 'user',
  },
 {
    name: 'MANAGE',
    href: '#',
    icon: HomeIcon,
    role: ['manager', 'admin'],
},
 {
    name: 'SETTINGS',
    href: '#',
    icon: HomeIcon,
    role: ['user', 'manager', 'admin'],
},
]

第一个可以作为一种魅力，但其他的就是不起作用.

我的验证函数位于 map 内部，并try 验证该 map 的每一项:

      {links?.map((link, indexItem) => {
        const LinkIcon = link.icon;
        return (
          <div key={indexItem} className="mt-2 md:mt-0">
            {!link.subitems && (link.role === userrole || link.role === '') ? (
              <ul>
                <li className="mr-2 inline-block md:mr-0 md:list-item">
                  <Link
                    key={link.name}
                    href={link.href}
                    className={clsx(
                      'flex h-[48px] grow items-center justify-center gap-2 rounded-md bg-gray-50 p-3 text-sm font-medium hover:bg-sky-100 hover:text-blue-600 md:flex-none md:justify-start md:p-2 md:px-3',
                      { 'bg-sky-100 text-black': pathname === link.href },
                    )}
                  >
                    <LinkIcon className="w-6" />
                    <p className="hidden md:block">{link.name}</p>
                  </Link>
                </li>
              </ul>
            ) : null }
          </div>
        );
      })}

有线索吗？

我是否应该创建另一个 map 来验证权限？

谢谢.