index.tsx 1.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940
  1. "use client";
  2. import { FC, PropsWithChildren, ReactNode } from "react";
  3. import clsx from "clsx";
  4. import styles from "./style.module.scss";
  5. /**
  6. * @description 自定义头部返回组件
  7. * @param {string} title header标题
  8. * @param {ReactNode} children 插槽内容
  9. * @param {() => ReactNode} headerRender 自定义渲染
  10. */
  11. export interface HeaderBackProps {
  12. title?: string;
  13. children?: ReactNode;
  14. headerRender?: () => ReactNode;
  15. }
  16. const HeaderBack: FC<PropsWithChildren<HeaderBackProps>> = ({title = '', children}) => {
  17. const icon1 = clsx({
  18. [styles.iconfontIcon1]: true,
  19. },'iconfont icon-xiangzuo1');
  20. const icon2 = clsx({
  21. [styles.iconfontIcon2]: true,
  22. },'iconfont icon-company_nav_icon_home');
  23. return (
  24. <div className={styles.headerBack}>
  25. <div className={styles.left}>
  26. <span className={icon1}></span>
  27. </div>
  28. {title && <span className={styles.title}>{title}</span>}
  29. {children}
  30. <span className={styles.right}>
  31. <span className={icon2}></span>
  32. </span>
  33. </div>
  34. );
  35. };
  36. export default HeaderBack;