使用vue做表單驗證

<template>

<Form ref="formInline" :model="formInline" :rules="ruleInline" inline>

  <Row>
    <Col span='8'>
      公司名稱：
    </Col>
    <Col span='16'>
      <FormItem prop="name">
        <Input type="text" v-model="formInline.name" placeholder="請輸入公司名稱">
        </Input>
      </FormItem>
    </Col>
  </Row>

</Form>

</template>
export default{
　　name:'本vue文件名'，
　　date(){
　　　　return {
　　　　　　others:'',//其他變量
　　　　　　formInline:{
　　　　　　　　name:'',//綁定表單下的prop屬性至信息框
　　　　　　　　...
　　　　　　}
　　　　　　ruleInline:{//定義規則
　　　　　　　　name:[
　　　　　　　　　　{request:ture, message:'不合規則提示的信息', trigger:'blur'}//是否規則，，綁定的觸發事件
　　　　　　　　]
　　　　　　}

　　　　}
　　}
　　methods:{
　　　　//提交表單方法
　　　　submit(){
　　　　　　//表單驗證方法，調用父組件-from
　　　　　　this.$refs['父組件的ref值'].validate((valid)=>{
　　　　　　//自動檢測，返回true/false給valid進行相應操作
　　　　　　　if(valid){
　　　　　　　　//表單驗證通過
　　　　　　　}else{
　　　　　　　　//表單驗證失敗
　　　　　　　}
　　　　　　　　
　　　　　　})
　　　　}

　　}
}