vue表单校验（判空校验+去重校验）

一：在表单中添加rules校验属性
<el-form
  ref="addMenu"
  :model="addMenu"
  :rules="addRules"
  label-position="right"
  label-width="80px"
  style="margin-left: 40px;"
>
  <el-row>
    <el-col :span="6">
      <el-form-item label="标题" prop="title">
        <el-input v-model="addMenu.title" maxlength="100" show-word-limit placeholder="请输入标题" style="width: 90%;"></el-input>
      </el-form-item>
    </el-col>
　　</el-row>
</el-form>
二：在data中添加校验规则（其中的属性名称要和表单中的prop对应）

data () {
  return {

addRules: {
  title: [
  { required: true, validator: this.validateTitle, trigger: 'blur' }
  ],
  publishTime: [
  { required: true, message: '请选择发表时间' }
  ],
  resourceType: [
  { required: true, message: '请选择资源类型' }
  ],
  summary: [
  { required: true, message: '请输入摘要', min: 0, max: 1000, trigger: 'blur' }
  ]
},
}
}
三：去重校验函数自定义（在method中定义）：去重的具体方法放到了后台处理（思路就是获取到输入的value，根据value查询数据，如果查询到就返回code200），前台调用callback返回提示信息
rule:指的是表单中rules属性
value：指的表单输入框中输入的值
callback:回调函数（再次调用校验函数）

// 校验标题
validateTitle (rule, value, callback) {
  if (!value) {
    callback(new Error('请输入标题'))
  } else {
    this.$http({
      url: this.$http.adornUrl('/resource/getByTitle/' + value),
      method: 'GET'
    }).then(res => {
      const data = res.data
      if (data.code === 200) {
        callback(new Error('此标题已存在'))
      } else {
        callback()
      }
    })
  }
},