效果：
html:
<body>
<div id="vue_container">
<el-form :model="popup_Win" ref="popup_Win">
<el-table
:data="popup_Win.tableData"
style="width: 100%">
<el-table-column
prop="date"
label="日期"
width="180">
</el-table-column>
<el-table-column
prop="name"
label="姓名"
width="180">
</el-table-column>
<el-table-column
prop="address"
label="地址">
</el-table-column>
<el-table-column
width="280"
prop="num"
label="计算器">
<template slot-scope="scope">
<el-form-item :prop="'tableData.' + scope.$index +
'.num'" :rules="rules.num"
style="margin-bottom: 0;"
:inline-message="true">
<el-input-number v-model="scope.row.num"
:min="0" :max="scope.row.num" label=""
οninput="value=value.replace(/[^\d]/g,'')">
</el-input-number>
</el-form-item>
</template>
</el-table-column>
<el-table-column
prop="count"
label="数量">
<template slot-scope="scope">
<!-- {{scope.row}} -->
<!-- <el-input v-model="scope.row.num"></el-input> -->
<el-form-item :prop="'tableData.' + scope.$index +
'.count'" :rules="rules.count"
style="margin-bottom: 0;"
:inline-message="true">
<el-input v-model="scope.row.count"></el-input>
</el-form-item>
</template>
</el-table-column>
</el-table>
</el-form>
<div class="buttonbox">
<el-button type="primary" @click="confirm()">确定</el-button>
</div>
</div>
</body>
js：
var VueContainer = null;
$(function () {
VueContainer = new Vue({
el: "#vue_container",
data() {
return {
popup_Win: {
tableData: [{
date: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄',
num: 20,
count: ''
}, {
date: '2016-05-04',
name: '王小虎',
address: '上海市普陀区金沙江路 1517 弄',
num: 0,
count: ''
}, {
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1519 弄',
num: 0,
count: ''
}, {
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1516 弄',
num: 0,
count: ''
}]
},
rules: { // 验证规则
num: [
{
required: true,
message: '请输入',
trigger: 'change'
}
],
count: [
{
required: true,
message: '请输入',
trigger: 'blur'
}
]
}
}
},
methods: {
// 确定按钮
confirm() {
var this_ = this;
this_.$refs['popup_Win'].validate((valid) => {
if (valid) {
} else {
console.log('error submit!!');
return false;
}
});
}
},
})
})
标签：count,el,必填,王小虎,普陀区,num,table,2016,05 From： https://www.cnblogs.com/j-a-h/p/16881101.html