- 2024-07-29React实现过渡效果更新时间展示
创建一个组件,实时展示时分秒,并且动态更新数据。数据变化时利用过渡效果动态更新。利用两个元素,重叠在一个位置,以达到交替变化的效果//创建秒显示节点<divclassName="textsecond"> <CSSTransition in="{renderSecond}" timeout="{1000}" classNames="fade" unmo
- 2024-06-15Day.js日期时间的常计算
Day.js日期时间的常计算1、介绍Day.js:Day.js是一个极简的JavaScript库,可以为现代浏览器解析、验证、操作和显示日期和时间。主要为操作时间日期的库。2、场景使用计算周几、当月第一天计算xx天前/后的日期将时间戳转换为日期(YYYY-MM-DD)计算月天数获取两个日期的时间差3、使用例
- 2024-05-07dayjs 根据选择的日期获取当前周的周一到周天
//设置表头日期constsetHeadDate=(val:any)=>{constnowDay=dayjs(val).day()//这周的第一天letstr:any=nullif(nowDay){//非周天,即当周str=dayjs(val).startOf('week').add(1,'day')}else{//周天,先减去一天,当作是上周的,然后
- 2024-04-17vue dayjs 安装指定版本
在Vue项目中安装指定版本的Day.js库,你可以使用npm或者yarn。以下是安装指定版本Day.js的步骤:打开终端(命令行)。转到你的Vue项目目录。执行以下命令,其中x.x.x替换为你想要安装的Day.js版本号。使用npm安装指定版本的Day.js:
[email protected] 或者使用
- 2024-04-08Vite+Vue3.0项目使用ant-design-vue <a-calendar>日期组件汉化
antd的弹框、日期等默认为英文,要把英文转为中文请看下文:1.首先我们要在main.js中引入ant-design组件库并全局挂载:importAppfrom'./App'importAntdfrom'ant-design-vue';import'ant-design-vue/dist/antd.css';constapp=createApp(App);app.use(Antd);2.然
- 2024-04-08技术栈20240403
后端技术栈主框架:SpringBoot+SpringFramework持久层架:MyBatis-Plus数据库连接池:AlibabaDruid多数据源:Dynamic-Datasource数据库兼容:MySQL、SQLServer、Oracle、PostgreSQL、达梦数据库、人大金仓数据库分库分表解决方案:ApacheShardingSphere权
- 2024-03-29JS日期时间处理库 Day.js
GitHubhttps://github.com/iamkun/dayjs文档https://dayjs.gitee.io/zh-CN/下载https://cdn.jsdelivr.net/npm/
[email protected]/dayjs.min.js主要用法字符串转日期时间对象letdatetime1=dayjs('2024-03-2916:52:30.356','YYYY-MM-DDHH:mm:ss.SSS');//返回结果是day
- 2024-02-29Vue 2x 系列之(十五)过滤器
过滤器BootCDN:包含了一些免费、优秀的第三方类库官网:https://www.bootcdn.cn/moment.js:js的日期处理类库dayjs:moment.js的轻量化解决方案,API同moment.js完全一致引入dayjs,全局就多了一个dayjs()函数,dayjs()函数默认解析当前时间的时间戳,也可传入时间戳进行解析注:过滤器相对
- 2024-02-29Vue学习笔记25--过滤器(日期格式化)
日期格式化日期格式化插件:https://www.bootcdn.cn/moment.js、day.js(轻量级moment.js)插件用法:双击day.js==>复制链接并访问==》另存为dayjs.min==》项目中引用https://github.com/iamkun/dayjs/blob/dev/docs/zh-cn/README.zh-CN.md过滤器总结:定义:对要显示的数据进行
- 2023-12-15日期选择器(date-picker)组件
在工作中,经常需要使用日期选择器来让用户方便地选择日期。实现一个日期选择器组件。先来看看今天要实现的效果基础布局popper和日期选择器对应的元素触发器:也就是输入框弹出层:日期面板看看下面的基础布局,为了简化对时间的操作,这里使用dayjsdate-picker.ts//date-pi
- 2023-12-15【Node.js】-包以及npm基本使用操作
一、包的概念将模块、代码、其他资料聚合成一个文件夹包分类:项目包:主要用于编写项目和业务逻辑软件包:封装工具和方法进行使用要求:根目录中,必须有package.js文件(记录包的清单信息)注意:导入软件包时,引入的默认是index.js模块文件/main属性指定的模块文件二、案例需求:封装数组求和函数
- 2023-12-08element plus el-table表格合并
el-table表格合并实现都是使用表格的span-method属性绑定操作函数<el-table:data="table.data":span-method="objectSpanMethod"></el-table>操作函数格式constobjectSpanMethod=({row,column,rowIndex,columnIndex})=>{}相同值行合并对于相同的值进行行
- 2023-11-30Vue 项目配置自动更新,自动刷新页面
今天用户反馈使用页面的时候,有时候点击没反应,排查下来,是因为发布版本的时候,用户那边没有加载最新的文导致的,然后根据思路,做了这个自动更新的功能效果预览http://demo.webwlx.cn/#/update实现思路1.把当前版本的编译时间,通过环境变量的方式保存起来打开vite.config.jsim
- 2023-11-22vxe-gird前端日期段查询,通过手工sql是有数据,但是在前端无数据。
前端查询的时候,日期是返回这种数组:["2023-11-0120:00:00","2023-11-0220:00:00"]1、那么有二种方式,一直是直接传给服务端,由服务端去处理。@RequestParam(value="createDate[]",required=false)String[]createDates用这种形式放到controller的参数列表里就可以。2、
- 2023-11-172023-11-17 记录formly+antd+dayjs的shortcuts设置筛选项全部、昨天、今天
业务中需要用到formly+antd的组件DatePicker日期组件,其中要给该组件添加筛选项(如:全部、昨天、今天),日期的格式化用到了日期插件dayjs(注意不是momentjs)shortcuts=[{text:'全部',onClick:()=>([null,null])},...shortcutsData]如果只是设置昨天或者今天,只需传开始和结束
- 2023-11-17Vue3 + antDesign3.x 汉化 中文(解决日期混合中英文模式
依赖项版本 "ant-design-vue":"^3.2.20", "dayjs":"^1.11.10", "vue":"^3.0.5",依赖处理main.js中import{createApp}from'vue'importAntdfrom'ant-design-vue'import'an
- 2023-11-17Vue 项目配置自动更新,自动刷新页面
今天用户反馈使用页面的时候,有时候点击没反应,排查下来,是因为发布版本的时候,用户那边没有加载最新的文导致的,然后根据思路,做了这个自动更新的功能效果预览http://demo.webwlx.cn/#/update实现思路1.把当前版本的编译时间,通过环境变量的方式保存起来打开vite.config.jsim
- 2023-11-03Ant组件踩坑记录(日期选择器)
1.日期选择器<a-date-picker/>数值转化问题原先写法,我是直接绑定“2023-11-0300:00:00”的string值,结果发现日期框无法显示这个日期<a-date-pickerv-model:value="timeInfo.invoiceDate"format="YYYY-MM-DDHH:mm:ss"show-time/> 网上看了一圈,没有同类问题(PS:我太菜
- 2023-09-05antd限制开始时间与结束时间范围是30天,并不能选择当前日期之后的日期 vue3(默认展示近7天)
<a-range-picker:value="hackValue||dateArr":disabled-date="disabledDate"style="width:240px"separator="~":allow-cl
- 2023-08-26 TypeError: clone.weekday is not a function
依赖库版本:vue3+antdforvuev3.xdayjsversion^1.11.9使用dayjs格式化表单中的日期控件值后,点击日期选择器直接报错解决:引入dayjs插件importdayjsfrom'dayjs'importadvancedFormatfrom'dayjs/plugin/advancedFormat'importcustomParseFormatfrom'dayjs/plu
- 2023-08-20222
importdayjsfrom'dayjs';import{nextTick}from'vue';import{useDictStore}from'/@/store/modules/dict';import{useI18n}from'/@/hooks/web/useI18n';constdictStore=useDictStore();const{t}=useI18n();
- 2023-08-07element-plus el-date-picker 实现周选择
在使用element-plus的时间选择器的时候,有时候会有选择一周的需求,可以使用以下方式进行实现。首先使用type=week属性实现基本的样式<el-date-pickerv-model="baseForm.startTime"type="week"placeholder="选择周"></el-date-picker>接下来修改其值的格式
- 2023-07-02dayjs 实现秒转时分秒格式。
参考https://dayjs.fenxianglu.cn/chatgpt回答环境软件/系统版本说明dayjs^1.11.9步骤安装yarnadddayjs引入//vardayjs=require('dayjs')importdayjsfrom'dayjs'//时间插件importdurationfrom'dayjs/plugin/duration'd
- 2023-06-28dayjs 根据时间展示不同的信息
getTime(data){consttime=this.$dayjs(data).format('YYYYMDD')constnowDate=this.$dayjs().format('YYYYMDD')//今天constyesterday=this.$dayjs().subtract(1,'day').format('YYYYMDD')//前一
- 2023-05-31dayjs库的使用
1.这次不是在线式的,是先下载下来: 2.复制链接: 3.把复制的连接粘贴到网址搜索:结果如下 4. ctrl+s存储上图的源码,进行文件存储: 5.使用: 5.1.点击GitHub仓库: 5.2.进入到其GitHub主页: 5.3.往下滑动,选择语言为“简体中文”: 5.