uniapp日期加减切换,点击切换

先上完成后的页面:当前年年份不显示,不然完整显示。

可以切换和自定义选择。

html:样式和图片自定义。

<view class="image-text_30"><image @click="delMonth" :src="require('@/static/home/zuo.png')" class="icon_4"></image><text @click="selectMonth" lines="1" class="text-group_12">{{ currentYear == new Date().getFullYear() ? currentMonth : currentYear + '年' + currentMonth }}月</text><image @click="addMonth" :src="require('@/static/home/you.png')" class="icon_5"></image>
</view><u-datetime-picker:show="showDateTime"v-model="dateTime"@close="showDateTime = false"@cancel="showDateTime = false"@confirm="confirmDateTime"mode="year-month"closeOnClickOverlay:formatter="formatter"></u-datetime-picker>

JavaScript:

formatter(type, value) {if (type === 'year') {return `${value}年`}if (type === 'month') {return `${value}月`}return value},confirmDateTime(time) {this.currentMonth = new Date(time.value).getMonth() + 1this.currentYear = new Date(time.value).getFullYear()this.showDateTime = falsethis.calendarDate = this.currentYear + '-' + this.currentMonth},delMonth() {if (this.currentMonth == 1) {this.currentMonth = 12this.currentYear -= 1} else {this.currentMonth -= 1}this.setTime(this.currentYear, this.currentMonth)},addMonth() {if (this.currentMonth == 12) {this.currentMonth = 1this.currentYear += 1} else {this.currentMonth += 1}this.setTime(this.currentYear, this.currentMonth)},setTime(year, month) {this.dateTime = Number(new Date(year, month - 1))this.currentMonth = new Date(year, month - 1).getMonth() + 1this.currentYear = new Date(year, month - 1).getFullYear()this.calendarDate = this.currentYear + '-' + this.currentMonth},

代码逻辑上面还是可以优化的。懒得弄了

其实没难度,但是个人简单记录下,逻辑放这里,下次需要可以再copy。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/239106.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

ZGC垃圾收集器介绍

ZGC&#xff08;The Z Garbage Collector&#xff09;是JDK 11中推出的一款低延迟垃圾回收器&#xff0c;它的设计目标包括&#xff1a; 停顿时间不超过10ms&#xff1b;停顿时间不会随着堆的大小&#xff0c;或者活跃对象的大小而增加&#xff1b;支持8MB~4TB级别的堆&#x…

鸿蒙开发工具DevEco Studio的安装与使用

鸿蒙开发工具的安装与使用 1、下载 根据自己的电脑下载对应版本的IED&#xff1a;官网&#xff1a;HUAWEI DevEco Studio和SDK下载和升级 | HarmonyOS开发者 下载后进行安装安装路径不要有中文&#xff0c;空格&#xff0c;特殊符号 下载之后得到的是一个压缩文件&#xff0…

如何在企业微信开发者中心使用内网穿透工具回调本地接口服务

文章目录 1. Windows安装Cpolar2. 创建Cpolar域名3. 创建企业微信应用4. 定义回调本地接口5. 回调和可信域名接口校验6. 设置固定Cpolar域名7. 使用固定域名校验 企业微信开发者在应用的开发测试阶段&#xff0c;应用服务通常是部署在开发环境&#xff0c;在有数据回调的开发场…

四、Sharding-JDBC系列04:分库分表后,如何不停机迁移数据?

目录 停机迁移方案 双写迁移方案 一般会有两种方案&#xff1a; 停机迁移方案 这种方案最简单也是最low的。 数据迁移前&#xff0c;在网站或者app挂个公告&#xff0c;说0点到早上6点系统进行维护&#xff0c;无法访问。 接着到0点停机&#xff0c;系统停掉&#xff0c;…

如何检查Post body并作出响应?

如果需要针对POST body中包含的参数对传入的请求作出响应&#xff0c;你打算怎么做&#xff1f;其实在使用Akamai EdgeWorkers的情况下&#xff0c;只需要一些高级MD&#xff08;MetaData&#xff09;技巧&#xff0c;这一切实现起来可以变得非常简单。 Akamai EdgeWorkers是什…

东北编程语言???

在GitHub闲逛&#xff0c;偶然发现了东北编程语言&#xff1a; 东北编程语言是由Zhanyong Wan创造的&#xff0c;它使用东北方言词汇作为基本关键字。这种编程语言的特点是简单易懂&#xff0c;适合小学文化程度的人学习&#xff0c;并且易于阅读、编写和记忆。它的语法与其他编…

IO网络2.0

思维导图 机械臂 #include <stdio.h> #include <string.h> #include <stdlib.h> #include <myhead.h> #define SER_PORT 8888 #define SER_IP "192.168.122.68" //服务端//TCP客户端 int main(int argc, const char *argv[]) {//创建套接字…

在 Nvidia Docker 容器编译构建显存优化加速组件 xFormers

本篇文章&#xff0c;聊聊如何在新版本 PyTorch 和 CUDA 容器环境中完成 xFormers 的编译构建。 让你的模型应用能够跑的更快。 写在前面 xFormers 是 FaceBook Research &#xff08;Meta&#xff09;开源的使用率非常高的 Transformers 加速选型&#xff0c;当我们使用大模…

十大必备功能:打造高效知识库的关键因素

一个好的产品知识库应该成为客户了解产品功能、解决故障和满足产品相关查询的重要资源。但如果没有合理地维护和更新&#xff0c;其可能就失去了存在的价值。 知识库的有效性取决于其包含的信息是否全面、准确和实用。而要实现这一点&#xff0c;需要关注一些关键功能。 以人…

Docker安全基线检查需要修复的一些问题

一、可能出现的漏洞 限制容器之间的网络流量 限制容器的内存使用量 为Docker启用内容信任 将容器的根文件系统挂载为只读 审核Docker文件和目录 默认情况下&#xff0c;同一主机上的容器之间允许所有网络通信。 如果不需要&#xff0c;请限制所有容器间的通信。 将需要相互通…

在服务器上使用Docker运行SRS Stack,推拉直播流、多平台转播、本地录制、虚拟直播、直播转码、AI字幕、其他

SRS Stack | SRS (ossrs.net) Docker​ 推荐使用Docker运行SRS Stack&#xff1a; docker run --restart always -d -it --name srs-stack -v $HOME/data:/data \-p 2022:2022 -p 2443:2443 -p 1935:1935 -p 8000:8000/udp -p 10080:10080/udp \registry.cn-hangzhou.aliyun…

深度学习论文解读分享之diffGrad:一种卷积神经网络优化方法

IEEE TNNLS 2020&#xff1a;diffGrad: 一种卷积神经网络优化方法 题目 diffGrad: An Optimization Method for Convolutional Neural Networks 作者 Shiv Ram Dubey , Member, IEEE, Soumendu Chakraborty , Swalpa Kumar Roy , Student Member, IEEE, Snehasis Mukherjee…

K8S----YAML

kubernetes中资源可以使用YAML描述&#xff08;如果您对YAML格式不了解&#xff0c;可以参考YAML语法&#xff09;&#xff0c;也可以使用JSON。其内容可以分为如下四个部分&#xff1a; typeMeta&#xff1a;对象类型的元信息&#xff0c;声明对象使用哪个API版本&#xff0c…

井盖异动传感器,守护脚下安全

随着城市化进程的加速&#xff0c;城市基础设施的安全问题日益受到关注。其中&#xff0c;井盖作为城市地下管道的重要入口&#xff0c;其安全问题不容忽视。然而&#xff0c;传统的井盖监控方式往往存在盲区&#xff0c;无法及时发现井盖的异常移动。为此&#xff0c;我们推出…

nginx查看连接数的几种方法

前言 nginx作为目前最流行的web服务器之一&#xff0c;在许多生产环境都能看到他的踪影。有时候&#xff0c;我们需要统计nginx的连接配置&#xff0c;本文主要分享一下如何统计nginx的连接数。 方法一 netstat 使用netstat统计连接数&#xff0c;这种是将master和worker一起…

linux安装MySQL5.7(安装、开机自启、定时备份)

一、安装步骤 我喜欢安装在/usr/local/mysql目录下 #切换目录 cd /usr/local/ #下载文件 wget https://dev.mysql.com/get/Downloads/MySQL-5.7/mysql-5.7.38-linux-glibc2.12-x86_64.tar.gz #解压文件 tar -zxvf mysql-5.7.38-linux-glibc2.12-x86_64.tar.gz -C /usr/local …

使用Cloudreve快速搭建一个私有网盘,配置存储策略和管理权限以及Webdav设置访问

Cloudreve 是什么&#xff1f; Cloudreve 可以让您快速搭建起公私兼备的网盘系统。Cloudreve 在底层支持不同的云存储平台&#xff0c;用户在实际使用时无须关心物理存储方式。你可以使用 Cloudreve 搭建个人用网盘、文件分享系统&#xff0c;亦或是针对大小团体的公有云系统。…

LogicBroker上进行 Babylist EDI项目测试指南

在LogicBroker上启动对接Babylist onboarding流程 接受邀请并填写Onboarding表单 企业将会收到一封入驻邀请电子邮件&#xff0c;邮件中将会包含Onboarding表单的链接。 1.在标题为 “[Supplier] has been invited to connect with [Retailer]” 的邮件中&#xff0c;点击Ac…

GIT SourceTree 回滚提交

步骤一&#xff1a; 步骤二&#xff1a; 步骤三&#xff1a; 在终端输入命令&#xff08;位置是项目目录下&#xff09; git push origin feature_mo2.1_r3_zhanx653 -f

Git的简单使用说明

Git入门教程 git的最主要的作用&#xff1a;版本控制&#xff0c;协助开发 一.版本控制分类 ​​ 1.本地版本控制 ​​ 2.集中版本控制 ​​ 所有的版本数据都存在服务器上&#xff0c;用户的本地只有自己以前所同步的版本&#xff0c;如果不连网的话&#xff0c;用户就看不…