element [bug report] dynamic formitem causes the rule verification of form to be invalid

cwdobuhd  于 2022-11-13  发布在  其他
关注(0)|答案(2)|浏览(137)

Element UI version

2.13.0

OS/Browsers version

MacOs 10.13.6 / Chrome 79

Vue version

2.6.11

https://codepen.io/wgcg/pen/bGNLvPg

Steps to reproduce

  1. click the switch button
  2. click "立即创建"

What is Expected?

"活动形式"的规则进行校验 给予相应的错误提示

What is actually happening?

没有在活动形式的输入框输入内容 但是校验通过了

原因

复用了之前的FormItem实例,不会触发FormItem的mounted事件,也就不会push进form.fields中

临时解决方案

  1. 给”活动备注“的FormItem组件增加prop属性,这样在mounted时就会把该组件实例push进form.fields中,切换后复用了该组件,会更新它的prop属性,这样就能正常校验了
  2. 给"活动形式"的FormItem增加key属性,避免复用
wlp8pajw

wlp8pajw1#

Translation of this issue:

Element UI version

2.13.0

OS/Browsers version

MacOs 10.13.6 / Chrome 79

Vue version

2.6.11

https://codepen.io/wgcg/pen/bGNLvPg

Steps to reproduce

  1. click the switch button
  2. Click "create now"

What is Expected?

Check the rules of "activity form" and give corresponding error prompt

What is actually happening?

There is no input in the active input box, but the verification is passed

    • reasons * *
      Reusing the previous formitem instance will not trigger the mounted event of formitem, nor push it into form.fields

Interim solutions

  1. Add the prop attribute to the formitem component of "activity note", so that when it is mounted, the component instance will be pushed into form.fields. After switching, the component will be reused, and its prop attribute will be updated, so that it can be verified normally
  2. Add key attribute to formitem of "activity form" to avoid reuse
xmakbtuz

xmakbtuz2#

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

相关问题