Advertisement
VladNitu

React Accordion slider chatgpt

Jun 12th, 2023
99
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 0.73 KB | None | 0 0
  1. import React from 'react';
  2. import { Accordion, AccordionSummary, AccordionDetails, Typography, Slider } from '@material-ui/core';
  3.  
  4. const MyAccordion = () => {
  5. const [sliderValue, setSliderValue] = React.useState(50);
  6.  
  7. const handleSliderChange = (event, newValue) => {
  8. setSliderValue(newValue);
  9. };
  10.  
  11. return (
  12. <Accordion>
  13. <AccordionSummary>
  14. <Typography>Accordion Heading</Typography>
  15. </AccordionSummary>
  16. <AccordionDetails>
  17. <div>
  18. <Typography>Slider Value: {sliderValue}</Typography>
  19. <Slider value={sliderValue} onChange={handleSliderChange} min={0} max={100} />
  20. </div>
  21. </AccordionDetails>
  22. </Accordion>
  23. );
  24. };
  25.  
  26. export default MyAccordion;
  27.  
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement