drawer-reactJs-LeftMenu-MaterialUI

    0

    0

    alecoosta

    ;

    Library: react

    import React, {useState} from 'react'
    import {Button, Drawer, List, ListItemButton, ListItemText, Divider } from '@mui/material';
    import Nabvar from './Nabvar'
    
    const Container = () => {
    
      const[open, setOpen] = useState(false)
    
      const courses = [
        'react',
        'node',
        'js',
        'css',
      ]
      return(
        <div>
          <Button
            variant = 'contained'
            onClick={()=> setOpen(true)}
            >Open
          </Button>
          <Nabvar />
          <Drawer
            open={open}
            onClose={() => setOpen(false)}
            >
              <List>
                {
                  courses.map(course => (
                    <ListItemButton onClick={ ()=> setOpen(false)}>
                      <ListItemText primary={course} />
                    </ListItemButton>
                  ))
                }
                  <Divider />
              </List>
          </Drawer>
        </div>
      )
    }
    
    export default Container
    Codiga Logo
    Codiga Hub
    • Rulesets
    • Playground
    • Snippets
    • Cookbooks
    soc-2 icon

    We are SOC-2 Compliance Certified

    G2 high performer medal

    Codiga – All rights reserved 2022.