Vue | Element:请教 el-form 的 :model 属性的作用

Question

<template>
    <div>
        <el-form :model="form" :rules="form" label-width="80px">
            <el-form-item label="姓名">
                <el-input v-model="form.name"></el-input>
            </el-form-item>
        </el-form>
    </div>
</template>

<script>
    export default {
        name: 'Father',
        data () {
            return {
                form: {
                    name: 'Tim' 
                }
            }
        }
    }
</script>

el-form 设置了 :model、:rules 两个属性，:rules 似乎是后续表单校验时需要使用，那 :model 属性的作用是什么呢？

官方文档将 el-form 的 model 属性描述为"表单数据对象"，但如果不配置该属性，仅通过 v-model="form.name" 为表单域设置值已经可以实现数据绑定，为什么还要为 el-form 配置 model 这个属性呢？

---------------------------------- 分割线 -----------------------------------------------

<template>
    <div>
        <el-form :rules="rules" label-width="80px">
            <el-form-item label="姓名" prop="name">
                <el-input v-model="form.name"></el-input>
            </el-form-item>
        </el-form>
    </div>
</template>

<script>
    export default {
        name: 'App',
        data () {
            return {
                form: {
                    name: 'Tim' 
                },
                rules: {
                    name: [{ required: true, message: '姓名不能为空', trigger: 'blur' }]
                }
            }
        }
    }
</script>

Answer 1

与数据绑定无关,rules验证是对model对象的验证，跟你在form中绑定了哪些数据无关