更新记录

1.0.8(2024-08-19) 下载此版本

修复箭头选择日期问题。

1.0.7(2024-08-15) 下载此版本

修复问题。

1.0.7-beta(2024-08-15) 下载此版本

调试版本。

查看更多

平台兼容性

Vue2 Vue3
×
App 快应用 微信小程序 支付宝小程序 百度小程序 字节小程序 QQ小程序
HBuilderX 3.1.0 × × × × ×
钉钉小程序 快手小程序 飞书小程序 京东小程序
× × × ×
H5-Safari Android Browser 微信浏览器(Android) QQ浏览器(Android) Chrome IE Edge Firefox PC-Safari

方便您的同时,请五星、收藏,让好的东西照亮更多深渊中负重前行的代码人。

创作不易,在您方便之际,赞赏作者,我们会更有动力继续下去。

简介

ljs-datetype-choose,日期选择组合组件。

使用 uni_modules 安装(推荐)

使用 uni_modules 方式安装组件库,可以直接通过插件市场导入,通过右键菜单快速更新组件,不需要引用、注册,直接在页面中使用 ljs-datetype-choose组件。

主参数

参数 类型 必填项 默认值 说明
d String 日期
dtype String × 1 日期类型。datetypeDataShow为true时,默认1为日,2为月,3为年,也可通过datetypeDataValues重新定义。
datetypeDataShow Boolean true 日期类型开关。默认开启类型筛选,datetypeData为必填项。
datetypeData Array × 日期类型数据,datetypeData为true时必填。
datetypeDataValues Array × ['1', '2', '3'] 日期类型数据,对照表。日、月、年
datePickerEnd String × 当前时间 禁用日期。默认不禁用,如果存在一个日期,则从该日期开始禁用。
styleOpts Object × 当前时间 禁用日期。默认不禁用,如果存在一个日期,则从该日期开始禁用。

styleOpts参数

参数 类型 必填项 默认值 说明
jtLeft String × 箭头 - 左
jtRight String × 箭头 - 右
jtX String × 箭头 - 下
datetypeBgColor String × #f3f3f3 日期类型背景色
datetypeFontColor String × # 日期类型字体色
dateFontColor String × #0 日期字体颜色

事件

事件名 说明
change 返回datetype, date。

快速应用

示例1
<ljs-datetype-choose
    :datetypeData="user_statistics_time"
  :dtype.sync="datetype"
  :d.sync="date"
    :datetypeDataValues="['0' ,'1', '2']"
    datePickerEnd="2024-08-13"
    @change="datetypeChange"
    >
</ljs-datetype-choose>
export default {
    data() {
        return {
            user_statistics_time: [],
            datetype: '0',
            date: '2024-08-13',
        }
    },
    onLoad() {
        this.user_statistics_time = [{"searchValue":null,"createBy":"admin","createTime":"2022-09-14 08:34:52","updateBy":null,"updateTime":null,"remark":null,"params":{"@type":"java.util.HashMap"},"dictCode":102,"dictSort":0,"dictLabel":"年","dictValue":"2","dictType":"user_statistics_time","cssClass":null,"listClass":"default","isDefault":"N","status":"0","default":false},{"searchValue":null,"createBy":"admin","createTime":"2022-09-14 08:34:39","updateBy":null,"updateTime":null,"remark":null,"params":{"@type":"java.util.HashMap"},"dictCode":101,"dictSort":2,"dictLabel":"月","dictValue":"1","dictType":"user_statistics_time","cssClass":null,"listClass":"default","isDefault":"N","status":"0","default":false},{"searchValue":null,"createBy":"admin","createTime":"2022-09-14 08:34:31","updateBy":null,"updateTime":null,"remark":null,"params":{"@type":"java.util.HashMap"},"dictCode":100,"dictSort":3,"dictLabel":"日","dictValue":"0","dictType":"user_statistics_time","cssClass":null,"listClass":"default","isDefault":"N","status":"0","default":false}];
    },
    methods: {
        datetypeChange(datetype, date) {
            // console.log(datetype, date);
        },
    }
}

示例1

示例2
<ljs-datetype-choose
  :d.sync="date"
  :dtype.sync="datetype"
    :datetypeDataShow="false"
    @change="datetypeChange"
    >
</ljs-datetype-choose>
export default {
    data() {
        return {
            datetype: '0',
            date: '2024-08-13',
        }
    },
    methods: {
        datetypeChange(datetype, date) {
            // console.log(datetype, date);
        },
    }
}

示例2

贡献代码

龙九山。有任何问题,请在平台留言,在手头宽裕得情况下,我会尽快修复问题。

隐私、权限声明

1. 本插件需要申请的系统权限列表:

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

插件不采集任何数据

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

许可协议

MIT协议

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问