word网站链接怎么做,室内装修设计公司排名,网站直播间怎么做,新网域名注册此选择器用于时间日期
#平台差异说明
App#xff08;vue#xff09;App#xff08;nvue#xff09;H5小程序√√√√
#基本使用
通过show绑定一个布尔值变量#xff0c;用于控制组件的弹出与收起。通过mode配置选择何种日期格式。
templateviewu…此选择器用于时间日期
#平台差异说明
AppvueAppnvueH5小程序√√√√
#基本使用
通过show绑定一个布尔值变量用于控制组件的弹出与收起。通过mode配置选择何种日期格式。
templateviewu-datetime-picker:showshowv-modelvalue1modedatetime/u-datetime-pickeru-button clickshow true打开/u-button/view
/templatescriptexport default {data() {return {show: false,value1: Number(new Date()),}}}
/scriptcopy
#年 月 日
此模式通过mode设置为date。
templateviewu-datetime-picker:showshowv-modelvalue1modedate/u-datetime-pickeru-button clickshow true打开/u-button/view
/templatescriptexport default {data() {return {show: false,value1: Number(new Date()),}}}
/scriptcopy
#格式化
如有需要可以通过formatter参数编写自定义格式化规则。
注意
微信小程序不支持通过props传递函数参数所以组件内部暴露了一个setFormatter方法用于设置格式化方法注意在页面的onReady生命周期获取ref再操作。
templateviewu-datetime-pickerrefdatetimePicker:showshowv-modelvalue1modedatetime:formatterformatter/u-datetime-pickeru-button clickshow true打开/u-button/view
/templatescriptexport default {data() {return {show: false,value1: Number(new Date()),}},onReady() {// 微信小程序需要用此写法this.$refs.datetimePicker.setFormatter(this.formatter)},methods: {formatter(type, value) {if (type year) {return ${value}年}if (type month) {return ${value}月}if (type day) {return ${value}日}return value},},}
/scriptcopy
#限制最大最小值
参数minDate和maxDate可以设置最大值和最小值传入时间戳。
templateviewu-datetime-picker:showshowv-modelvalue1:minDate1587524800000:maxDate1786778555000modedatetime/u-datetime-pickeru-button clickshow true打开/u-button/view
/templatescriptexport default {data() {return {show: false,value1: Number(new Date()),}}}
/script