Demo.tsx 1.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051
  1. import React, { useEffect, useRef } from 'react';
  2. import Button from '../index';
  3. import ButtonGroup from '../buttonGroup';
  4. import IconButton from '../../iconButton';
  5. const Demo = () => {
  6. const ref = useRef(null);
  7. const refIB = useRef(null);
  8. useEffect(() => {
  9. console.log(`ref: `, ref.current);
  10. }, [ref.current]);
  11. useEffect(() => {
  12. console.log(`refIB: `, refIB.current);
  13. }, [refIB.current]);
  14. return (
  15. <div>
  16. <Button
  17. type={'primary'}
  18. ref={ref}
  19. theme={'light'}
  20. onClick={(e: any) => {
  21. console.log(e);
  22. }}
  23. >
  24. I am a Button
  25. </Button>
  26. <Button icon={'tick'} theme={'solid'} />
  27. <Button icon={'tick'} theme={'solid'}>
  28. circle
  29. </Button>
  30. <ButtonGroup type={'danger'}>
  31. <Button icon={'edit'} theme={'solid'}>
  32. 编辑
  33. </Button>
  34. <Button icon={'delete'} theme={'solid'}>
  35. 删除
  36. </Button>
  37. <Button icon={'close'} theme={'solid'}>
  38. 关闭
  39. </Button>
  40. </ButtonGroup>
  41. <IconButton type={'warning'} icon={'edit'} ref={refIB} />
  42. </div>
  43. );
  44. };
  45. export default Demo;