[发明专利]基于ReactNative的日期选择模态组件开发方法及相关设备

说明书

本申请实施例属于研发管理领域，涉及一种基于ReactNative的日期选择模态组件开发方法，包括通过ReactNative配置日期选择模态组件，并设置所述日期选择模态组件的样式布局；配置日期数据，将所述日期数据绑定至所述日期选择模态组件中；接收到从所述日期数据中选择的日期，对选中的日期进行记录并回调。本申请还提供一种基于ReactNative的日期选择模态组件开发相关设备。此外，本申请还涉及区块链技术，选中的日期可存储于区块链中。本申请可以实现日期选择模态组件在不同平台上样式的统一，提高开发效率，降低时间和工作成本。

技术领域

本申请涉及研发管理技术领域，尤其涉及一种基于ReactNative的日期选择模态组件开发方法及相关设备。

背景技术

ReactNative是目前比较流行的一种移动端混合框架，在移动端用的比较多，由于其可以在Android、iOS、H5、小程序等平台直接使用，有着强大的跨平台特性。但是，ReactNative官方提供的日期选择器在Android和iOS上呈现的视觉样式不统一，不能满足实际需求。

由于现有的日期选择器基本都是基于Android和iOS原生而开发，再由ReactNative去通过桥接方法调用，大大降低了ReactNative的开发效率；此外，通过桥接方法调用，就意味着Android和iOS得分别去集成对应的日期选择器，增加了时间和工作成本，造成开发人员的工作负担。

发明内容

本申请实施例的目的在于提出一种基于ReactNative的日期选择模态组件开发方法及相关设备，以解决相关技术中日期选择器在不同平台呈现的视觉样式不一样，且需要通过桥接方进行调用，降低了开发效率的问题。

为了解决上述技术问题，本申请实施例提供一种基于ReactNative的日期选择模态组件开发方法，采用了如下所述的技术方案：

通过ReactNative配置日期选择模态组件，并设置所述日期选择模态组件的样式布局；

配置日期数据，将所述日期数据绑定至所述日期选择模态组件中；

接收到从所述日期数据中选择的日期，对选中的日期进行记录并回调。

进一步的，所述设置所述日期选择模态组件的样式布局的步骤包括：

定义所述日期选择模态组件的属性，并设置列表控件；

将所述列表控件配置于所述属性的下部，形成所述样式布局。

进一步的，所述配置日期数据的步骤包括：

确定年份为闰年，配置所述闰年的二月份的天数；

确定所述年份为平年，配置所述平年的二月份的天数；

按照预设规则为除二月份之外的其他月份，配置与月份对应的天数。

进一步的，所述将所述日期数据绑定至所述日期选择模态组件中的步骤包括：

将所述日期数据更新到所述日期选择模态组件中；

将所述日期数据绑定至所述列表控件。

进一步的，所述将所述日期数据绑定至所述列表控件的步骤包括：

将年份数据绑定至第一列表控件，并将所述年份数据从当前年份进行倒叙排列；

将月份数据和日数据依次绑定至第二列表控件和第三列表控件，并将所述月份数据和日数据进行顺序排列。

进一步的，所述接收到从所述日期数据中选择的日期，对选中的日期进行记录并回调的步骤包括：

设置所述列表控件的滚动距离，按照所述滚动距离滚动所述列表控件进行日期选择，记录选中的日期；