更新记录

1.0.1（2025-02-20） 下载此版本

1.修复初始化确定无返回值

1.0.0（2025-02-20） 下载此版本

发布初版

平台兼容性

DatePicker 日期时间选择器

组件名: xt-date-picker

适配情况需自行尝试,开发时只测试了H5、APP、微信小程序

安装方式

本组件符合 easycom 规范，HBuilderX 3.1.0 起，只需将本组件导入项目，在页面 template 中即可直接使用，无需在页面中 import 和注册 components

基本用法

<template>
    <view class="xt">
        <button @click="showPicker">选择</button>
        <button @click="log">打印</button>
        <xt-date-picker v-model="xtID" :show.sync='show' mode='date' @change='onchange' @close='close'
            @confirm='confirm' title='时间选择' :maxDate='max' :minDate='min'></xt-date-picker>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                show: false,
                xtID: [2024, 5, 20, 13, 14, 20],
                max: new Date('2026-6-1').getTime(),
                min: new Date('2000-01-01').getTime()
            }
        },
        methods: {
            showPicker() {
                this.show = !this.show;
            },
            log() {
                console.log(this.xtID);
            },
            onchange(e) {
                console.log(e)
            },
            close() {
                console.log('关闭')
            },
            confirm(e) {
                console.log(e)
            }
        }
    }
</script>

<style lang="scss">
    .xt {
        padding: 0 20rpx;
        display: flex;
        flex-direction: column;
        gap: 15rpx;
    }
</style>

API

mode有效值

Events