The phenomenon of

If I use V-if to switch the radio option, the bound verification rule will be invalid.

code

The solution

There are many options, four of which are posted here

  • Option 1: Add a key to each item as a distinction

In MOUNTED, the validation event of the form-item binding is not rebound after the rule changes. The v-if rendering component node diff is re-used, so the validation event is automatically invalid

  • Plan 2: Write rules in item directly

  • Scheme 3: Use check function

  • Scheme 4: Wrap two layers of divs in the outer layer