如何在反应中映射数组中的第一个对象？

Question

我在反应中映射一个对象数组。数组如下

const tabs = [
    {
        index: 0,
        title: 'v1',
        path: '/v1',
        component: versionManager,
    },
    {
        index: 1,
        title: 'v2',
        path: '/v2',
        component: version2Manager,
    },
    {
        index: 0,
        title: 'v3',
        path: '/v3',
        component: version3Manager,
    },
];

我已经成功地用这个映射了整个数组

{tabs.map((item) => {
           if (auth.verify(Roles.role1)) {
                   return (
                        <Tab
                             label={item.title}
                             key={item.index}
                             component={Link}
                             to={item.path}
                         />
                    );

但我想添加一个 else 只映射第一个对象（v1）及其所有元素，类似于此。

} else {
       return (
             <Tab
                 label={item.title}
                 key={item.index}
                 component={Link}
                 to={item.path}
              />
                )
 }

我尝试过诸如 item.title[0]、item.index[0] 等之类的东西......但它每次都会给出一个未定义的错误。有谁知道在 else 语句中只映射第一个对象的最佳方法？提前致谢。

我已经在 React 中看到从对象数组中获取第一个对象，但这对我来说似乎没有帮助。

Answer 1

item.title[0], item.index[0]不会工作，因为item它只是tabs数组中的一个对象。你想要的是：

} else {
       return (
             <Tab
                 label={tabs[0].title}
                 key={tabs[0].index}
                 component={Link}
                 to={tabs[0].path}
              />
                )
 }