Yup that only allows a single domain address in vue 3?-CodePudding

I have an add user form and need allows only one domain address in Yup,for example ([email protected]) in here have to only allows "@abc.com". Not allows @outlook.com ,not allows @gmail.com etc. Any helps? Thank you in advance.

  const addUser = Yup.object().shape({
      email: Yup.string()
        .email(i18n.t("form.message.email"))
        .required(i18n.t("form.message.required")),
      first_name: Yup.string().required(i18n.t("form.message.required")),
      last_name: Yup.string().required(i18n.t("form.message.required")),
    });

Here is html code

   <div >
            <label 
              >{{ $t("form.label.email") }}:</label
            >
            <Field
              
              type="email"
              v-model="email"
              name="email"
              autocomplete="off"
              :placeholder="$t('form.label.email')"
            />
            <div >
              <div >
                <ErrorMessage name="email" />
              </div>
            </div>
          </div>

CodePudding user response：

You should use regex to validate email domain

const addUser = Yup.object().shape({
      email: Yup.string()
        .email(i18n.t("form.message.email")) 
        .required(i18n.t("form.message.required"))
         .matches(/\@abc.com$/, 'Domain not allowed) // <--- Add this,
      first_name: Yup.string().required(i18n.t("form.message.required")),
      last_name: Yup.string().required(i18n.t("form.message.required")),
});