GlobalFooter全局页脚

页脚属于全局导航的一部分,作为对顶部导航的补充,通过传递数据控制展示内容。

引用方式:

  1. import GlobalFooter from 'ant-design-pro/lib/GlobalFooter';

详细使用方式请参照:独立使用 pro 组件

代码演示

GlobalFooter 全局页脚 - 图1

演示

基本页脚。

  1. import GlobalFooter from 'ant-design-pro/lib/GlobalFooter';
  2. import { Icon } from 'antd';
  3. const links = [
  4. {
  5. key: '帮助',
  6. title: '帮助',
  7. href: '',
  8. },
  9. {
  10. key: 'github',
  11. title: <Icon type="github" />,
  12. href: 'https://github.com/ant-design/ant-design-pro',
  13. blankTarget: true,
  14. },
  15. {
  16. key: '条款',
  17. title: '条款',
  18. href: '',
  19. blankTarget: true,
  20. },
  21. ];
  22. const copyright = (
  23. <div>
  24. Copyright <Icon type="copyright" /> 2017 蚂蚁金服体验技术部出品
  25. </div>
  26. );
  27. ReactDOM.render(
  28. <div style={{ background: '#f5f5f5', overflow: 'hidden' }}>
  29. <div style={{ height: 280 }} />
  30. <GlobalFooter links={links} copyright={copyright} />
  31. </div>,
  32. mountNode
  33. );

API

参数说明类型默认值
links链接数据array<{ title: ReactNode, href: string, blankTarget?: boolean }>-
copyright版权信息ReactNode-