Element UI

el-select

el-select 通过 v-model 绑定的值，在设置默认值的情况下，el-select 中显示的是 key 而不是 value：

需要检查 v-model 绑定的值的类型，与 key 的类型是否一致：1 和 '1' 是不相等的

el-form

rules

表单需要根据 v-for 进行动态渲染的结构时，声明的 rules 不生效：

<el-form :model="domains" label-position="left" ref="new_form" label-width="110px">
    <div v-for="(domain, index) in domains">
        <el-row class="hidden-sm-and-down" :gutter="30">
            <el-col :md="12" :xs="24">
                <el-form-item label="节点名称" :prop="'domains.' + index + '.name'" :rules="[
                                    { required: true, message: '请输入名称', trigger: 'blur' },
                                ]">
                    <el-input v-model="domain.name"></el-input>
                </el-form-item>
            </el-col>
        </el-row>
    </div>
</el-form>

重点位置：

动态渲染表单：
v-for="(domain, index) in domains"

动态生成 prop：
:prop="'domains.' + index + '.name'"

el-form 必须指定成一个 object，这里直接使用的是 array，导致动态生成 prop 时出现：

please transfer a valid prop path to form item!

处理方式：

将数组封装为一个对象的属性，封装完成后，v-model 绑定到封装后的对象，后面对所有的 domains 操作时，都需要通过 this.dynamic_domains.domains

dynamic_domains: {
    domains: [],
},

el-date-picker

时区

选择日期后，提交后端处理时，后端接收到的日期与实际预设日期相差 8 小时

el-date-picker 中设置的是 2020-08-31，后端接收到的值为：
2020-08-30T16:00:00.000Z

使用 value-format="yyyy-MM-dd" 指定日期格式