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

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

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

相关文章:

  • 【C++入门 三】学习C++缺省参数 | 函数重载 | 引用
  • 视频增强修复软件Topaz Video AI mac中文版支持功能
  • C# 使用Thread类建线程
  • asyncio协程框架
  • TSINGSEE智慧安防:AI人员入侵检测算法的工作原理及应用场景概述
  • Python:PDF转长图像和分页图像
  • 第48天:内置对象方法、 前端基础之BOM和DOM
  • CMake系列EP02: 构建可执行程序和库
  • 比亚迪今年的薪资。。
  • 【OpenCV实现图像找到轮廓的不同特征,就像面积,周长,质心,边界框等等。】
  • 数仓建模—数仓建设概论
  • Docker dnmp 多版本php安装 php8.2
  • Distilling the Knowledge in a Neural Network【论文解析】
  • 基于深度学习的自动驾驶汽车语义分割与场景标注算法研究。
  • 国内可用超丝滑ChatGPT4.0(附网址及微信入口)
  • linux入门---线程的同步
  • UI设计一定不能错过的4款常用工具
  • JavaScript 基础 - 第2天
  • MyBatis和JDBC异同点
  • 关于yarn安装一些东西报错时的处理方法
  • datagrip 使用自定义参数
  • css实现平行四边形按钮
  • Jmeter只能做性能测试吗?
  • Jmeter调用测试片段 —— 模块控制器
  • 数组类型题目总结
  • 机器学习2:决策树--基于信息增益的ID3算法
  • centos7完全卸载和安装mysql8
  • 常用的解析XML的开源库
  • SQLITE3 函数接口
  • RISC-V IDE MRS无感远程协助模块详解