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

news/2024/10/21 6:10:28/

最近在使用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.ppmy.cn/news/1192847.html

相关文章

jenkins实践篇(2)—— 自动打tag的可回滚发布模式

大家好&#xff0c;我是蓝胖子&#xff0c;在上一篇我简单介绍了如何基于特定分支做自动编译和发布&#xff0c;在生产环境中&#xff0c;为了更加安全和快速回滚&#xff0c;我采取的是通过对代码打tag的方式来进行部署&#xff0c;下面我将详细介绍整个发布过程的逻辑。 发布…

Spring Boot Web MVC

文章目录 一、Spring Boot Web MVC 概念二、状态码三、其他注解四、响应操作 一、Spring Boot Web MVC 概念 Spring Web MVC 是⼀个 Web 框架&#xff0c;一开始就包含在Spring 框架里。 1. MVC 定义 软件⼯程中的⼀种软件架构设计模式&#xff0c;它把软件系统分为模型、视…

Linux驱动——并发与竞态

并发 并发指多个执行单元同时、并行被执行&#xff0c;而并发执行单元对共享资源&#xff08;硬件资源和软件上的全局变量、静态变量等&#xff09;的访问很容易导致竞态。 如下列AB写&#xff0c;C读&#xff0c;AB在写的过程中&#xff0c;C读的话就会出错。 对称多处理器…

✔ ★【备战实习(面经+项目+算法)】 11.2学习

✔ ★【备战实习&#xff08;面经项目算法&#xff09;】 坚持完成每天必做如何找到好工作1. 科学的学习方法&#xff08;专注&#xff01;效率&#xff01;记忆&#xff01;心流&#xff01;&#xff09;2. 每天认真完成必做项&#xff0c;踏实学习技术 认真完成每天必做&…

Flutter屏幕适配

文章目录 一、Flutter单位二、设备信息三、常见适配方案四、flutter_screenutil 一、Flutter单位 Flutter使用的是类似IOS中的点pt&#xff08;point&#xff09;。 iPhone6的尺寸是375x667&#xff0c;分辨率为750x1334。 iPhone6的dpr( devicePixelRatio ) 是2.0。 DPR 物…

Tuna: Instruction Tuning using Feedback from Large Language Models

本文是LLM系列文章&#xff0c;针对《Tuna: Instruction Tuning using Feedback from Large Language Models》的翻译。 Tuna:使用来自大型语言模型的反馈的指令调优 摘要1 引言2 方法3 实验4 相关工作5 结论局限性 摘要 使用更强大的LLM&#xff08;如Instruction GPT和GPT-…

京东科技埋点数据治理和平台建设实践 | 京东云技术团队

导读 本文核心内容聚焦为什么要埋点治理、埋点治理的方法论和实践、奇点一站式埋点管理平台的建设和创新功能。读者可以从全局角度深入了解埋点、埋点治理的整体思路和实践方法&#xff0c;落地的埋点工具和创新功能都有较高的实用参考价值。遵循埋点治理的方法论&#xff0c;…

01【保姆级】-GO语言特点 下载安装 hello

01-GO语言基本概念和安装使用 一、概念1.1 Go语言的诞生1.2 GO语言的特点&#xff1a; 二、安装go2.1 安装2.2 安装环境变量 三、下载&安装goland3.1 官网下载3.2 下载后&#xff0c;进行安装&#xff1a; 四、Go语言的特性&#xff08;重点&#xff09;4.1 第一个hello wo…