ThorUI的dataTime日期时间选择器

2022-06-16 15:37:32 阅读：226 来源： 互联网

标签：01 年份 dataTime 日期 ThorUI 年月日默认值选择器

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);
            },

标签：01,年份,dataTime,日期,ThorUI,年月日,默认值,选择器
来源： https://www.cnblogs.com/moranjl/p/16382110.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

ThorUI的dataTime日期时间选择器