首页 > 解决方案 > 如何使反应选项卡第一个索引处于活动状态

问题描述

我正在尝试在页面加载时使 React 选项卡的第一个索引处于活动状态,我已设置 defaultIndex={0},但在页面加载时,没有一个选项卡处于活动状态

const saving =  () =>(
       <div className="container">
           <div className="row">
               <div className="col-12">
                   <div className="card">
                       <div className="card-body">
                       <Tabs defaultIndex={0}  onSelect={ index => console.log(index)}>
                            <TabList>
                            { categories && categories.map((cat, i)=>(
                                    <Tab key={i}>{cat.name}</Tab>
                            ))}
                            </TabList>
                            { categories && categories.map((cat, i)=>(
                            <TabPanel key={i}> {cat.name}
                            </TabPanel>  ))}
                           
                       </Tabs>
                       </div>
                    </div>
               </div>
           </div>
       </div>
    )

标签: reactjsreact-hooks

解决方案


您是否尝试过以下操作?:

<Tabs selectedIndex={0} ... />

API 文档可在此处获得


推荐阅读