Footer 页脚

页脚组件,用于页面底部展示版权信息、链接等

页脚组件,用于页面底部展示版权信息、链接等

演示

9:41

代码示例

<!-- 基础用法 -->
  <re-footer class="demo-footer-text" text="© 2024 reglow" />

<!-- 带链接 -->
  <re-footer class="demo-footer-links" text="© 2024 reglow" :links="linkList" />

<!-- 带logo -->
  <re-footer class="demo-footer-logo" text="© 2024 reglow" logo="/static/logo.png" />

<!-- 完整属性 -->
  <re-footer class="demo-footer-all" text="© 2024 reglow" logo="/static/logo.png" :links="linkList" />

<!-- 空内容 -->
  <re-footer class="demo-footer-empty" />

<!-- 长文本 -->
  <re-footer class="demo-footer-long" text="© 2024 reglow Technology Co., Ltd. All Rights Reserved." />

<!-- 自定义样式 -->
  <re-footer class="demo-footer-custom-style" text="© 2024 reglow" customStyle="background-color: #f0f0f0; padding: 20px;" />

<!-- 多链接 -->
  <re-footer class="demo-footer-multi-links" text="© 2024 reglow" :links="multiLinkList" />

引入

推荐使用 easycom 模式,配置后无需手动 import 即可直接使用 <re-footer />。

API

名称类型默认值描述必传
textstring""页脚文本内容N
linksany[]链接列表N
logostring""logo 图片地址N
customStylestring""自定义样式N
名称参数描述
clicklink: any, index: number点击时触发
名称描述
default默认插槽