HTML
<el-form ref='from' :model="fromData">
<el-table ref="tableman"
border
v-loading='loading'
empty-text="没有相关数据"
max-height="400"
size="mini"
:data="fromData.domains"
align="left"
highlight-current-row
@selection-change="MaterilsChange"
:showOverflowTooltip="true"
style="min-width: 100%;min-height:100px;">
<el-table-column type="selection"
align="center"
width="55">
</el-table-column>
<el-table-column v-for="(item,index) in Materilscolumn"
:key="index"
:label="item.label"
align="center"
:prop="item.prop"
:min-width="item.minWidth">
</el-table-column>
<!--输入数量栏-->
<el-table-column label="数量"
align="center"
:min-width="90">
<template slot-scope="scope">
<el-form-item :prop="'domains.'+scope.$index+'.num'" :rules="fromaDataRules.num">
<el-input v-model="scope.row.num" @change='inputchange(scope.row,scope.$index)'></el-input>
</el-form-item>
</template>
</el-table-column>
</el-table>
<!-- 底部操作栏 -->
</el-form>
script
<script>
export default {
data() {
return {
dialogFormVisible:false,
fromData:{
domains:undefined
},
fromaDataRules:{
name:[{ required: true, message: '请输入活动名称', trigger: 'blur' },{validator:(rule, value, callback) =>{
let reg = /^[0-9]*$/
console.log(value)
if(!reg.test(value)){
callback(new Error('数量应为数字'));
}else if(value==0){
callback(new Error('数量应大于0'));
}else{
callback()
}
},trigger: 'blur'},],
desc:[ { required: true, message: '请填写活动形式', trigger: 'blur' }]
},
domains:[],
}
},
mounted(){
this.initDomains()
},
methods:{
initDomains(){
this.domains=[
{
name: undefined,
desc: undefined
},
{
name:undefined,
desc:undefined
}
]
},
init(){
this.dialogFormVisible = true
this.$set(this.fromData,'domains',this.domains)
},
submit(formName){
this.$refs[formName].validate((valid) => {
if (valid) {
alert('submit!');
} else {
console.log('error submit!!');
return false;
}
});
}
}
}
</script>
https://blog.csdn.net/xiaojun081004/article/details/82988549