現(xiàn)在要做的是一個導(dǎo)出的功能,點擊導(dǎo)出會出現(xiàn)一個彈窗,然后面有三項必填項:

1. 數(shù)據(jù)來源
2. 處理狀態(tài)
3. 時間范圍

用的框架是vue+ElementUI
前面的2項的驗證是正確的,可以進行驗證.但是時間范圍我選擇上之后還是提示我請選擇時間.
下面是我的代碼:

            <el-dialog
            title="導(dǎo)出參數(shù)設(shè)置"
            :visible.sync="dialogVisible"
            width="30%">
                <el-form ref="modelExport" :model="modelExport" :rules="rules" >
                    <el-row>
                        <el-col>
                            <el-form-item label="數(shù)據(jù)來源 : " prop="dealer" label-width="108px">
                            <el-select v-model="modelExport.dealer" placeholder="請選擇">
                                <el-option                    
                                v-for="item in options"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value">
                                </el-option>
                            </el-select>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col>
                            <el-form-item label="處理狀態(tài) : " prop="processingStatus" label-width="108px">
                                <el-select v-model="modelExport.processingStatus" placeholder="請選擇">
                                    <el-option
                                    v-for="item in optionStatus"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value">
                                    </el-option>
                                </el-select>
                            </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col>
                        <el-form-item label="時間范圍 : " prop="dataTime" label-width="108px">    
                            <el-date-picker
                            placeholder="選擇日期范圍"
                            type="daterange"
                            format="yyyy-MM-dd"
                            v-model="modelExport.dataTime"
                            range-separator="至"
                            start-placeholder="開始日期"
                            end-placeholder="結(jié)束日期">
                            </el-date-picker>
                        </el-form-item>
                    </el-col>
                </el-row>
                </el-form>
            <span slot="footer" class="dialog-footer">
                <el-button type="primary" @click="problem_export('modelExport')">導(dǎo) 出</el-button>
                <el-button @click="cancel_problem_export('modelExport')">取 消</el-button>                
            </span>
            </el-dialog>

以下是我的data里面的數(shù)據(jù):

            modelExport: {
                //導(dǎo)出表單
                dealer: "", //處理人
                processingStatus: "", //處理狀態(tài)
                dataTime: "" //數(shù)據(jù)范圍
            },

以下是我的驗證:

            rules: {
                dealer: [
                    { required: true, message: "請選擇處理人", trigger: "blur"}
                ],
                processingStatus: [
                    { required: true, message: "請選擇處理狀態(tài)", trigger: "blur"}
                ],
                dataTime:[
                    { required: true, message: '請選擇時間范圍', trigger: 'change' }
                ]
            }