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

微信小程序时间弹窗——年月日时分

在这里插入图片描述

需求

  • 1、默认当前时间
  • 2、选择时间弹窗限制最大值、最小值
  • 3、每次弹起更新最大值为当前时间,默认值为上次选中时间
  • 4、== minDate: new Date(2023, 10, 1).getTime(),也可以传入时间字符串new Date('2023-10-1 12:22').getTime() ==

html

  	 <view class="flex bb ptb-12"><view><text class="red">* </text>处理时间:</view><view class="flex1 size-28" bindtap="chooseTime"><view class="mr-8">{{ququ2?ququ2:'请选择'}}</view><van-icon name="arrow" /></view></view><!-- 弹窗 --><van-popup show="{{ isShowPop }}" bind:close="onClosePop" position="bottom"><van-datetime-picker title="处理时间" formatter="{{formatter}}" value="{{ currentDate  }}" bind:confirm="confirmPop" bind:cancel="onClosePop" min-date="{{minDate}}" max-date="{{maxDate}}" /></van-popup>

data

  	ququ2: '',isShowPop: false,currentDate: new Date().getTime(),minDate: new Date(2023, 10, 1).getTime(), //也可以传入时间字符串new Date('2023-10-1 12:22').getTime()maxDate: new Date().getTime(),formatter: function (type, value) {if (type === 'year') {return `${value}`;} else if (type === 'month') {return `${value}`;} else if (type === 'day') {return `${value}`;} else if (type === 'hour') {return `${value}`;} else if (type === 'minute') {return `${value}`;}return value;},

方法

// -----------选择时间弹窗---------chooseTime() {this.setData({maxDate: new Date().getTime(),// new Date('2023-10-1 12:22').getTime() 回显当前选中的时间,否则显示当前时间currentDate: this.data.ququ2 ? new Date(this.data.ququ2).getTime() : new Date().getTime(),isShowPop: true})},confirmPop(e) {// console.log(e, 'e', this.formatTimestamp(e.detail))this.setData({ququ2: this.formatTimestamp(e.detail),isShowPop: false})},onClosePop() {this.setData({isShowPop: false})},// 选中的时间戳处理成  2014-12-23 12:11 格式formatTimestamp(timestamp) {var date = new Date(timestamp);var year = date.getFullYear();var month = date.getMonth() + 1; // 月份是从0开始的,所以需要加1var day = date.getDate();var hour = date.getHours();var minute = date.getMinutes();// 格式化时间为字符串// 确保月和日是两位数month = month < 10 ? '0' + month : month;day = day < 10 ? '0' + day : day;hour = hour < 10 ? '0' + hour : hour;minute = minute < 10 ? '0' + minute : minute;return `${year}-${month}-${day} ${hour}:${minute}`;},

相关文章:

微信小程序时间弹窗——年月日时分

需求 1、默认当前时间2、选择时间弹窗限制最大值、最小值3、每次弹起更新最大值为当前时间&#xff0c;默认值为上次选中时间4、 minDate: new Date(2023, 10, 1).getTime(),也可以传入时间字符串new Date(2023-10-1 12:22).getTime() html <view class"flex bb ptb…...

杂货 | 每日资讯 | 2024.11.1

注意&#xff1a;以下内容皆为AI总结 2024年11月1日&#xff0c;人工智能&#xff08;AI&#xff09;领域发生了多项重要事件&#xff0c;标志着技术发展的新阶段。本文将详细探讨以下三大事件&#xff1a; OpenAI为ChatGPT新增搜索功能IEEE发布《2025年及以后的技术影响》报…...

Genmoai-smol:专为单 GPU 优化的开源 AI 视频生成模型,低显存生成高质量视频

❤️ 如果你也关注大模型与 AI 的发展现状&#xff0c;且对大模型应用开发非常感兴趣&#xff0c;我会快速跟你分享最新的感兴趣的 AI 应用和热点信息&#xff0c;也会不定期分享自己的想法和开源实例&#xff0c;欢迎关注我哦&#xff01; &#x1f966; 微信公众号&#xff…...

RHCE8

一、防火墙 防火墙&#xff1a;防火墙是位于内部网和外部网之间的屏障&#xff0c;它按照系统管理员预先定义好的规则来控制数据包的进出。防火墙又可以分为硬件防火墙与软件防火墙。 硬件防火墙是由厂商设计好的主机硬件&#xff0c;这台硬件防火墙的操作系统主要以提供数据…...

长短期记忆网络(LSTM)如何在连续的时间步骤中处理信息

长短期记忆网络&#xff08;LSTM&#xff09;如何在连续的时间步骤中处理信息 长短期记忆网络&#xff08;LSTM&#xff09;是一种高级的循环神经网络&#xff08;RNN&#xff09;&#xff0c;设计用来解决传统RNN在处理长时间序列数据时遇到的梯度消失或爆炸问题。LSTM通过其…...

MySQL基础(三)

一. 插入内容insert tips&#xff1a; &#xff08;一&#xff09;SQL中 表示 字符串&#xff0c;可以用 也可以用 " C/C、Java中&#xff0c; 表示字符&#xff0c;" 表示字符串SQL/Python/JS&#xff0c;没有字符类型&#xff0c;只有字符串&#xff0c; 和 &qu…...

浏览器八股

面试系列文章 万字总结我在寒冬里的面试准备经历前端铜九铁十面试必备八股文——【HTML&CSS】前端铜九铁十面试必备八股文——【JavaScript】前端铜九铁十面试必备八股文——【Vue】前端铜九铁十面试必备八股文——【浏览器】前端铜九铁十面试必备八股文——【网络相关】前…...

华为机试HJ18 识别有效的IP地址和掩码并进行分类统计

首先看一下题 描述 请解析IP地址和对应的掩码&#xff0c;进行分类识别。要求按照A/B/C/D/E类地址归类&#xff0c;不合法的地址和掩码单独归类。 所有的IP地址划分为 A,B,C,D,E五类 A类地址从1.0.0.0到126.255.255.255; B类地址从128.0.0.0到191.255.255.255; C类地址从192.0.…...

计算机网络——TCP拥塞控制原理

吞吐量 端口有16位...

ubuntu-开机黑屏问题快速解决方法

开机黑屏一般是由于显卡驱动出现问题导致。 快速解决方法&#xff1a; 通过ubuntu高级选项->recovery模式->resume->按esc即可进入recovery模式&#xff0c;进去后重装显卡驱动&#xff0c;重启即可解决。附加问题&#xff1a;ubuntu的默认显示管理器是gdm3,如果重…...

DNS服务器

正反解析 [rootlocalhost ~]# systemctl stop firewalld #关防火墙 [rootlocalhost ~]# setenforce 0 #关闭selinux [rootlocalhost ~]# mount /dev/sr0 /mnt #挂载 mount: /mnt: WARNING: source write-protected, mounted read-only. [rootlocalhost ~]# yum …...

【C++笔记】string类使用详解

前言 各位读者朋友们大家好&#xff01;上期我们讲完了C的模板初阶&#xff0c;这一期我们开启STL的学习。STL是C的数据结构和算法库&#xff0c;是我们学习C的很重要的一部分内容&#xff0c;在以后的工作中也很重要。现在我们开始讲解。 目录 前言一. 为什么学习string类1.…...

数字隔离器与光隔离器有何不同?---腾恩科技

在电子隔离中&#xff0c;两种常用的解决方案是数字隔离器和光学隔离器。两者都旨在电气隔离电路的各个部分&#xff0c;以保护敏感元件免受高压干扰&#xff0c;但它们通过不同的技术实现这一目标。本文探讨了这些隔离器之间的差异&#xff0c;重点介绍了它们的工作原理、优势…...

方差与协方差

方差是一种特殊的协方差。...

【含文档】基于Springboot+Vue的工商局商家管理系统 (含源码数据库+LW)

1.开发环境 开发系统:Windows10/11 架构模式:MVC/前后端分离 JDK版本: Java JDK1.8 开发工具:IDEA 数据库版本: mysql5.7或8.0 数据库可视化工具: navicat 服务器: SpringBoot自带 apache tomcat 主要技术: Java,Springboot,mybatis,mysql,vue 2.视频演示地址 3.功能 系统定…...

【股票市场情绪量化模型】

股票市场情绪量化模型&#xff1a;理论与实践 目录 什么是股票市场情绪情绪量化模型的基本概念情绪数据的来源与获取情绪量化模型的构建 4.1 情绪指标的选择4.2 模型设计与算法 情绪与市场表现的关系情绪量化模型的应用案例模型的局限性与挑战总结 1. 什么是股票市场情绪 股…...

Oracle视频基础1.3.8与1.4.1练习

1.3.8与1.4.1 -看数据文件的目录&#xff0c; dump 的目录&#xff0c;oracle的软件目录 -(secureCRT&#xff0c;telnet连接linux。)看当前用户&#xff0c;当前所属组&#xff0c;通过操作系统认证以sysdba登陆,启动数据库然后关闭 -看口令文件 看数据文件的目录&#xff0c…...

基于前馈神经网络模型和卷积神经网络的MINIST数据集训练

目录 前馈神经网络FNN模型 卷积神经网络CNN模型 前馈神经网络FNN模型 author: lxy function: model--mnist date : 2024/10/25 email : 13102790991163.com # 导入必要的库 import torch import torch.nn as nn import torchvision.datasets as dsets import torchvision.t…...

Vue3中Element Plus==el-eialog弹框中的input无法获取表单焦点

有弹框情况下 <template> <input ref"input" /> </template> <script setup> import { ref, onMounted } from vue // 声明一个 ref 来存放该元素的引用 // 必须和模板里的 ref 同名 const input ref(null) onMounted(() > { ne…...

16.网工入门篇--------介绍下网络服务及应用

一、网络服务的概念 网络服务是指通过网络提供的软件功能或设施&#xff0c;它允许不同的设备和用户在网络环境中进行信息交换、资源共享和协作。这些服务基于各种网络协议&#xff0c;以实现高效、可靠的通信。 二、常见网络服务类型 &#xff08;一&#xff09;文件传输服务 …...

c++ Base58编码解码

Base58 字符集 Base58 使用 58 个字符进行编码&#xff0c;字符集为&#xff1a;123456789ABCDEFGHJKLMNPQRSTUVWXYZabcdefghijkmnopqrstuvwxyz。注意&#xff1a;0&#xff08;零&#xff09;、O&#xff08;大写字母O&#xff09;、I&#xff08;大写字母I&#xff09;和 l&a…...

第R9周:阿尔茨海默病诊断(优化特征选择版)

文章目录 1. 导入数据2. 数据处理2.1 患病占比2.2 相关性分析2.3 年龄与患病探究 3. 特征选择4. 构建数据集4.1 数据集划分与标准化4.2 构建加载 5. 构建模型6. 模型训练6.1 构建训练函数6.2 构建测试函数6.3 设置超参数 7. 模型训练8. 模型评估8.1 结果图 8.2 混淆矩阵9. 总结…...

excel数据对比找不同:6种方法核对两列数据差异

工作中&#xff0c;有时需要核对两列数据的差异&#xff0c;用于对比、复核等。数据较少的情况下差异肉眼可见&#xff0c;数据量较大时用什么方法比较好呢&#xff1f;从个人习惯出发&#xff0c;我整理了6种方法供参考。 6种方法核对两列数据差异&#xff1a; 1、Ctrl G定位…...

前端面试准备-7

1.定义class的实现 //定义class class Person{//公有属性nameage 18//构造函数constructor(name){//构造函数内部的this实例化对象this.name name//动态添加属性&#xff08;不推荐&#xff09;this.food [&#x1f402;,&#x1f40e;,&#x1f40f;]}//公有方法sayHi(){c…...

ASP.NET Core 中间件深度解析:构建灵活高效的请求处理管道

在现代Web应用开发中&#xff0c;请求处理管道的设计和实现至关重要。ASP.NET Core通过其中间件(Middleware)系统提供了一种高度灵活、可扩展的方式来构建请求处理管道。本文将全面深入地探讨ASP.NET Core中间件的概念、工作原理、实现方式以及最佳实践&#xff0c;帮助开发者掌…...

《仿盒马》app开发技术分享-- 商品搜索页(顶部搜索bar热门搜索)(端云一体)

开发准备 随着开发功能的逐渐深入&#xff0c;我们的应用逐渐趋于完善&#xff0c;现在我们需要继续在首页给没有使用按钮以及组件添加对应的功能&#xff0c;这一节我们要实现的功能是商品搜索页面&#xff0c;这个页面我们从上到下开始实现功能&#xff0c;首先就是一个搜索…...

React 第五十三节 Router中 useRouteError 的使用详解和案例分析

前言 useRouteError 是 React Router v6.4 引入的关键错误处理钩子&#xff0c;用于在 路由错误边界&#xff08;Error Boundary&#xff09; 中获取路由操作过程中发生的错误信息。 它提供了优雅的错误处理机制&#xff0c;让开发者能够创建用户友好的错误界面。 一、useRou…...

【Go语言基础】基本语法

文章目录 一、 程序基本结构二. 词法标记&#xff08;Lexical Tokens&#xff09;&#xff08;编译器解析单元&#xff09;三、 标识符规则&#xff08;变量命名规则&#xff09;四、注释与行分隔符五、关键字与预定义标识符六、 代码示例解析 以下是基于文档的Go语言基础语法总…...

【安全攻防与漏洞】​​量子计算对HTTPS的威胁:后量子密码学进展

⚛️ 一、量子计算对HTTPS的核心威胁 Shor算法破解非对称加密 Shor算法可高效分解大整数&#xff08;破解RSA&#xff09;和计算椭圆曲线离散对数&#xff08;破解ECC&#xff09;&#xff0c;而HTTPS依赖的TLS握手阶段依赖RSA/ECC进行密钥交换和身份验证。一旦实用化量子计算…...

Linux可执行文件ELF文件结构

目标文件格式 编译器编译源代码后生成的文件叫做目标文件&#xff0c;而目标文件经过编译器链接之后得到的就是可执行文件。那么目标文件到底是什么&#xff1f;它和可执行文件又有什么区别&#xff1f;链接到底又做了什么呢&#xff1f;接下来&#xff0c;我们将探索一下目标…...