naiveUI的表单校验

    <n-form
      :model="formValue"
      ref="formRefName"
      :rules="rules"
      :size="'medium'"
      label-placement="top"
    >
  const formValue = ref({
    deviceNewName: '',
  });

  watchEffect(() => {
    if (isOpenNameDialog.value) {
      formValue.value.deviceNewName = currentName;
    }
  });
  const rules = reactive({
    deviceNewName: [
      { required: true, message: $t('deviceNameCantNotEmpty'), trigger: ['blur', 'input'] },
      {
        validator(rule: FormItemRule, value: string) {
          console.log(rule);
          return value !== currentName;
        },
        trigger: ['blur'],
        message: $t('cantNotSameName'),
      },
    ],
  });

异步校验可以看naiveUI官网

posted @ 2024-02-19 09:33  饼MIN  阅读(654)  评论(0)    收藏  举报