博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
开发移动端react组件datepicker的总结与教训
阅读量:6719 次
发布时间:2019-06-25

本文共 734 字,大约阅读时间需要 2 分钟。

背景

前一阵,应公司的需求,需要一个在移动端运行的react组件datepicker(选择日期)。

搜索查找过后,我并没有找到一个既轻量级简洁又满足需求的组件。大部分现成的日期选择器都是相对于pc端开发的。

思考过后变决定自己写一套移动端react日期选择器组件。

过程

开发过程中并没有什么阻碍,功能完成后,经过了一系列单元测试,便发布出去了,旧版如图:

图片描述

  • 允许用户修改背景,字体,按钮颜色。

  • 允许用户上下滑动日期(但每日滑动仅限修改一个日期)

这个2.xx版本的日期选择器,简单粗暴,一经发布就得到了广泛的吐槽。

吐槽的内容有:

  • 样式丑陋

  • 配置选项太少,无论怎么调颜色都很丑

  • 修改的日期不方便

教训

经过大量参考其他日期选择器的样式以及配置选项后,我发现用户想要的并不是自己控制组件的背景,文字颜色,而是需要一个已经配置好并符合常规,优雅的日期选择器。用户希望有现成的好看并且主流的样式,而不是自己编写样式。

于是乎,在3.xx的版本中,预定义了5个主题供用户来选择,如图:

default

图片描述

dark

图片描述

ios

图片描述

android

图片描述

android-dark

图片描述

为了满足更多的需求,优化后的组件添加了其他的一些配置项,如让用户自定义显示的日期格式,如图:

图片描述

之前上下滑动组件只能一个一个修改日期,优化后滑动日期的范围更加广泛。

2.xx版本:

图片描述

新版本:

图片描述

总结

经过这次开发的教训,我明白了开发一个好的组件,并不应该急于求成求,想当然的只完成单一情况的需求。

而应该从用户的角度出发,提高组件的易用性与灵活性。同时感谢吐槽与批评我的开发者,正因为有这些人的融入,才能让每一个前端组件不断的完善,为我们所用。最后,诚挚邀请大家pull requests代码。不断完善国内的前端大业。

转载地址:http://cijmo.baihongyu.com/

你可能感兴趣的文章
嵌入式Linux下Camera编程--V4L2【转】
查看>>
算法(Algorithms)第4版 练习 1.3.25 1.3.24
查看>>
(三)Controller接口控制器详解(一)
查看>>
0328复利软件4.0测试
查看>>
git 回滚操作
查看>>
背包问题初探
查看>>
野生前端的数据结构基础练习(4)——字典
查看>>
***UML类图几种关系的总结
查看>>
【BZOJ 1056 1862】排名系统
查看>>
AI入门丨开源学习资源推荐
查看>>
观书有感(摘自12期CSDN)
查看>>
UWP VirtualizedVariableSizedGridView 支持可虚拟化可变大小Item的View(一)
查看>>
shell脚本中的整数测试
查看>>
Struts2工作流程
查看>>
nginx配置访问密码,让用户输入用户名密码才能访问
查看>>
一个函数证明题
查看>>
linux-vi命令
查看>>
JAVA:Eclipse代码自动提示
查看>>
LeetCode191-位1的个数(题目有问题)
查看>>
浅谈Java代理一:JDK动态代理-Proxy.newProxyInstance
查看>>