el-form校验提交的问题

使用el-form做提交时，使用了校验，那么只有校验通过是才能提交表单。重点

el-form ref="ruleForm"

 this.$refs['ruleForm'].validate((valid) => {}

<template>
  <div class="app-container">
    <el-card class="box-card" style="margin-bottom: 20px;height: 80px">
      <el-form ref="ruleForm" :model="info" :rules="rules" label-position="right" label-width="20px" style="width: 100%; margin-left:0px; height: 30px">
        <el-row>

          <el-form-item label="" prop="day">
            <el-input style="width: 30%" v-model="info.day" placeholder="请输入天数"/>
            <el-button style="width: 100px" type="primary" @click="submitForm()">
              查询
            </el-button>
          </el-form-item>

        </el-row>
      </el-form>
    </el-card>

  </div>
</template>

<script type="javascript">
  import { formatDate } from '@/utils/date.js'
  import Pagination from '@/components/Pagination'
  import vueJsonEditor from 'vue-json-editor'
  import * as echarts from 'echarts'
  export default {
    name: 'futuresEchartsLine',
    filters: {
      // statusFilter(status) {
      //   const statusMap = {
      //     published: 'success',
      //     draft: 'gray',
      //     deleted: 'danger'
      //   }
      //   return statusMap[status]
      // },
      formatDate(time) {
        if (time != null && time != '') {
          var date = new Date(Date.parse(time.replace(/-/g, '/')))
          return formatDate(date, 'yyyy-MM-dd')
        } else {
          return ''
        }
      }
    },
    total: 0,
    components: {
      Pagination,
      vueJsonEditor,
    },
    data() {
      return {
        list: [],
        listLoading: true,
        total: 0,
        listQuery: {
          page: 1,
          limit: 50
        },
        
        info:{
          dataType:1,
          day:""
        },
        dialogFormVisible: false,
        dialogStatus: '',
        textMap: {
          editConfig: '',
          addConfig: ''
        },
        rules: {
          day:[{ type: 'string', pattern: '^[1-9]\\d*$',required: true, message: '请输入正整数，且不能为空', trigger: 'change' }],
        }
      }
    },
    created() {
    },
    mounted: function() {

      this.listLoading = true
    },
    methods: {
      getList() {
        var url = this.HOST + '/xxx/xxxx'
        var qs = require('qs');
        this.$axios.post(url, qs.stringify(this.info), {
          headers: {
            'Content-Type': 'application/x-www-form-urlencoded',
          },
        })
          .then(res => {
            if (res.data.needReLogin === 1) {
              this.$store.dispatch('LogOut').then(() => {
                location.reload()
              })
            }
            this.listLoading = false
  

          })
          .catch(error => {
            console.log(error)
          })
      },

  
      submitForm() {
        this.$refs['ruleForm'].validate((valid) => {  //开启校验
          if (valid) {   // 如果校验通过，请求接口，允许提交表单
           this.getList()
          } else {   //校验不通过
            return false;
          }
        });
      }




    }
  }

</script>

第二种

        this.$refs['dataForm'].validate((valid) => {
          if (valid) {
           
          }
        })