#鸿蒙学习大百科#如何实现LoginPanel的登录方式？

import { LoginPanel, loginComponentManager } from '@kit.AccountKit';
import { BusinessError } from '@kit.BasicServicesKit';
import { hilog } from '@kit.PerformanceAnalysisKit';

@Entry
@Component
struct Index {
  @State show: boolean = true;
  /**
   * 定义LoginPanel展示的隐私文本
   */
  privacyText: loginComponentManager.PrivacyText[] = [{
    text: '已阅读并同意',
    type: loginComponentManager.TextType.PLAIN_TEXT
  }, {
    text:'隐私政策',
    tag: '隐私政策',
    type: loginComponentManager.TextType.RICH_TEXT
  }, {
    text: '和',
    type: loginComponentManager.TextType.PLAIN_TEXT
  },
    {
      text: '用户服务协议',
      tag: '用户服务协议',
      type: loginComponentManager.TextType.RICH_TEXT
    }
  ];
  /**
   * 构造LoginPanel组件的控制器
   */
  controller: loginComponentManager.LoginPanelController = new loginComponentManager.LoginPanelController()
    .onClickLoginWithHuaweiIDButton((error: BusinessError, response: loginComponentManager.HuaweiIDCredential) => {
      hilog.info(0x0000, 'testTag', 'onClickLoginWithHuaweiIDButton');
      if (error) {
        hilog.error(0x0000, 'testTag', 'error: %{public}s', JSON.stringify(error));
        return;
      }

      if (response) {
        hilog.info(0x0000, 'testTag', 'response: %{public}s', JSON.stringify(response));
        this.show = false;
        return;
      }
    })
    .onClickOptionalLoginButton(() => {
      hilog.info(0x0000, 'testTag', 'onClickOptionalLoginButton ');
      this.show = false;
    })
    .onClickPrivacyText((error: BusinessError, tag: string) => {
      if (error) {
        hilog.error(0x0000, 'testTag', 'onClickPrivacyText fail: %{public}s', JSON.stringify(error));
        return;
      }
      hilog.info(0x0000, 'testTag', 'onClickPrivacyText tag: %{public}s', tag);
    })
    .onClickCloseButton(() => {
      hilog.info(0x0000, 'testTag', 'onClickCloseButton ');
      this.show = false;
    });
  build() {
    Stack() {
      LoginPanel({
        show: this.show,
        params: {
          appInfo: {
            appIcon: $r('app.media.app_icon'),
            appName: '应用名称',
            appDescription: '应用描述'
          },
          privacyText: this.privacyText,
          loginType: loginComponentManager.LoginType.PHONE_NUMBER,
          optionalLoginButtonAttr: { text: '其他方式登录' }
        },
        controller: this.controller
      })
    }
    .height('100%')
    .width('100%')
  }
}