修改 Antd Pro V5 登录页面

Ant Design Pro V5 默认的登录页面功能繁多，而实际项目需要精简一下。

修改项

• 去掉手机号登录。因为不想加短信验证功能。
  
• 去掉底部的其他登录方式
  
• 去掉忘记密码
  
• 修改标题
  

修改文件

src/pages/user/Login/index.tsx

去掉手机登录

删除 Tab 选项卡

-              <Tabs.TabPane
-                key="mobile"
-                tab={intl.formatMessage({
-                  id: 'pages.login.phoneLogin.tab',
-                  defaultMessage: '手机号登录',
-                })}
-              />

同时删除 type 为 mobile 这一段:

{type === 'mobile' && (
	...
}

去掉其他登录方式

-          <Space className={styles.other}>
-            <FormattedMessage id="pages.login.loginWith" defaultMessage="其他登录方式" />
-            <AlipayCircleOutlined className={styles.icon} />
-            <TaobaoCircleOutlined className={styles.icon} />
-            <WeiboCircleOutlined className={styles.icon} />
-          </Space>

去掉忘记密码

-              <a
-                style={{
-                  float: 'right',
-                }}
-              >
-                <FormattedMessage id="pages.login.forgotPassword" defaultMessage="忘记密码" />
-              </a>

修改标题

@@ -95,11 +95,11 @@ const Login: React.FC = () => {
           <div className={styles.header}>
             <Link to="/">
               <img alt="logo" className={styles.logo} src="/logo.svg" />
-              <span className={styles.title}>Ant Design</span>
+              <span className={styles.title}>大象笔记</span>
             </Link>
           </div>
           <div className={styles.desc}>
-            {intl.formatMessage({ id: 'pages.layouts.userLayout.title' })}
+            宇宙无敌大象 
           </div>
         </div>

关于作者 🌱

我是来自山东烟台的一名开发者，有感兴趣的话题，或者软件开发需求，欢迎加微信 zhongwei 聊聊，或者关注我的个人公众号“大象工具”， 查看更多联系方式