Skip to content

Instantly share code, notes, and snippets.

@lai32290
Created September 23, 2020 21:26
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save lai32290/7cae1336f2023cfe7d8a5ac3bcc0e30f to your computer and use it in GitHub Desktop.
Save lai32290/7cae1336f2023cfe7d8a5ac3bcc0e30f to your computer and use it in GitHub Desktop.
// accordion.js
import React from 'react'
import AccordionContents from './accordion-contents'
class Accordion extends React.Component {
state = {openIndex: 0}
setOpenIndex = openIndex => this.setState({openIndex})
render() {
const {openIndex} = this.state
return (
<div>
{this.props.items.map((item, index) => (
<>
<button onClick={() => this.setOpenIndex(index)}>
{item.title}
</button>
{index === openIndex ? (
<AccordionContents>{item.contents}</AccordionContents>
) : null}
</>
))}
</div>
)
}
}
export default Accordion
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment