GlobalFooter 全局页脚

src/components/GlobalFooter/index.less

@@ -0,0 +1,22 @@
+@import "~ant-design-vue/lib/style/themes/default.less";
+.footer {
+    padding: 0 16px;
+    margin: 48px 0 24px;
+    text-align: center;
+    .links {
+      margin-bottom: 8px;
+      a {
+        color: rgba(0, 0, 0, 0.45);
+        &:hover {
+          color: rgba(0, 0, 0, 0.65);
+        }
+        &:not(:last-child) {
+          margin-right: 40px;
+        }
+      }
+    }
+    .copyright {
+      color: rgba(0, 0, 0, 0.45);
+      font-size: 14px;
+    }
+  }

src/components/GlobalFooter/index.vue

@@ -0,0 +1,30 @@
+<template>
+  <div class="footer">
+    <div class="links">
+      <a href="#" target="_blank" title="首页">Pro 首页</a>
+      <a
+        href="https://github.com/vueComponent/ant-design-vue-pro"
+        target="_blank"
+      >
+        <a-icon type="github" />
+      </a>
+      <a href="https://ant.design/" title="Ant Design">Ant Design</a>
+      <a href="https://vue.ant.design/" title="Vue Antd">Vue Antd</a>
+    </div>
+    <div class="copyright">
+      Copyright
+      <a-icon type="copyright" /> 2019 <span>vueComponent</span>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "GlobalFooter",
+  data() {
+    return {};
+  }
+};
+</script>
+
+<style lang="less" src="./index.less" scoped></style>

src/icons.js

@@ -1,3 +1,12 @@
 export {
   default as SettingOutline
 } from "@ant-design/icons/lib/outline/SettingOutline";
+export {
+  default as GithubOutline
+} from "@ant-design/icons/lib/outline/GithubOutline";
+export {
+  default as CopyrightOutline
+} from "@ant-design/icons/lib/outline/CopyrightOutline";
+export {
+  default as CloseOutline
+} from "@ant-design/icons/lib/outline/CloseOutline";

src/layouts/BasicLayout.vue

@@ -38,7 +38,7 @@
 
 <script>
 import Header from "./Header";
-import Footer from "./Footer";
+import Footer from "../components/GlobalFooter";
 import SiderMenu from "./SiderMenu";
 import SettingDrawer from "../components/SettingDrawer";
 export default {