<el-form
label-width="100px"
:model="ruleForm"
:rules="rules"
ref="ruleForm"
class="demo-ruleForm"
>
<el-form-item label="活动时间" required>
<el-col :span="11">
<el-form-item prop="date1">
<el-date-picker
type="date"
placeholder="选择日期"
v-model="ruleForm.date1"
style="width: 100%;"
></el-date-picker>
</el-form-item>
</el-col>
<el-col class="line" :span="2">-</el-col>
<el-col :span="11">
<el-form-item prop="date2">
<el-date-picker
type="date"
placeholder="选择日期"
v-model="ruleForm.date2"
style="width: 100%;"
></el-date-picker>
</el-form-item>
</el-col>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="submitForm('ruleForm')">立即创建</el-button>
<el-button @click="resetForm('ruleForm')">重置</el-button>
</el-form-item>
</el-form>
ruleForm: {
date1: "",
date2: "",
},
rules: {
date1: [
{
type: "date",
required: true,
message: "请选择日期",
trigger: "change",
},
],
date2: [
{
type: "date",
required: true,
message: "请选择日期",
trigger: "change",
},
],
},
submitForm(fromRef) {
this.$refs[fromRef].validate((booleanIfSelect) => {
console.log(booleanIfSelect);
});
},
resetForm(fromRef) {
this.$refs[fromRef].resetFields();
},