Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

New Login component #147

Merged
merged 9 commits into from
Jan 1, 2018
Merged

New Login component #147

merged 9 commits into from
Jan 1, 2018

Conversation

ddcat1115
Copy link
Contributor

  • 有默认的内置输入控件
  • 支持配置常见的登录用输入控件

基本确定用法后再同步到脚手架~

#45

@afc163
Copy link
Member

afc163 commented Nov 11, 2017

API 搞成可组合的如何?

<Login>
  <Login.Username />
  <Login.Password />
  <Login.Captcha />
  <Login.Submit>提交</Login.Submit>
</Login>

@ddcat1115
Copy link
Contributor Author

这样也不是很好搞,还要跟 tabs 结合到一起,要分组,还要有每组的title之类的

@afc163
Copy link
Member

afc163 commented Nov 11, 2017

<Login.Username /> 就包含了 label + input,主要是方便组合和添加自定义需求。

<Login onSubmit={}>
  <Login.Tab title="xx">
    <Login.Username />
    <Login.Password />
    <Login.Captcha />
    <div>可以加任何东西</div>
  </Login.Tab>
  <Login.Tab title="yy">
    <Login.Username />
    <Login.Password />
    <div>可以加任何东西</div>
  </Login.Tab>
  <Login.Submit>提交</Login.Submit>
</Login>

@ddcat1115
Copy link
Contributor Author

这样在结构上确实比较灵活,但如果自定义部分需要新增输入控件,好像没有很好的方式把新增的key挂到对应的tab下?这样校验和提交数据的时候有点麻烦。

@afc163
Copy link
Member

afc163 commented Nov 13, 2017

用户自行同步到 state 里面并在 onSubmit 时合并即可。组件不管这个。

@ddcat1115
Copy link
Contributor Author

那校验也需要完全自己写了,包括onChange和onSubmit的时候。。。我试下

@afc163
Copy link
Member

afc163 commented Nov 13, 2017

需要自定义,还是可以组合 Form 和 Form.Item 吧。

@ddcat1115
Copy link
Contributor Author

Login 里肯定包含 Form 了,自定义里面只能直接写 FormItem

this.state.notice &&
<Alert style={{ marginBottom: 24 }} message={this.state.notice} type="error" showIcon closable />
}
<UserName itemKey="username" />
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

itemKey => name?

}
#scaffold-src-components-Login-demo-basic .icon-weibo:hover {
background-position: 0 -48px;
}
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

这几个图标有在 iconfont 里的。

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

weibo 和 taobao 么有 circle 的,等设计师加好后更新

@afc163
Copy link
Member

afc163 commented Nov 23, 2017

@ddcat1115 Rebase 一下 master。66583a7 临时修掉了这个问题。

nikogu/roadhog-api-doc#12@nikogu 回来发个新版。

@@ -8,15 +8,17 @@ describe('Login', () => {
});

it('should login with failure', async () => {
await page.type('#userName', 'mockuser')
await page.wait(5000)
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

这个应该也不需要了。

@nikogu nikogu mentioned this pull request Nov 27, 2017
@afc163 afc163 mentioned this pull request Dec 1, 2017
6 tasks
@nikogu nikogu added the v1 label Dec 1, 2017
@sbyps
Copy link

sbyps commented Dec 1, 2017

@ddcat1115 这个代码思路迫切需要,请问在Login组件中如何支持和自定义控件配合使用?
这个自定义控件不在map里面添加,而是在具体的页面里面

@afc163
Copy link
Member

afc163 commented Dec 17, 2017

https://github.com/segmentio/nightmare#opendevtools

可以本地运行用例查看报错原因。

@ddcat1115
Copy link
Contributor Author

本地一直是通过的 😓

@afc163
Copy link
Member

afc163 commented Dec 18, 2017

npm run build
cd dist
起一个 8000 的服务
npm test

@chenshuai2144
Copy link
Collaborator

Warning: React depends on requestAnimationFrame. Make sure that you load a polyfill in older browsers. http://fb.me/react-polyfills
这个错误...看看这个把. react16 需要 requestAnimationFrame
jestjs/jest#1644

@ddcat1115
Copy link
Contributor Author

dist 下也通过的

@afc163
Copy link
Member

afc163 commented Dec 30, 2017

构建后的应用是有问题的:

image

@afc163
Copy link
Member

afc163 commented Dec 30, 2017

image

const TabChildren = [];
const otherChildren = [];
React.Children.forEach(children, (item) => {
if (item.type.name === 'LoginTab') {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

这里出了问题。

@ddcat1115 ddcat1115 merged commit 1a5b7ac into master Jan 1, 2018
@afc163 afc163 deleted the Login branch January 2, 2018 01:51
dengli1216 pushed a commit to myForkProject/ant-design-pro that referenced this pull request Mar 17, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants