Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
钟摆人-Puppet゜
ant-design-pro
提交
ca6453a3
A
ant-design-pro
项目概览
钟摆人-Puppet゜
/
ant-design-pro
与 Fork 源项目一致
从无法访问的项目Fork
通知
2
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
A
ant-design-pro
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
ca6453a3
编写于
3月 26, 2019
作者:
陈
陈帅
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
bugfix: fix #3576, add max-width
上级
e6fe4979
变更
1
隐藏空白更改
内联
并排
Showing
1 changed file
with
79 addition
and
46 deletion
+79
-46
src/components/Login/demo/basic.md
src/components/Login/demo/basic.md
+79
-46
未找到文件。
src/components/Login/demo/basic.md
浏览文件 @
ca6453a3
...
...
@@ -18,65 +18,94 @@ class LoginDemo extends React.Component {
notice
:
''
,
type
:
'
tab2
'
,
autoLogin
:
true
,
}
}
;
onSubmit
=
(
err
,
values
)
=>
{
console
.
log
(
'
value collected ->
'
,
{
...
values
,
autoLogin
:
this
.
state
.
autoLogin
});
console
.
log
(
'
value collected ->
'
,
{
...
values
,
autoLogin
:
this
.
state
.
autoLogin
,
});
if
(
this
.
state
.
type
===
'
tab1
'
)
{
this
.
setState
({
notice
:
''
,
},
()
=>
{
if
(
!
err
&&
(
values
.
username
!==
'
admin
'
||
values
.
password
!==
'
888888
'
))
{
setTimeout
(()
=>
{
this
.
setState
({
notice
:
'
The combination of username and password is incorrect!
'
,
});
},
500
);
}
});
this
.
setState
(
{
notice
:
''
,
},
()
=>
{
if
(
!
err
&&
(
values
.
username
!==
'
admin
'
||
values
.
password
!==
'
888888
'
)
)
{
setTimeout
(()
=>
{
this
.
setState
({
notice
:
'
The combination of username and password is incorrect!
'
,
});
},
500
);
}
},
);
}
}
}
;
onTabChange
=
(
key
)
=>
{
this
.
setState
({
type
:
key
,
});
}
}
;
changeAutoLogin
=
(
e
)
=>
{
this
.
setState
({
autoLogin
:
e
.
target
.
checked
,
});
}
}
;
render
()
{
return
(
<
Login
defaultActiveKey
=
{
this
.
state
.
type
}
onTabChange
=
{
this
.
onTabChange
}
onSubmit
=
{
this
.
onSubmit
}
>
<
Tab
key
=
"tab1"
tab
=
"Account"
>
{
this
.
state
.
notice
&&
<
Alert
style
=
{
{
marginBottom
:
24
}
}
message
=
{
this
.
state
.
notice
}
type
=
"error"
showIcon
closable
/>
}
<
UserName
name
=
"username"
/>
<
Password
name
=
"password"
/>
</
Tab
>
<
Tab
key
=
"tab2"
tab
=
"Mobile"
>
<
Mobile
name
=
"mobile"
/>
<
Captcha
onGetCaptcha
=
{
()
=>
console
.
log
(
'
Get captcha!
'
)
}
name
=
"captcha"
/>
</
Tab
>
<
div
>
<
Checkbox
checked
=
{
this
.
state
.
autoLogin
}
onChange
=
{
this
.
changeAutoLogin
}
>
Keep me logged in
</
Checkbox
>
<
a
style
=
{
{
float
:
'
right
'
}
}
href
=
""
>
Forgot password
</
a
>
</
div
>
<
Submit
>
Login
</
Submit
>
<
div
>
Other login methods
<
span
className
=
"icon icon-alipay"
/>
<
span
className
=
"icon icon-taobao"
/>
<
span
className
=
"icon icon-weibo"
/>
<
a
style
=
{
{
float
:
'
right
'
}
}
href
=
""
>
Register
</
a
>
</
div
>
</
Login
>
<
div
className
=
"login-warp"
>
<
Login
defaultActiveKey
=
{
this
.
state
.
type
}
onTabChange
=
{
this
.
onTabChange
}
onSubmit
=
{
this
.
onSubmit
}
>
<
Tab
key
=
"tab1"
tab
=
"Account"
>
{
this
.
state
.
notice
&&
(
<
Alert
style
=
{
{
marginBottom
:
24
}
}
message
=
{
this
.
state
.
notice
}
type
=
"error"
showIcon
closable
/>
)
}
<
UserName
name
=
"username"
/>
<
Password
name
=
"password"
/>
</
Tab
>
<
Tab
key
=
"tab2"
tab
=
"Mobile"
>
<
Mobile
name
=
"mobile"
/>
<
Captcha
onGetCaptcha
=
{
()
=>
console
.
log
(
'
Get captcha!
'
)
}
name
=
"captcha"
/>
</
Tab
>
<
div
>
<
Checkbox
checked
=
{
this
.
state
.
autoLogin
}
onChange
=
{
this
.
changeAutoLogin
}
>
Keep me logged in
</
Checkbox
>
<
a
style
=
{
{
float
:
'
right
'
}
}
href
=
""
>
Forgot password
</
a
>
</
div
>
<
Submit
>
Login
</
Submit
>
<
div
>
Other login methods
<
span
className
=
"icon icon-alipay"
/>
<
span
className
=
"icon icon-taobao"
/>
<
span
className
=
"icon icon-weibo"
/>
<
a
style
=
{
{
float
:
'
right
'
}
}
href
=
""
>
Register
</
a
>
</
div
>
</
Login
>
</
div
>
);
}
}
...
...
@@ -85,6 +114,10 @@ ReactDOM.render(<LoginDemo />, mountNode);
````
<style>
#scaffold-src-components-Login-demo-basic .login-warp{
max-width: 360px;
margin: auto;
}
#scaffold-src-components-Login-demo-basic .icon {
display: inline-block;
width: 24px;
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录