elementUI日期组件弹出错位
方法1.使用v-if的地方改为v-show,如果解决不了可以改为方法二
方法2.可以使用key:给每一个 el-date-picker 标签 添加一个 key 值
<template>
<div>
<el-date-picker
v-model="value1"
:type="typelist"
key="1"
placeholder="选择日期时间"
/>
<el-date-picker
v-model="value2"
:type="typelist"
key="2"
placeholder="选择日期时间"
/>
<el-select v-model="typelist" placeholder="请选择" @change="change">
<el-option
v-for="(item, index) in options"
:key="index"
:label="item.lable"
:value="item.value"
>
</el-option>
</el-select>
</div>
</template>
<script>
export default {
data() {
return {
value1: '',
value2: '',
typelist: 'datetime',
options: [
{
lable: '年',
value: 'year'
},
{
lable: '月',
value: 'month'
},
{
lable: '日',
value: 'date'
},
{
lable: '秒',
value: 'datetime'
}
]
}
},
methods: {
change() {
this.value1 = ''
this.value2 = ''
}
}
}
</script>
效果图