popup-calendar 日历弹窗

更新时间：2022-02-16

iov-calendar

日期选择组件

属性说明：

属性名	类型	默认值	必填	说明
class-name	String	无	否	自定义class
defaultDate	String	无	否	选择值的类型，如果是区间选择的话为Array[String]
rangePrompt	String	无	否	区间选择是，超过设置的最大区间值的toast提示
maxRange	Number	无	否	当日期为区间时，最大选择数，超出将会toast提示
type	String	single	否	时间选择类型single为单选，range 为区间选择
minDate	String	无	否	时间的可选择最小值
maxDate	String	无	否	时间的可选择最大值
startText	String	无	否	区间选择时，选择开始值的标注
endText	String	无	否	区间选择时，选择结束值的标注
select	Function	无	否	选择的值发生变化时出发

二、示例：

json:

{
    "navigationBarTitleText": "智能小程序官方组件",
    "usingComponents": {
        "iov-calendar": "iov-ui/lib/calendar"
    }
}

swan:

<view class="test">
    <iov-calendar
        class="calendar"
        range="{{range}}"
        value="{{value}}"
        minDate="2020-11-15"
        maxDate="2020-12-31"
        defaultDate="2020-11-28"
        type="single"
        bindselect="select"
    ></iov-calendar>
    <iov-calendar
        maxRange="{{7}}"
        rangePrompt="超过最大天数"
        class="calendar"
        defaultDate="{{['2021-01-05', '2021-01-06']}}"
        minDate="2020-12-21"
        maxDate="2021-12-31"
        startText="入住"
        endText="离店"
        type="range"
        bindselect="rangeChange"
    ></iov-calendar>
</view>

js:

Page({
    data: {
    },
    select(e) {
        const date = e.detail;
        const str = date.getFullYear() + '-' + (date.getMonth() + 1) + '-' + (date.getDate());
        console.log(str);
    },
    rangeChange(e) {
        console.log(e);
    }
})

modal 浮窗 radio 单项选择器