uni-app 解决钉钉小程序日期组件uni-datetime-picker不兼容ios问题

news2024/12/25 12:29:34

最近在使用uni-app开发 钉钉小程序 ,遇到一个ios的兼容性问题
uni-datetime-picker 组件在模拟器上可以使用,在真机上不生效问题

文章目录

    • 1. 不兼容的写法,`uni-datetime-picker 不兼容IOS`
    • 2. 兼容的写法,使用 `dd.datePicker` 实现。
    • 3. 实现效果,自测IOS可以兼容

1. 不兼容的写法,uni-datetime-picker 不兼容IOS

<uni-forms-item label="产生时间" required name="generateTime">
	<uni-datetime-picker class="custom-datetime-picker" :disabled="isDisabled"
		v-model="generate.generateTime" :clear-icon="false" :clear="false" />
</uni-forms-item>

2. 兼容的写法,使用 dd.datePicker 实现。

  1. 就是自定义一个 view 然后通过click事件触发dd.datePicker。
<uni-forms-item label="产生时间" required name="generateTime">
	<view @click="showPicker" class="datetime-picker">
		<uni-icons custom-prefix="custom-icon" class="icon-calendar" type="calendar" size="20" color="#c2c6cd"/>
		{{generate.generateTime || '请选择时间'}}
	</view>
</uni-forms-item>
methods: {
	// 点击弹窗日期窗口
	showPicker() {
		dd.datePicker({
			format: 'yyyy-MM-dd HH:mm:ss',
			// currentDate: '2012-12-12',
			success: (res) => {
				if (res) {
					this.generate.generateTime = res.date;
				}
			},
		});
	},
}
  1. 在优化一下自定义的日期组件的样式
.datetime-picker,.datetime-picker-placeholder{
	width: 100%;
	flex: 1;
	line-height: 1;
	font-size: 14px;
	height: 40px;
	display: flex;
	box-sizing: border-box;
	flex-direction: row;
	align-items: center;
	border: 1px solid #dcdfe6;
	border-radius: 4px;
	padding-left:3px;
}

.icon-calendar{
	margin-right:2px;
}

3. 实现效果,自测IOS可以兼容

样式跟uni-ui的 uni-datetime-picker 组件样式一样。

在这里插入图片描述

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

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

相关文章

安企神局域网监控软件,员工电脑终端的安全管理软件

安企神局域网监控软件&#xff0c;员工电脑终端的安全管理软件 安企神局域网监控软件下载使用 公司老板其实最怕的就是公司机密遭到泄露&#xff0c;而一般泄露的方法都是通过一些通讯软件而泄露出去的&#xff0c;如微信、qq等等&#xff0c;所以很多老板都想知道有什么软件…

C语言映射表在串口数据解析中的应用

一、映射表在串口数据解析中的应用 1、数据结构 typedef struct {char CMD[CMDLen];unsigned char (*cmd_operate)(char *data); }Usart_Tab; 2、指令、函数映射表 static const Usart_Tab InstructionList[CMDMax] {{"PWON",PowOn},{"PWOFF",PowOff}…

【错误解决方案】ModuleNotFoundError: No module named ‘feather‘

1. 错误提示 在python程序中&#xff0c;尝试导入一个名为feather的模块&#xff0c;但Python提示找不到这个模块。 错误提示&#xff1a;ModuleNotFoundError: No module named feather 2. 解决方案 出现这种情况&#xff0c;有可能是因为你还没有安装这个模块&#xff0c;…

基于ECS搭建云上博客WordPress,使用Apache+MariaDB+PHP环境

文章目录 一、安装Apache二、安装MariaDB数据库三、安装PHP四、安装和配置WordPress 一、安装Apache 执行如下命令&#xff0c;安装Apache服务及其扩展包。 ssh rootECS公网地址yum -y install httpd mod_ssl mod_perl mod_auth_mysql执行如下命令&#xff0c;查看Apache是否…

吴文俊人工智能科学技术奖在哪可以查到?

吴文俊人工智能科学技术奖 “吴文俊人工智能科学技术奖&#xff08;WU WEN JUN AI SCIENCE & TECHNOLOGY AWARD&#xff09;”是我国智能科学技术领域唯一以享誉海内外的杰出科学家、数学大师、人工智能先驱、我国智能科学研究的开拓者和领军人、首届国家最高科学技术奖获…

最新itvbox如意版影视源码,支持苹果CMS,tvbox接口全解版

tvbox是一款现今非常火爆的影视APP壳子&#xff0c;免会员可观看全网所有VIP视频&#xff0c; itvbox就是tvbox的二开版本。支持会员系统、自动注册、登陆、卡密充值、在线购买套餐、试看功能、首页公告、积分兑换、点播、直播、可对接苹果CMS系统、资源站以及tvbox仓库接口等…

Anisble中的任务执行控制

一、循环 1、简单循环 使用loop赋值列表的格式&#xff1a; loop: ##赋值列表 - value1 - value2 - ... {{item}} ##迭代变量名称2、循环散列或字典列表 可以赋予不同的服务不同的状态 - name: create filehosts: 172.25.0.254tasks:- name: file moduleservice:name: &…

Windows电脑怎样修改电脑的名称?

Windows电脑在使用过程中会处于局域网络中&#xff0c;为了让局域网络中其他Windows电脑看到自己的电脑并知识是自己的电脑&#xff0c;可以将电脑名称设置为自己的名字&#xff0c;那怎样设置电脑名称呢&#xff1f; Windows电脑怎样修改电脑的名称&#xff1f; 1、打开Wind…

组件局部注册和全局注册

普通组件的注册使用-局部注册 1.特点&#xff1a; 只能在注册的组件内使用 2.实现效果 3.步骤&#xff1a; 创建.vue文件&#xff08;三个组成部分&#xff09;在使用的组件内先导入再注册&#xff0c;最后使用 4.使用方式&#xff1a; 当成html标签使用即可 <组件名&…

【vtk学习笔记4】基本数据类型

一、可视化数据的基本特点 可视化数据有以下特点&#xff1a; 离散型 计算机处理的数据是对无限、连续的空间进行采样&#xff0c;生成的有限采样点数据。在某些离散点上有精确的值&#xff0c;但点与点之间值不可知&#xff0c;只有通过插值方式获取数据具有规则或不规则的结…

const迭代器与模板构造函数

在自己实现C中list的时候&#xff0c;当实现const迭代器的时候&#xff0c;发现报错了&#xff0c;一直思考到现在 才发现是一个&#xff0c;很简单的问题&#xff0c;但是也让我有了一点感受&#xff0c;我在这里给大家分享一下。文章目录 1.当时遇到的问题2.解决方法3. 自己的…

什么是用户体验测试? 为什么很重要?

在当今数字化时代&#xff0c;用户体验(User Experience&#xff0c;简称UX)已经成为产品成功的关键因素之一。无论是应用程序、网站、硬件设备还是软件&#xff0c;提供出色的用户体验不仅能够吸引更多用户&#xff0c;还能够增加用户满意度&#xff0c;提高品牌忠诚度&#x…

残差网络ResNet

残差网络的提出,是为了解决深度学习中的退化问题。 退化问题指的是随着神经网络层数的增加&#xff0c;网络性能反而逐渐降低的现象。换句话说&#xff0c;当我们不断增加神经网络的层数时&#xff0c;神经网络的训练误差可能会持续下降&#xff0c;但是验证集误差却不断增加&…

全球发布|首个AI视角下的生态系统架构解读—《生态系统架构--人工智能时代从业者的新思维》重磅亮相!

点击可免费注册下载 &#x1f447; 人工智能时代的企业架构师必读系列 《生态系统架构--人工智能时代从业者的新思维》 Philip Tetlow、Neal Fishman、Paul Homan、Rahul著 The Open Group Press 2023年11月出版 这本书可以很好地帮助全球架构师使用人工智能来构建、开发和…

HarmonyOS基础组件的使用

ArkTS是HarmonyOS优选的主力应用开发语言。它在TypeScript&#xff08;简称TS&#xff09;的基础上&#xff0c;匹配ArkUI框架&#xff0c;扩展了声明式UI、状态管理等相应的能力&#xff0c;让开发者以更简洁、更自然的方式开发跨端应用。 HarmonyOS基础组件和Compose组件很相…

React事件处理

目录 前言 1. 添加事件处理函数 2. 传递参数 使用箭头函数 使用bind方法 3. 阻止默认行为和冒泡 阻止默认行为 阻止事件冒泡 4. 最佳实践 前言 React是一个流行的JavaScript库&#xff0c;用于构建用户界面。在React中&#xff0c;事件处理是非常重要的一部分&#xf…

基于springboot 的小小宠物领养平台的设计与实现

摘 要 社会经济正在不断进步和发展&#xff0c;互联网技术更新迭代之快超乎人们的想象&#xff0c;在线宠物领养系统是一种全新的方式。通过互联网可以搜索到任何东西&#xff0c;只要你输入关键字词&#xff0c;搜索引擎就会把对应的信息给搜索出来。喜欢宠物的人士需要有一…

Jetcache开启FASTJSON2序列化

为什么要用Jetcache JetCache是一个基于Java的缓存系统封装&#xff0c;它提供统一的API和注解来简化缓存的使用。JetCache比SpringCache更强大的注解&#xff0c;可以原生的支持TTL、两级缓存、分布式自动刷新&#xff0c;还提供了Cache接口用于手工缓存操作。 以前使用红薯…

MySQL 优化思路篇

MySQL 优化思路篇 1、MySQL 查询的优化步骤2、查询系统性能参数3、慢查询日志定位问题3.1、开启慢查询日志参数3.2、查看慢查询数目3.3、慢查询日志的分析工具 mysqldumpslow3.4、关闭慢查询日志3.5、慢查询日志的删除与重建 4、SHOW PROFILE &#xff1a;查看SQL执行成本 1、…

【每日OJ题—— 203. 移除链表元素(指针)】

每日OJ题——203. 移除链表元素&#xff08;指针&#xff09; 1.题目&#xff1a;203. 移除链表元素2.方法讲解2.1.解法一&#xff1a;2.1.1.图文分析2.1.2.代码实现2.1.3.提交结果展示 2.2.解法二&#xff1a;2.2.1.图文分析2.2.2.代码实现2.2.3.提交结果展示 1.题目&#xff…