问题:mint-ui中的时间选择器组件,高度过高,想对其样式进行调整
1.mint-ui中的时间选择器组件,高度过高,有7行日期,见下图:
有时会不符合ui要求。想把它改低一点,只显示5行日期。
第一个思路是吧父元素高度变少,研究了一下发现直接操作类名不管用,还会导致正中间一行的位置向下偏移。
于是去官方文档找,希望能找到调整行数的api:
官网参考链接:http://mint-ui.github.io/docs/#/zh-cn2/datetime-picker
然后啥也没找到!
2.想了想Date Picker是不是可以借鉴picker组件的api,于是找到了方法:
官网参考链接:http://mint-ui.github.io/docs/#/zh-cn2/picker
3.于是在Date Picker中使用这个api尝试一下,就成功了~~~
放下代码供参考~
:visibleItemCount="5" 或者 :visible-item-count="5" ,两种写法都可以成功,用一个就行
<mt-datetime-picker
:startDate="开始日期"
:endDate="结束日期"
v-model="当前日期"
:visibleItemCount="5"
:visible-item-count="5"
type="date"
ref="startPicker"
year-format="{value} 年"
month-format="{value} 月"
date-format="{value} 日">
</mt-datetime-picker>