elementuiform校验

155 阅读1分钟
https://merchant-doc.vova.com.hk/#/
wish:https://sandbox.merchant.wish.com/documentation/api
https://www.jianshu.com/p/65cb345d3fe6
https://www.cnblogs.com/helena000/p/11418445.html

image.png image.png

    <template>
        <div>
            <el-form :model="forms" ref="forms" :rules="rules">
                <el-table :data="forms.voList">
                    <el-table-column label="价格">
                        <template slot-scope="scope">
                            <el-form-item :prop="'voList.'+scope.$index+'.unitPrice'" :rules="rules.unitPrice">
                                <el-input v-model="scope.row.unitPrice"></el-input>
                            </el-form-item>
                        </template>
                    </el-table-column>
                    <el-table-column label="数量">
                        <template slot-scope="scope">
                            <el-form-item :prop="'voList.'+scope.$index+'.num'" :rules="rules.unitPrice">
                                <el-input v-model="scope.row.num"></el-input>
                            </el-form-item>
                        </template>
                    </el-table-column>
                </el-table>
            </el-form>
            <el-button type="primary" @click="save">批量开票</el-button>
        </div>
    </template>

    <script>
        export default {
            data() {
                return {
                    forms: {
                        voList: [
                            {
                                num: 1,
                                unitPrice: 291.37
                            }
                        ]
                    },
                    rules: {
                        num: [{required: true, message: '数量不能为空', trigger: 'blur'}],
                        unitPrice: [{required: true, message: '单价不能为空', trigger: 'blur'}]
                    }
                }
            },
            methods: {
                save() {
                    this.$refs['forms'].validate((valid) => {
                        if (valid) {
                            console.log(1)
                        }
                    })
                }
            }
        }
    </script>