iview 表单提交之前验证是否符合条件

在表单提交之前 调用接口校验用户输入是否符合条件
符合则通过， 不符合 不让提交

 <Card :title="title">
      <Form class="mt10" :model="editFormData" :rules="editFormValidate" style="width:500px;"  ref="editForm"  :label-width="100">
        <FormItem label="商品分类 ：" label-position="left" prop="categoryId">
          <Select v-model="editFormData.categoryId" @on-change='changeCategory'>
            <Option v-for="item in classifyList" :value="item.value" :key="item.label">{{item.label}}</Option>
          </Select>
        </FormItem>
        <FormItem label="品牌名称 ：" prop="brandName">
          <Input maxlength="50" show-word-limit placeholder="请输入品牌名称" v-model="editFormData.brandName" />
        </FormItem>
        <FormItem label="商品名称 ：" prop="name">
          <Input maxlength="50" show-word-limit placeholder="请输入商品名称" v-model="editFormData.name" />
        </FormItem>
       <div class="flex">
        <FormItem label="商品规格 ：" prop="specifications" style="width:75%">
          <Input placeholder="请输入商品规格" v-model="editFormData.specifications" maxlength="9" show-word-limit/>
        </FormItem>
        <FormItem prop="unit" class="unitInput" style="width:25%">
          <Select v-model="editFormData.unit"  placeholder="规格单位">
            <Option v-for="item in unitList" :value="item.value" :key="item.label">{{item.label}}</Option>
          </Select>
        </FormItem>
       </div>
        <FormItem label="图片上传 ：" prop="file">
          <div v-if="photo" class="upload-img">
            <img height="100%" :src="photo" />
          </div>
          <Upload type="drag" v-model="editFormData.file" style="display:inline-block;width:100px;" :max-size="200" accept=".png" :format="['png']" :before-upload="fileBeforeUpload" action="//">
            <div v-if="!photo" style="width: 100px;height:100px;line-height: 100px;">
              <Icon type="md-add" size="20"></Icon>
            </div>
            <span v-else class="cp">更换</span>
          </Upload>
          <div class="tips">请上传200K以内的PNG格式图片，尺寸为750x750</div>
        </FormItem>
        <FormItem label="商品条码 ：" prop="barCode">
          <Input  maxlength="20" show-word-limit placeholder="可以输入商品外包装条形码，或者自行定义的商品码" v-model="editFormData.barCode"/>
        </FormItem>
        <FormItem label="品目编码 ：" prop="itemCode">
          <Input maxlength="50" show-word-limit placeholder="(选填)" v-model="editFormData.itemCode" />
        </FormItem>
        </FormItem>
      </Form>
    </Card>
    <div class="tac mt10">
      <Button class="btn" style="margin-right: 8px" @click="handleReset('editForm')">返回</Button>
      <Button class="btn" type="primary" @click="handleSubmit('editForm',submitForm)" :loading="btnLoading">提交</Button>
    </div>

export default {
  data () {
   const validateFile = (rule, value, callback) => {
      if (!this.photo && !this.editFormData.file) {
        callback(new Error('请上传图片'))
      } else {
        callback()
      }
    }
    // 校验商品条码
    const valideBarCode = (rule, value, callback) => {
      var reg = /^[0-9]+$/i
      if (!reg.test(value)) return callback()
      let id
      if (this.actionType === 'add') {
        id = 0
      } else {
        id = this.$route.params['id']
      }
      const data = {
        type: 1,
        code: value,
        id: id
      }
      checkGoods(data).then(res => {
        const {
          data: { data }
        } = res
        if (data) {
          callback(new Error('商品条码重复，请重新输入'))
        } else {
          callback()
        }
      }, err => {
        // 接口错误
        console.log(err)
      }).catch(err => {
        // 处理逻辑出错
        console.log(err)
      })
    }
    // 校验品目条码
    const valideItemCode = (rule, value, callback) => {
      console.log(value)
      let id
      if (this.actionType === 'add') {
        id = 0
      } else {
        id = this.$route.params['id']
      }
      const data = {
        type: 2,
        code: value,
        id: id
      }
      checkGoods(data).then(res => {
        const {
          data: { data }
        } = res
        if (data) {
          callback(new Error('商品条码重复，请重新输入'))
        } else {
          callback()
        }
      }, err => {
        // 接口错误
        console.log(err)
      }).catch(err => {
        // 处理逻辑出错
        console.log(err)
      })
    }
  }
}

 return {
  barCode: [
          { required: true, message: '请输入数字条码', trigger: 'change' },
          { validator: valideBarCode, trigger: 'blur' },
          { message: '请输入20字以内的数字条码', trigger: 'change', pattern: /^[0-9]+$/i }
        ],
        itemCode: [
          { required: false, message: '请输入品目编码', trigger: 'change' },
          { message: '请输入50字以内 数字和字母的品目编码', trigger: 'change', pattern: /^[A-Za-z0-9]+$/ },
          { validator: valideItemCode, trigger: 'blur' }
        ],
}

submitForm () {
// 提交
}