关于iview表单验证的问题

最新推荐文章于 2021-08-05 11:00:53 发布

Lucky铂爵

最新推荐文章于 2021-08-05 11:00:53 发布

阅读量211

点赞数

本文链接：https://blog.csdn.net/weixin_44816309/article/details/106351033

版权

此作品针对select验证

html:

<template>
  <div>
    <Form ref="formInline" :model="formInline" :rules="ruleInline" :label-width="80">
      <FormItem label="City" prop="city">
        <Select v-model="formInline.city" style="width:200px">
          <Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
        </Select>
      </FormItem>
      <FormItem>
        <Button type="primary" @click="handleSubmit('formInline')">Signin</Button>
      </FormItem>
    </Form>
  </div>
</template>

data:

    cityList: [
        {
          value: "New York",
          label: "New York"
        }
      ],
   formInline: {
        city: ""
      },
      ruleInline: {
        city: [
          {
            required: true,
            message: "不能为空",
            trigger: "change"
          }
        ]
      }

methods:

handleSubmit() {
  this.$refs.formInline.validate(valid => {
    if (valid) {
      this.$Message.success("Success!");
    } else {
      this.$Message.error("Fail!");
    }
  });
}

注意：验证的是 :model里面的数据