Vue-ant-design-vue 表单项输入时卡顿问题
问题:vue项目中使用了ant-design-vue的Form表单,并且自定义校验方法,之后发现我在输入框进行输入内容时,出现卡顿的问题,响应特变慢,后来找了一下官方文档发现表单有一个【selfUpdate】的参数,意思是:自定义字段更新逻辑。果不其然,当我们在输入框输入内容时,vue进行多次的render刷新渲染操作,导致form-item的input在输入时出现卡顿问题。官方参数说明:(htt
·
问题:vue项目中使用了ant-design-vue的Form表单,并且自定义校验方法,之后发现我在输入框进行输入内容时,出现卡顿的问题,响应特变慢,后来找了一下官方文档发现表单有一个【selfUpdate】的参数,意思是:自定义字段更新逻辑。果不其然,当我们在输入框输入内容时,vue进行多次的render刷新渲染操作,导致form-item的input在输入时出现卡顿问题。
官方参数说明:(https://www.antdv.com/components/form-cn/#selfUpdate)
我所了解到的几种解决办法:
1. Form表单增加selfUpdate属性,并设置为true:
2. 官方给出的解决办法,将 Form 相关的业务独立到一个单独的组件中,减少组件渲染的消耗,如果有很多校验项,可把它们分别放在不同的Form中处理
3. 通过 change/onValuesChange方法
更多推荐
已为社区贡献3条内容
所有评论(0)