Skip to content

Form 與其以下輸入類型的表單驗證 #7735

@7Red4

Description

@7Red4
  • I have searched the issues of this repository and believe that this is not a duplicate.

What problem does this feature solve?

為什麼所有的驗證都要經過 a-form 的 model, 跟子層的 name
為什麼不像 vuetify 那樣用 provide, inject 的方式做子層輸入類元件綁定, 其餘讓 from 去做統一管理就好
當我元件內很多動態且複雜的輸入需要做驗證的時候我還要一個一個去尋找這個資料目前到 model 的哪個地方
有時候東西已經到很深的巢狀層內, 我甚至還要去對 index 去找陣列裡的東西, 導致內部的 name 寫超長甚至還要下判斷等等
其實子層應該只要只要一個 rules 即可, 何必要 models, names 這些東西去對應驗證?

What does the proposed API look like?

<template>
  <!-- `model` props shouldn't be required for validation -->
  <a-form ref="ref_form">

    <!-- very nested and complex structure ... -->

    <!-- `name` props shouldn't be required for validation -->
    <a-input :rules="[/* some validate rules */]"></a-input>
  </a-form>
</template>

<script setup>
  const ref_form = ref();

  const validate = async () => {
    const { validate, fields } = await ref_form.value.validate();

    // fields is component instances

    if (validate) {
      // do something
    } else {
      // do something
    }
  };
</script>

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions