当前位置: 首页 > news >正文

前端JS必用工具【js-tool-big-box】学习,获取全球重点城市时间

我们去住一些旅馆的时候,或者一些国际性网站,经常可以看见他们的钟表会展示一些国家地区的时间,这个就是很常用的功能。但如果不常接触这个功能的开发网站呢,大家就看自己电脑右下角的时间展示,就是自己当前的具体时间了。

js-tool-big-box也增加了这个功能,希望有需求的开发者可以通过工具,获取全球一些重点城市的时间展示。

目录

1 安装引入

2 获取重点城市时间展示 

2.1 比较重点的城市

2.2 获取方法

2.3 返回数据展示

2.4 使用方法总结

3 开发者反馈


1 安装引入

执行npm命令

npm i js-tool-big-box

项目中引入timeBox对象,获取全球重点城市的时间方法,位于这个对象内:

import { timeBox } from 'js-tool-big-box';

2 获取重点城市时间展示 

2.1 比较重点的城市

目前入选的重点城市有,北京、雅加达、伦敦、纽约、巴黎、悉尼和东京,我们将通过工具方法,获取当前这7个重点城市的具体时间。为了更迎合需求,我们只展示了时分秒。

2.2 获取方法

timeBox 对象中,我们添加了getWorldTime 这个方法,用来获取详细时间

const worldTime = timeBox.getWorldTime();
console.log('=-==-=', worldTime);

2.3 返回数据展示

 

2.4 使用方法总结

 

方法名返回值入参

getWorldTime

目前7个重点城市的hour min sec值;

如果你需要按时钟效果展示,需要自行将内容嵌套到setInterval定时任务中去

 

3 开发者反馈

希望使用本工具的小伙伴们,如果在工作中,遇到一些公共方法,一些多次使用的,可以及时告诉我,不比在自己项目多次重复开发了。

近期有小伙伴说,获取法定节假日只有2024年的,希望添加往年的,这个思路就挺好的,因为这个工具希望让大家真实觉得方便,那效果就达到了。

希望有一天,大家在前端项目中,更少的去写一些公共方法,更少的去install一些第三方工具库,把更多的时间利用到业务开发中去,那就太好了。

而且我们利用csdn博客来写这个学习文档,也是想借助平台更好的反馈能力,我们一起加油吧!

http://www.lryc.cn/news/354732.html

相关文章:

  • BioTech - 将蛋白质的 PDB 格式文件 转换成 mmCIF 格式文件 (Python)
  • 【编程题-错题集】奇数位丢弃(模拟 - 规律)
  • Docker安装MongoDB(Linux版)
  • 【设计模式】JAVA Design Patterns——Commander(指挥官模式)
  • 解决vue3项目vite打包忽略.vue扩展名
  • Vue基础(数据绑定、export使用)
  • 【传知代码】基于图神经网络的知识追踪方法(论文复现)
  • Vue与React、Angular的比较
  • LINQ(二) —— 流式语句
  • 怎么查看MySQL服务的最大连接,已经使用的连接数?怎么配置最大连接数?
  • 微信小程序毕业设计-跑腿系统项目开发实战(附源码+演示视频+LW)
  • stm32通过esp8266连接阿里云平台代码讲解
  • 突发!某大厂机房掉电,MySQL数据库无法启动,紧急恢复过程...
  • SpringCloudAlibaba:6.2RocketMQ的普通消息的使用
  • vue+echart :点击趋势图中的某一点或是柱状图,出现弹窗,并传输数据
  • 2024年上半年软考什么时候查成绩?附查询流程
  • css3实现0.5px边框
  • U-Net网络
  • 不拍视频,不直播怎么在视频号卖货赚钱?开一个它就好了!
  • 【vue-5】双向数据绑定v-model及修饰符
  • [STM32-HAL库]AS608-指纹识别模块-STM32CUBEMX开发-HAL库开发系列-主控STM32F103C8T6
  • 【java程序设计期末复习】chapter4 类和对象
  • ios:Command PhaseScriptExecution failed with a nonzero exit code
  • 《拯救大学生课设不挂科第四期之蓝桥杯是什么?我是否要参加蓝桥杯?选择何种语言?如何科学备赛?方法思维教程》【官方笔记】
  • 数据挖掘案例-航空公司客户价值分析
  • 决策树与机器学习实战【代码为主】
  • 从感知机到神经网络
  • 【HMGD】STM32/GD32 I2C DMA 主从通信
  • leecode 226 翻转二叉树、101 对称二叉树、104 二叉树的最大深度
  • Redux基础