码迷,mamicode.com
首页 > 其他好文 > 详细

表格行input校验

时间:2020-02-11 16:11:17      阅读:61      评论:0      收藏:0      [点我收藏+]

标签:item   解决方法   输入   NPU   count   data   dex   解决   ble   

最近改需求,碰到个表格行内input需要校验的。

解决方法:

1、先用el-form将表格包裹起来

2、 表格有个 scope.$index 可以使用

具体代码如下:

 1 <el-form :model="tableForm">
 2      <el-table:data="tableForm.tableData">
 5 
 6            <el-table-column prop="Count" label="数量" >
 8               <template slot-scope="scope">
 9                 <el-form-item :prop="‘tableData.‘ + scope.$index + ‘.count‘"
10                               :rules="[{required: true, message: ‘请输入数量*‘, trigger: ‘blur‘}]">
11                   <el-input
12                     size="small"
13                     v-model="scope.row.count"
14                     placeholder="请输入配送数量"
15                   ></el-input>
16                 </el-form-item>
17               </template>
18             </el-table-column>
19 </el-form>

data(){
  return {
  tableForm: {
     tableData: [],
        },
}
}

 

表格行input校验

标签:item   解决方法   输入   NPU   count   data   dex   解决   ble   

原文地址:https://www.cnblogs.com/0520euv/p/12295232.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!