我正在將 ChakraUI 用于 React。手風琴檔案非常有用,但我不確定如何使手風琴在特定選擇上自動打開。我已經通讀了檔案,但我不太明白這是如何完成的。以下是檔案:https : //chakra-ui.com/docs/disclosure/accordion
到目前為止,我已經使用了這個例子:
import {
Accordion,
AccordionItem,
AccordionButton,
AccordionPanel,
AccordionIcon,
} from '@chakra-ui/react'
...
<Accordion>
<AccordionItem>
<h2>
<AccordionButton>
<Box flex='1' textAlign='left'>
Section 1 title
</Box>
<AccordionIcon />
</AccordionButton>
</h2>
<AccordionPanel pb={4}>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim
veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea
commodo consequat.
</AccordionPanel>
</AccordionItem>
<AccordionItem>
<h2>
<AccordionButton>
<Box flex='1' textAlign='left'>
Section 2 title
</Box>
<AccordionIcon />
</AccordionButton>
</h2>
<AccordionPanel pb={4}>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim
veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea
commodo consequat.
</AccordionPanel>
</AccordionItem>
</Accordion>
根據檔案,我嘗試過許多屬性都無濟于事。我試過添加defaultIndex為 的道具,<Accordion />但我不確定如何設定實際索引。例如<Accordion defaultIndex=0 />是不允許的。我不確定如何使用它。
謝謝
uj5u.com熱心網友回復:
從檔案
如果您傳遞此道具,請確保 index 或 defaultIndex 道具是一個陣列。
嘗試如下
<Accordion defaultIndex={[0]}>
...
...
</Accordion>
轉載請註明出處,本文鏈接:https://www.uj5u.com/qukuanlian/395474.html
