element-ui的时间选择器的小坑

需要的做一个日期选择框在已有页面上

• 第一个问题:页面上已经存在了很多层级，但是我们需要显示在最上面，需要加一个类名把层级设置为最大，这个时候的需要用的属性“popper-class”。由于之前很多属性类似于“key”这种，都是需要v-bind:或“:”的所以，最后找了一会发现，这个属性直接就可以，不需要v-bind:或者“:”。直接使用即可。
• 第二个问题就是，上面弹出框的图标的关闭事件。因为采用的弹出框。所以需要用到的是@close方法来做关闭事件。所以部分代码如下：
• html代码：

<el-dialog :title="表格" :visible.sync="holidayFormVisible" width="40%" center custom-class="resonDialog" @close="cancelholiday">
			<el-form :model="form" ref="form" label-width="100px">
				<el-form-item label="管控日期">
					<el-date-picker type="dates" v-model="form.value14" popper-class="hx-h11" format="yyyy-MM-dd" value-format="yyyy-MM-dd" placeholder="选择假期">
					</el-date-picker>
				</el-form-item>
			</el-form>
			<div slot="footer" class="dialog-footer">
				<el-button @click="cancelholiday">{{$t('common.cancel')}}</el-button>
				<el-button type="primary" @click="holidayConfirm('form')">{{$t('common.confirm')}}</el-button>
			</div>
		</el-dialog>

css代码：

.hx-h11 {
    z-index: 9999 !important;
    top: 188px !important;
}

js代码：

holidayFormVisible: false,

//关闭方法
cancelholiday: function() {
            this.holidayFormVisible = false;
            this.form = {
                value14: []
            };
        },