登录与错误页布局

用于登录 / 注册 / 找回密码 / 锁屏以及错误页面（400、403、404、500、503）的独立布局，文本均已翻译。

AuthLayout

AuthLayout

Vue

<div class="auth-frame"><ThlAuthLayout title="Sign in"><ThlField label="Email"><ThlInput type="email" /></ThlField><ThlField label="Password"><ThlInput type="password" /></ThlField><ThlButton variant="danger" block>Log in</ThlButton></ThlAuthLayout></div>

React

<AuthLayout title={t('pages.login.title')}>
  <Form …>…</Form>
</AuthLayout>

Angular

<thl-auth-layout [title]="'pages.login.title' | thlT">
  <form …>…</form>
</thl-auth-layout>

ErrorLayout

ErrorLayout

Vue

<div class="auth-frame"><ThlErrorLayout :code="404" home-href="#" /></div>

React

<ErrorLayout code={404} homeHref="/" />

Angular

<thl-error-layout [code]="404" homeHref="/" />

API

AuthLayout

<ThlAuthLayout> · import { ThlAuthLayout } from '@thl-ui/vue'

Prop	类型	默认值
title	string	—
avatar	string	—

插槽: logodefaultfooter

ErrorLayout

<ThlErrorLayout> · import { ThlErrorLayout } from '@thl-ui/vue'

Prop	类型	默认值
code*	number	—
title	string	—
text	string	—
homeHref	string	"/"

插槽: action