nanxiaobei / ant-plus

🪄 Ant Design Form Simplified
MIT License
279 stars 16 forks source link

验证时特别卡顿 #1

Closed Wanchaochao closed 5 years ago

Wanchaochao commented 5 years ago

引入以后运行正常,没有任何报错 但是在我的电脑和同事的电脑上都试过了 卡顿非常明显 my code:

` ... class Article extends Component { ...

              <Input
                label="用户名"
                id="username"
                rules={['required', 'string', 'max=10']}
                max={10}
                msg="full"
              />

...

export default Form.create()(Article) ... ` 当进行验证的时候一个一个慢慢输入是没有问题的,但是当输入速度快的时候,卡顿非常明显,体验不是很好

dazer007 commented 5 years ago

是否支持远程校验呢 remote, 这个平时用的也很多,还希望能够加上呢。附一个nice-validator 的这种校验:nice validtor

Wanchaochao commented 5 years ago

问题已经解决了,我的页面上有一段代码是marked.js把markdown整理成html 最开始我把marked(content)这段代码放在了页面里 只要每次input输入内容都会非常卡顿,但是只要去掉这行代码,马上没有任何问题了 跟ant-plus封装的input没有任何关系,antd官方的input也会有这个问题 最后的解决办法是在model里,请求接口返回文章内容以后,用marked.js把content整理以后再放入state中

nanxiaobei commented 5 years ago

@Wanchaochao 好的。

我没有复现你的「很卡顿」的情况,不过 Input 每个字符的输入都会触发重新渲染,确实是性能消耗大户。 看到你的 issue 后,我尝试使用 debounce 来优化性能,不过 Ant Deisgn 接管了表单输入,debounce 暂不可行。 后面会发一版新的,对代码进行一些很细节的优化,希望能尽量提升性能~

nanxiaobei commented 5 years ago

@dazhi007 Ant Plus 基于 Ant Design 的组件,会尽可能的保持一致。 Ant Design 校验使用的是 async-validator,Ant Plus 暂时不会进行额外的扩展,谢谢~