页脚 
Berlitz Footer 组件有多个部分可供使用. 第一个栏目由Berlitz Logo,Social Icons,一个Contact Link和一个名为专栏OneLogo的可选节点组成,意在认证标志. 第二列是一个可选的通讯签名格式组件. 在此之后, 您可以选择页脚导航链接, 每个列将显示一组链接和标题 .
安装
yarn add @berlitz/footer
道具
| 参数 | 类型 | 需求 | 默认 | 示例 |
|---|---|---|---|---|
| 标志 | 节点 | ✅ | ||
| 电话 | 节点 | ❌ | ||
| 社会链接 | 数组 | ✅ | ||
| 单行 | 数组 | ❌ | ||
| 单行 | 字符串 | ✅ | ||
| 2行链接 | 数组 | ❌ | ||
| 栏2 | 字符串 | ❌ | ||
| 三行链接 | 数组 | ❌ | ||
| 第三行标题 | 字符串 | ❌ | ||
| 四行链接 | 数组 | ❌ | ||
| 四行标题 | 字符串 | ❌ | ||
| 通讯 | 节点 | ❌ | ||
| 语言链接 | 数组 | ❌ | ||
| 活动语言 | 字符串 | ❌ | "EN" (英语) | |
| oneLogo 栏 | 节点 | ❌ |
使用量
import Footer from '@berlitz/footer'
const MyApp = () => (
<Section>
<Grid>
<Footer
logo={logo}
socialLinks={socialLink}
phone={phone}
columnOneTitle={columnOneTitle}
columnOneLinks={columnOneLinks}
columnTwoTitle={columnTwoTitle}
columnTwoLinks={columnTwoLinks}
columnThreeTitle={columnThreeTitle}
columnThreeLinks={columnThreeLinks}
columnFourTitle={columnFourTitle}
columnFourLinks={columnFourLinks}
columnOneLogo={columnOneLogo}
/>
</Grid>
</Section>
)
何时使用此组件
- 需要页脚的页面/ Layout