SOURCE

var Main = {
  data() {
    return {
      columns:[
          {
              props:{
                type: 'seq',
                title: '序号'
              }
          },
          {
              props:{
                field: 'name',
                title: '名字'
              }
          },
          {
              props:{
                field: 'sex',
                title: '性别'
              }
          },
          // 渲染出<vxe-input v-model="value405" placeholder="日期和时间选择" type="datetime" clearable></vxe-input>
          {
              props:{
                field: 'date',
                title: '日期',
                editRender:{
                    name: '$input',
                    props: {
                        placeholder:'日期和时间选择',
                        type: 'datetime'
                    }
                }
              }
          },
          //渲染出 <input type="number"/>
          {
              props:{
                  field: 'score',
                  title: '分数',
                  'edit-render':{ //也可写成editRender
                      name: 'input', //渲染器名称 可选值 input, textarea, select, $input, $select, $switch
                      attrs: {
                          type: 'number'
                      }
                  }
              },
          }
      ],
      tableData: [
          {name: '张三', sex: '男', date: '2020-01-01', score: ''},
          {name: '李四', sex: '女', date: '2020-01-01', score: ''},
          {name: '王五', sex: '男', date: '2020-01-01', score: ''},
          {name: '老六', sex: '女', date: '2020-01-01', score: ''},
          {name: '老七', sex: '男', date: '2020-01-01', score: ''}
      ],
      tableEditRules:{
        'score': [
            { required: true, message: '缺少分数' },//required校验
            { type: 'number', message: '分数为数字' },//type校验
            { max:5, message:'请保持两位小数点' },//max校验
            { //自定义检验方法
                validator: (context) => {
                    const val = +context.cellValue
                    if (val <= 0 || val > 100) {
                        return Promise.reject(new Error('分数为0-100的数'))
                    }
                },
            },
        ],
      }
    }
  },
};
var app = new Vue(Main).$mount('#app')

<!-- 引入样式 -->
      <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vxe-table/lib/style.css">
<script src="https://cdn.jsdelivr.net/npm/vue"></script>
<script src="https://cdn.jsdelivr.net/npm/xe-utils"></script>
<script src="https://cdn.jsdelivr.net/npm/vxe-table"></script>
<!-- 使用 cdn 引用方式需要注意是否锁定版本，默认指向最新版本 -->

<div id="app">
  <template>
    <div>
      <vxe-table 
        :data="tableData"
        :edit-config="{
          trigger: 'click',//编辑在点击时触发
          mode: 'row', //编辑模式触发时整行的所有input跟着进入编辑模式
        }"
        :edit-rules="tableEditRules"
        >
        <vxe-column  v-bind="col.props" v-for="col in columns"></vxe-column>
      </vxe-table> 
    </div>
  </template>
</div>