热门标签 | HotTags
当前位置:  开发笔记 > 运维 > 正文

uniapp实现横向滚动选择日期

这篇文章主要为大家详细介绍了uniapp实现横向滚动选择日期,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

本文实例为大家分享了uniapp实现横向滚动选择日期的具体代码,供大家参考,具体内容如下

1.方法封装 common.js

//获取当前时间,格式YYYY-MM-DD HH:MM:SS
const GetNowTime = time => {
 var date = time,
 year = date.getFullYear(),
 mOnth= date.getMonth() + 1,
 day = date.getDate(),
 hour = date.getHours() <10 &#63; "0" + date.getHours() : date.getHours(),
 minute = date.getMinutes() <10 &#63; "0" + date.getMinutes() : date.getMinutes(),
 secOnd= date.getSeconds() <10 &#63; "0" + date.getSeconds() : date.getSeconds();
 month >= 1 && month <= 9 &#63; (mOnth= "0" + month) : "";
 day >= 0 && day <= 9 &#63; (day = "0" + day) : "";
 // var timer = year + '-' + month + '-' + day + ' ' + hour + ':' + minute + ':' + second;
 var timer = year + '-' + month + '-' + day;
 return timer;
}

// 格式化电话号码
const GetPhOne= phOne=> {
 let tel = phone.slice(0, 3) + '****' + phone.slice(7, 11);
 return tel;
}
//返回日期和周几数组
function weekDate() {
 var myDate = new Date();
 myDate.toLocaleDateString();
 var mOnth= myDate.getMonth() + 1;
 var time = myDate.getFullYear() + '年' + month + '月' + myDate.getDate() + '日';
 var total = 1; // 个数
 var dayList = [];
 dayList.push({
 'day': myDate.getDate(),
 'month': myDate.getMonth() + total,
 'week': toWeekDay(myDate.getDay()),
 'year': myDate.getFullYear()
 });
 for (var i = 0; i <10; i++) {
 myDate.setDate(myDate.getDate() + total); // number 是最近几天 则会自动计算
 // 需求 月份-日 星期几  
 dayList.push({
 'day': myDate.getDate(),
 'month': myDate.getMonth() + total,
 'week': toWeekDay(myDate.getDay()),
 'year': myDate.getFullYear()
 })
 }
 // return dayList;
 let length = dayList.length
 let arrOne= dayList[0]
 let arrLast = dayList[length - 1]
 let StartDate = arrOne.year.toString() + '-' + arrOne.month + '-' + arrOne.day
 let EndDate = arrLast.year.toString() + '-' + arrLast.month + '-' + arrLast.day
 return {
 dayList,
 StartDate,
 EndDate
 }
}

function toWeekDay(weekDay) { // 传入数据 讲一周的某一天返回成中文状态下的字符
 switch (weekDay) {
 case 1:
 return '一';
 break;
 case 2:
 return '二';
 break;
 case 3:
 return '三';
 break;
 case 4:
 return '四';
 break;
 case 5:
 return '五';
 break;
 case 6:
 return '六';
 break;
 case 0:
 return '日';
 break;
 default:
 break;
 }
 return '传入未知参数';
}
module.exports = {
 GetNowTime,
 GetPhone,
 weekDate
}

2.组件.vue





效果图

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。


推荐阅读
  • 本文介绍如何通过SSH协议使用Xshell远程连接到Ubuntu系统。为了实现这一目标,需要确保Ubuntu系统已安装并配置好SSH服务器,并保证网络连通性。 ... [详细]
  • 深入解析 Spring Security 用户认证机制
    本文将详细介绍 Spring Security 中用户登录认证的核心流程,重点分析 AbstractAuthenticationProcessingFilter 和 AuthenticationManager 的工作原理。通过理解这些组件的实现,读者可以更好地掌握 Spring Security 的认证机制。 ... [详细]
  • 本文将详细介绍如何在没有显示器的情况下,使用Raspberry Pi Imager为树莓派4B安装操作系统,并进行基本配置,包括设置SSH、WiFi连接以及更新软件源。 ... [详细]
  • 本文探讨了如何通过一系列技术手段提升Spring Boot项目的并发处理能力,解决生产环境中因慢请求导致的系统性能下降问题。 ... [详细]
  • 本文详细介绍如何通过设置SSH密钥来获取连接GitHub远程仓库的权限,包括生成密钥、添加到GitHub账户以及验证连接等步骤。 ... [详细]
  • 本文介绍如何配置SecureCRT以正确显示Linux终端的颜色,并解决中文显示问题。通过简单的步骤设置,可以显著提升使用体验。 ... [详细]
  • 最新计算机专业原创毕业设计参考选题都有源码+数据库是近期作品ling取参考你的选题刚好在下面有,有时间看到机会给您发1ssm资源循环利用2springboot校园考勤系统3ssm防 ... [详细]
  • CentOS 7.2 配置防火墙端口开放
    本文介绍如何在 CentOS 7.2 系统上配置防火墙以开放特定的服务端口,包括 FTP 服务的临时与永久开放方法,以及如何验证配置是否生效。 ... [详细]
  • 本指南详细介绍了如何在同一台计算机上配置多个GitHub账户,并使用不同的SSH密钥进行身份验证,确保每个账户的安全性和独立性。 ... [详细]
  • WinSCP: 跨Windows与Linux系统的高效文件传输解决方案
    本文详细介绍了一款名为WinSCP的开源图形化SFTP客户端,该工具支持SSH协议,适用于Windows操作系统,能够实现与Linux系统之间的文件传输。对于从事嵌入式开发的技术人员来说,掌握WinSCP的使用方法将极大提高工作效率。 ... [详细]
  • 利用SSH隧道实现外网对局域网机器的安全访问
    本文探讨了一种常见的网络配置问题及其解决方案,即如何在外网环境下安全地访问位于局域网内的计算机。特别介绍了使用SSH反向隧道技术来实现这一目标的具体步骤和注意事项。 ... [详细]
  • 在Linux系统上构建Web服务器的详细步骤
    本文详细介绍了如何在Linux系统上搭建Web服务器的过程,包括安装Apache、PHP和MySQL等关键组件,以及遇到的一些常见问题及其解决方案。 ... [详细]
  • 本文详细介绍了如何通过Git Bash在本地仓库与远程仓库之间建立连接并进行同步操作,包括克隆仓库、提交更改和推送更新等步骤。 ... [详细]
  • Windows 环境下安装 Git 并连接 GitHub 的详细步骤
    本文详细介绍了如何在 Windows 系统中安装 Git 工具,并通过配置 SSH 密钥实现与 GitHub 的安全连接。包括下载、安装、环境配置及验证连接等关键步骤。 ... [详细]
  • Redis安全防护深入解析
    本文详细探讨了如何通过指令安全、端口管理和SSL代理等措施有效保护Redis服务的安全性。 ... [详细]
author-avatar
手机用户2602927805
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有