当前位置: 首页 > 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;文件传输服务 …...

JavaSec-RCE

简介 RCE(Remote Code Execution)&#xff0c;可以分为:命令注入(Command Injection)、代码注入(Code Injection) 代码注入 1.漏洞场景&#xff1a;Groovy代码注入 Groovy是一种基于JVM的动态语言&#xff0c;语法简洁&#xff0c;支持闭包、动态类型和Java互操作性&#xff0c…...

python打卡day49

知识点回顾&#xff1a; 通道注意力模块复习空间注意力模块CBAM的定义 作业&#xff1a;尝试对今天的模型检查参数数目&#xff0c;并用tensorboard查看训练过程 import torch import torch.nn as nn# 定义通道注意力 class ChannelAttention(nn.Module):def __init__(self,…...

树莓派超全系列教程文档--(62)使用rpicam-app通过网络流式传输视频

使用rpicam-app通过网络流式传输视频 使用 rpicam-app 通过网络流式传输视频UDPTCPRTSPlibavGStreamerRTPlibcamerasrc GStreamer 元素 文章来源&#xff1a; http://raspberry.dns8844.cn/documentation 原文网址 使用 rpicam-app 通过网络流式传输视频 本节介绍来自 rpica…...

【项目实战】通过多模态+LangGraph实现PPT生成助手

PPT自动生成系统 基于LangGraph的PPT自动生成系统&#xff0c;可以将Markdown文档自动转换为PPT演示文稿。 功能特点 Markdown解析&#xff1a;自动解析Markdown文档结构PPT模板分析&#xff1a;分析PPT模板的布局和风格智能布局决策&#xff1a;匹配内容与合适的PPT布局自动…...

江苏艾立泰跨国资源接力:废料变黄金的绿色供应链革命

在华东塑料包装行业面临限塑令深度调整的背景下&#xff0c;江苏艾立泰以一场跨国资源接力的创新实践&#xff0c;重新定义了绿色供应链的边界。 跨国回收网络&#xff1a;废料变黄金的全球棋局 艾立泰在欧洲、东南亚建立再生塑料回收点&#xff0c;将海外废弃包装箱通过标准…...

【开发技术】.Net使用FFmpeg视频特定帧上绘制内容

目录 一、目的 二、解决方案 2.1 什么是FFmpeg 2.2 FFmpeg主要功能 2.3 使用Xabe.FFmpeg调用FFmpeg功能 2.4 使用 FFmpeg 的 drawbox 滤镜来绘制 ROI 三、总结 一、目的 当前市场上有很多目标检测智能识别的相关算法&#xff0c;当前调用一个医疗行业的AI识别算法后返回…...

NXP S32K146 T-Box 携手 SD NAND(贴片式TF卡):驱动汽车智能革新的黄金组合

在汽车智能化的汹涌浪潮中&#xff0c;车辆不再仅仅是传统的交通工具&#xff0c;而是逐步演变为高度智能的移动终端。这一转变的核心支撑&#xff0c;来自于车内关键技术的深度融合与协同创新。车载远程信息处理盒&#xff08;T-Box&#xff09;方案&#xff1a;NXP S32K146 与…...

算法:模拟

1.替换所有的问号 1576. 替换所有的问号 - 力扣&#xff08;LeetCode&#xff09; ​遍历字符串​&#xff1a;通过外层循环逐一检查每个字符。​遇到 ? 时处理​&#xff1a; 内层循环遍历小写字母&#xff08;a 到 z&#xff09;。对每个字母检查是否满足&#xff1a; ​与…...

计算机基础知识解析:从应用到架构的全面拆解

目录 前言 1、 计算机的应用领域&#xff1a;无处不在的数字助手 2、 计算机的进化史&#xff1a;从算盘到量子计算 3、计算机的分类&#xff1a;不止 “台式机和笔记本” 4、计算机的组件&#xff1a;硬件与软件的协同 4.1 硬件&#xff1a;五大核心部件 4.2 软件&#…...

第7篇:中间件全链路监控与 SQL 性能分析实践

7.1 章节导读 在构建数据库中间件的过程中&#xff0c;可观测性 和 性能分析 是保障系统稳定性与可维护性的核心能力。 特别是在复杂分布式场景中&#xff0c;必须做到&#xff1a; &#x1f50d; 追踪每一条 SQL 的生命周期&#xff08;从入口到数据库执行&#xff09;&#…...