跳到主要内容

ForgetPWD 忘记密码页

中后台项目统一的“忘记密码”页面，有三种主题：百威红、品牌黄、品牌黄（表单白背景）。

同时集成了接口请求、阿里云验证码2.0。

提示

使用 Page 组件前，务必先

  1. 在 HTML 的 head 标签中添加：
<script>
  window.AliyunCaptchaConfig = { region: 'cn', prefix: '1bl0mz' };
</script>
<script type="text/javascript" src="https://o.alicdn.com/captcha-frontend/aliyunCaptcha/AliyunCaptcha.js"></script>
  1. 在应用入口处添加以下代码：
import { BfPage } from '@bud-fe/react-pc-ui';
import request from './utils/request';

// 初始化 BfPage 中登录页、忘记密码页需要的参数
BfPage.configRequest({
  // @bud-fe/request 的 AxiosRequest 实例
  request,
  // 应用对应的 systemId。默认1代表业务中台
  systemId: 1,
});
// 启用智能验证 2.0【BfPage 默认使用智能验证 1.0，待 1.0 下线后（25 年底）计划默认启用 2.0】
BfPage.openAliyunCaptcha();
// 如果有特殊需求需要自定义 SceneId 或者在其他页面使用智能验证 2.0，BfPage 有提供 useAliyunCaptcha 函数
// const { aliyunCaptchaRef } = BfPage.useAliyunCaptcha({ aliyunCaptchaConfig: { //... } })

完整示例可参考模板工程代码：

基本使用​

百威红​

品牌黄​

品牌黄（表单白背景）​

提示

设置页面组件的 type 属性来切换不同主题时，务必记得先 快速上手-定制 antd 主题。

API​

参数类型默认值是否必填说明