uniapp自带的选择日期的使用

news2024/11/19 2:43:40

年月日的下拉框
在这里插入图片描述

直接看代码

<view class="uni-title uni-common-pl">日期选择器</view>
		<view class="uni-list">
			<view class="uni-list-cell">
				<view class="uni-list-cell-left">
					当前选择
				</view>
				<view class="uni-list-cell-db">
					<picker mode="date" :value="date" :start="startDate" :end="endDate" @change="bindDateChange">
						<view class="uni-input">{{date}}</view>
					</picker>
				</view>
			</view>
		</view>
	<script>
export default {
    data() {
        const currentDate = this.getDate({
            format: true
        })
        return {
            date: currentDate,//默认设置的时间 此处可以从后台获取
        }
    },
    computed: {
        startDate() {
            return this.getDate('start');
        },
        endDate() {
            return this.getDate('end');
        }
    },
    methods: {
  
        bindDateChange: function(e) {
            this.date = e.detail.value
        },
        
        //获取当前的日子
        getDate(type) {
            const date = new Date();
            let year = date.getFullYear();
            let month = date.getMonth() + 1;
            let day = date.getDate();

            if (type === 'start') {
                year = year - 60;
            } else if (type === 'end') {
                year = year + 2;
            }
            month = month > 9 ? month : '0' + month;
            day = day > 9 ? day : '0' + day;
            return `${year}-${month}-${day}`;
        }
    }
}
</script>

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Linux第29步_安装“Notepad++”软件

STM32CubeProgrammer脚本文件的后缀为“.tsv”&#xff0c;ST公司官方也叫做FlashLayout。在烧写“TF-A固件”之前&#xff0c;我们需要用“Notepad”软件打开“后缀为.tsv”的脚本文件&#xff0c;根据需求决定哪些文件需要更新&#xff0c;设置好这个脚本文件。 在后期使用S…

书生·浦语大模型实战营第四节课笔记及作业

XTuner 大模型单卡低成本微调实战 1 Finetune简介 大语言模型LLM是在海量的文本内容基础上&#xff0c;以无监督或半监督方式进行训练的。海量的文本内容赋予了大模型各种各样的行业知识。但是如果直接把大模型的知识用于生产实践&#xff0c;会发现回答不大满意。微调的目的…

红队打靶练习:HOLYNIX: V1

目录 信息收集 1、arp 2、netdiscover 3、nmap 4、nikto whatweb 目录探测 1、gobuster 2、dirsearch 3、dirb 4、feroxbuster WEB sqlmap 1、爆库 2、爆表 3、爆列 4、爆字段 后台登录 1、文件上传 2、文件包含 3、越权漏洞 反弹shell 提权 总结 信息…

【Docker】网络模式➕自定义网络

&#x1f973;&#x1f973;Welcome 的Huihuis Code World ! !&#x1f973;&#x1f973; 接下来看看由辉辉所写的关于Docker的相关操作吧 目录 &#x1f973;&#x1f973;Welcome 的Huihuis Code World ! !&#x1f973;&#x1f973; 一.Docker网络模式的介绍 二. 网桥模…

[C#]winform部署官方yolov8-obb旋转框检测的onnx模型

【官方框架地址】 https://github.com/ultralytics/ultralytics 【算法介绍】 Yolov8-obb&#xff08;You Only Look Once version 8 with Oriented Bounding Boxes&#xff09;是一种先进的对象检测算法&#xff0c;它在传统的Yolov3和Yolov4基础上进行了优化&#xff0c;加…

【Java】源码文件开头添加注释

需求 应公司质量部要求&#xff0c;需要对代码做静态检查。质量部要求&#xff0c;源码文件必须在起始行起设置一些注释&#xff0c;然而项目已经开发了一年之久&#xff0c;且没有维护这个注释。 此时&#xff0c;面对好几千个源码文件&#xff0c;我们如何快速添加相应的注…

Linux命令之目录操作类和文件操作类命令mkdir,rmdir,cp, mv,rm,touch,ln,whereis,whatis的使用

一、实验题 在桌面新建目录dir1 在当前目录的dir2目录中创建subdir2子目录&#xff0c;如果dir2目录不存在则同时创建 用root身份&#xff0c;将家目录下的.bashrc复制到/tmp下&#xff0c;并更名为bashrc 变换目录到/tmp,并将/var/log/wtmp文件的所有特性都一起复制到/tmp且观…

RAG基础功能优化、以及RAG架构优化

RAG基础功能优化 对RAG的基础功能优化&#xff0c;我们要从RAG的流程入手[1]&#xff0c;可以在每个阶段做相应的场景优化。 从RAG的工作流程看&#xff0c;能优化的模块有&#xff1a;文档块切分、文本嵌入模型、提示工程优化、大模型迭代。下面针对每个模块分别做说明&#…

按钮QPushButton的简单使用

1.相关说明 设置字体居左、居中、居右、字体颜色、字体类型 2.界面绘制 3.相关主要代码 #include "widget.h" #include "ui_widget.h"Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget) {ui->setupUi(this); }Widget::~Widget() …

【电力电子】2 开、闭环单相桥式SPWM逆变仿真电路

【仅供参考】 【2022.11西南交大电力电子仿真】 目录 1 开环单相桥式SPWM逆变电路搭建及波形记录 2 闭环单相桥式SPWM逆变电路搭建及波形记录 1 开环单相桥式SPWM逆变电路搭建及波形记录 采用单极性调制法&#xff0c;按老师PPT&#xff08;如下图&#xff09;所示进行单相…

Server/PC 稳定性测试(Windows)

Server/PC 稳定性测试 1. CPU - 中央处理器1.1 CPU稳定性1.2 CPU温度 2. Memory - 内存2.1 内存性能 3. DISK - 硬盘3.1 HDD - 机械硬盘机械硬盘转速详解监测工具 3.2 SSD - 固态硬盘监测工具 4. 使用时长cpu能用多久&#xff1f;主板能用多久&#xff1f;内存能用多久&#xf…

移动端开发进阶之蓝牙通讯(三)

移动端开发进阶之蓝牙通讯&#xff08;三&#xff09; 移动端蓝牙通讯的主要特点是无线、便捷和高效&#xff1b; 它能够摆脱传统有线连接的束缚&#xff0c;让用户更加自由地使用设备&#xff1b; 同时&#xff0c;蓝牙通讯协议经过多年的发展和完善&#xff0c;已经具备了较…

软件测试|SQLAlchemy query() 方法查询数据

简介 上一篇文章我们介绍了SQLAlchemy 的安装和基础使用&#xff0c;本文我们来详细介绍一下如何使用SQLAlchemy的query()方法来高效的查询我们的数据。 创建模型 我们可以先创建一个可供我们查询的模型&#xff0c;也可以复用上一篇文章中我们创建的模型&#xff0c;代码如…

RabbitMQ脑裂处理

脑裂现象&#xff1a; Network partition detected Mnesia reports that this RabbitMQ cluster has experienced a network partition. There is a risk of losing data. Please read RabbitMQ documentation about network partitions and the possible solutions. 转载请在文…

山东特产,乳山生蚝有话说

牡蛎&#xff0c;又叫生蚝&#xff0c;是无数吃货钟爱的海鲜美味。爱吃生蚝的法国人称之为“海中牛奶”&#xff0c;我国民间也有说法&#xff1a;“冬至到清明&#xff0c;蚝肉肥晶晶。”说的就是眼下&#xff0c;生蚝最肥美的冬春时节&#xff0c;也是“中国牡蛎之乡”山东乳…

vue中设置注释模板

参考地址 ctrlshiftp 打开编辑器配置输入configure user snippets - 选择 new global snipp files - 命名为 vueComment&#xff0c;弹出注释模板&#xff0c;即可自定义注释 如下/// 回车 即可在代码块中使用注释 { "Print to console": {"prefix": &q…

整型和浮点数在内存中的存储

前言 我们都知道数据在计算机中是以二进制的形式存储的&#xff0c;那么问题来了&#xff0c;不同类型的数据的具体存储方式是什么&#xff0c;今天我想就整形和浮点数展开叙述。 一. 整数在内存中的存储 1.1源码&#xff0c;反码和补码 整数的2进制表⽰⽅法有三种&#xff0…

静态住宅代理与动态住宅代理的区别?如何选?

住宅代理ip分类两种类型&#xff1a;静态住宅代理和动态住宅代理&#xff0c;他们有什么区别又能用在什么场景呢&#xff1f;我们先从他们是如何运作开始。 一、什么是住宅代理ip isp住宅代理ip我们称为真人住宅代理&#xff0c;地址是从真人/家庭中出发&#xff0c;安全性更高…

软件测试|Pydantic处理时间类型数据

简介 我们之前介绍过使用pydantic验证数据&#xff0c;比如校验数据的格式等&#xff0c;但是在我们的日常工作中&#xff0c;还有一种数据是需要我们验证的&#xff0c;比如时间数据&#xff0c;时间数据不同于字符串&#xff0c;列表等数据&#xff0c;与他们的验证不一样&a…

HNU-模式识别-作业1-视频监控系统

模式识别-作业1 计科210X 甘晴void 202108010XXX 【评分&#xff1a;98/100】 题目&#xff1a; 查阅相关技术资料&#xff0c;根据自己家庭相应的情况&#xff0c;设计一个视频监控系统。要求&#xff1a; 系统功能说明系统布线图及说明系统软硬件配置说明 饱和式自家用…