ThorUI的dataTime日期时间选择器

ThorUI的dataTime日期时间选择器,是日期时间选择器picker-view扩展,日期时间选择器。

具体组件代码参考:https://www.bookstack.cn/read/ThorUI-1.42/166755

props:
"type" : 1-日期+时间(年月日+时分) 2-日期(年月日) 3-日期(年月) 4-时间(时分),类型:"Number",默认值:1
"startYear" :年份区间,起始年份,类型:"Number",默认值:1980
"endYear" :年份区间,结束年份,类型:"Number",默认值:2050
"cancelColor":"取消"字体颜色,类型:"String",默认值:"#888"
"color":"确定"字体颜色,类型:"String",默认值:"#5677fc"
"setDateTime":设置默认显示日期 2019-08-01 || 2019-08-01 17:01 || 2019/08/01 ,类型:"String",默认值:""
methods:
"generateArray":生成数组
"getIndex":获取索引
"initSelectValue":初始化日期时间处理
"initData":初始化数据
"setYears":设置年份
"setMonths":设置月份
"setDays":设置日期
"setHours":设置小时
"setMinutes":设置分钟
"show":显示,打开选择器
"hide":隐藏,关闭选择器
"change":picker-view change事件,选择数据
"btnFix":确定事件,传回选择的日期时间

显示效果:

vue使用:

<!-- 选择时间 -->

<input v-if="item.type == 'time'" @click="bindTimeChange(item,index)" v-model="item.default_time" disabled placeholder="请选择时间" class="form-picker input-icon dataTime" />

<!-- 选择时间组件-->

<tui-datetime ref="dateTime" :type="dateTimeType" :radius="true" @confirm="change_time"></tui-datetime>

<!-- 定义 -->

timeIndex:'',
dateTimeType: 2,

<!-- 选择时间调用方法 -->

            bindTimeChange: function(item,index) {
                this.timeIndex = index;
                this.$refs.dateTime.show();
                if(item.time_level == 0){
                    this.dateTimeType = 2 // 年月日
                }else{
                    this.dateTimeType = 7 // 年月日时分秒
                }
            },
            change_time: function(e) {
                this.$set(this.components[this.timeIndex], "default_time", e.result);
            },

          

posted @   蓦然JL  阅读(389)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· Manus的开源复刻OpenManus初探
· AI 智能体引爆开源社区「GitHub 热点速览」
· 从HTTP原因短语缺失研究HTTP/2和HTTP/3的设计差异
· 三行代码完成国际化适配,妙~啊~
  1. 1 唯一 G.E.M.邓紫棋
  2. 2 他只是经过 白敬亭 魏大勋
  3. 3 Uptown Funk Mark Ronson / Bruno Mars
  4. 4 在你的身边 盛哲
  5. 5 Edge of My Life Manafest
  6. 6 凄美地 郭顶
  7. 7 Wonderful Tonight Boyce Avenue
  8. 8 心如止水 Ice Paper
  9. 9 Sugar Maroon 5
  10. 10 静谧时光 JIAxNING
  11. 11 Right Now (Na Na Na) Aamir
  12. 12 Dangerously Charlie Puth
  13. 13 Someone You Loved Madilyn Paige
  14. 14 Shape of My Heart Boyce Avenue
  15. 15 We Can't Stop Boyce Avenue / Bea Miller
  16. 16 Perfect Boyce Avenue
  17. 17 Love Me Like You Do Boyce Avenue
  18. 18 Thank You Boyce Avenue
  19. 19 Don’t Wanna Know Boyce Avenue / Sarah Hyland
他只是经过 - 白敬亭 魏大勋
00:00 / 00:00
An audio error has occurred, player will skip forward in 2 seconds.

Not available

访问主页
关注我
关注微博
私信我
返回顶部
点击右上角即可分享
微信分享提示