需求 web 跟 移动端显示弹窗的宽度不一样
<el-date-picker
:popper-class="popperClass"
v-model="dataRange" type="daterange" range-separator="至" start-placeholder="Startdate"
end-placeholder="Enddate" />
computed:{
popperClass() {
return this.isMobile ? 'el-dat-range-picker-mobile' : 'el-dat-range-picker';
},
}
<style scoped>
.el-dat-range-picker-mobile {
width: 100%;
}
.el-dat-range-picker {
/* width: 50%; */
}
</style>
popperClass 的值是String类型 所以通过computed 计算返回不同的样式名称。