状态管理模型优化方法、装置、电子设备及可读存储介质制造方法及图纸

本申请提供了一种状态管理模型优化方法、装置、电子设备及可读存储介质，涉及计算机技术领域。该方法包括：将目标项目分为包括Store类的Stores层、包括用于指示交互逻辑的Action类的Action层、包括组件的Views层，不同层对应的存储范围不同，Store类中包括属性文件，Action类中包括至少一个Action函数；根据接收到的修改操作，对修改操作对应的目标文件进行修改，其中，目标文件为修改操作指定的属性文件或Action函数。如此，通过将项目分层，不同层对应不同的存储范围，便于管理，并且在需要进行修改时，可缩小查找范围，从相应的存储范围查找出要修改的文件。查找出要修改的文件。查找出要修改的文件。

【技术实现步骤摘要】
状态管理模型优化方法、装置、电子设备及可读存储介质


[0001]本申请涉及计算机
，具体而言，涉及一种状态管理模型优化方法、装置、电子设备及可读存储介质。

技术介绍

[0002]React是由Facebook研发的用于构建用户界面的JavaScript库，可以构建管理自身状态的封装组件，然后对组件进行组合以构成复杂的UI(User Interface，用户界面)。组件中的状态是指能驱动应用的数据，组件除了可以维护组件内部的状态数据(通过this.state访问)以外，还可以使用组件外部的数据(通过this.props访问)。当组件的状态数据改变的时候，React能够高效更新并渲染合适的组件，从而达到页面快速响应的效果。
[0003]但是单靠React自身的能力是无法满足现在复杂应用的需求的。虽然React能够管理一部分状态数据，但是随着应用开发日趋复杂，需要管理的状态数据也越来越多。这些状态数据可能包括服务器响应结果、缓存数据、UI状态、页面标记等。而且同一个状态数据，可能在多个组件中使用，这又涉及父子组件，兄弟组件，以及不相邻组件间的数据传递，对于以树状结构构成的React应用来说，兄弟组件，以及不相邻组件间的数据传递是困难且十分影响性能的。
[0004]由上可知，React需要引入专门的状态管理工具。该工具需要能够管理全局使用的状态，使数据的传递变得更加便利；同时也能够像React组件自身状态那样，当某个全局状态改变，对应使用该状态的组件也会触发更新。MobX就是现存的状态管理工具之一。r/>[0005]MobX的一大特点是非常的灵活，状态数据及交互逻辑可随处定义。但是，灵活也意味着随意，MobX的各种代码散落在项目各处，无法实现统一管理，不便于对状态数据文件或者交互逻辑进行修改。

技术实现思路

[0006]本申请实施例提供了一种状态管理模型优化方法、装置、电子设备及可读存储介质，其通过将项目分为Stores、Action、Views层，不同层对应不同的存储范围，便于管理，并且在需要进行修改时，可从相应的存储范围查找出要修改的文件，该方式可缩小查找范围。
[0007]本申请的实施例可以这样实现：
[0008]第一方面，本申请实施例提供一种状态管理模型优化方法，所述方法包括：
[0009]将目标项目分为Stores、Action、Views层，其中，不同层对应的存储范围不同，Stores层中包括Store类，所述Store类中包括属性文件，所述Action层包括用于指示交互逻辑的Action类，所述Action类中包括至少一个Action函数，所述Views层中包括组件；
[0010]根据接收到的修改操作，对所述修改操作对应的目标文件进行修改，其中，所述目标文件为所述修改操作指定的属性文件或Action函数。
[0011]第二方面，本申请实施例提供一种状态管理模型优化装置，所述装置包括：
[0012]分层模块，用于将目标项目分为Stores、Action、Views层，其中，不同层对应的存
储范围不同，Stores层中包括Store类，所述Store类中包括属性文件，所述Action层包括用于指示交互逻辑的Action类，所述Action类中包括至少一个Action函数，所述Views层中包括组件；
[0013]修改模块，用于根据接收到的修改操作，对所述修改操作对应的目标文件进行修改，其中，所述目标文件为所述修改操作指定的属性文件或Action函数。
[0014]第三方面，本申请实施例提供一种电子设备，包括处理器和存储器，所述存储器存储有能够被所述处理器执行的机器可执行指令，所述处理器可执行所述机器可执行指令以实现前述实施方式所述的状态管理模型优化方法。
[0015]第四方面，本申请实施例提供一种可读存储介质，其上存储有计算机程序，所述计算机程序被处理器执行时实现如前述实施方式所述的状态管理模型优化方法。
[0016]本申请实施例提供的状态管理模型优化方法、装置、电子设备及可读存储介质，将目标项目分为Stores、Action、Views层，其中，不同层对应的存储范围不同，Stores层中包括Store类，所述Store类中包括属性文件，所述Action层包括用于指示交互逻辑的Action类，所述Action类中包括至少一个Action函数，所述Views层中包括组件；根据接收到的修改操作，对所述修改操作对应的目标文件进行修改，其中，所述目标文件为所述修改操作指定的属性文件或Action函数。如此，通过分层，便于对目标项目进行管理；当需要修改文件时，可从文件所属层对应的存储范围中查找相应的文件，进而进行修改，该方式可缩小查询范围，便于快速完成对状态数据文件或者交互逻辑的修改。
附图说明
[0017]为了更清楚地说明本申请实施例的技术方案，下面将对实施例中所需要使用的附图作简单地介绍，应当理解，以下附图仅示出了本申请的某些实施例，因此不应被看作是对范围的限定，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他相关的附图。
[0018]图1为Mobx的工作流程图；
[0019]图2为用户交互触发Action事件的流程图；
[0020]图3为常见的MobX结构示意图；
[0021]图4为本申请实施例提供的电子设备的方框示意图；
[0022]图5为本申请实施例提供的状态管理模型优化方法的流示意图之一；
[0023]图6为本申请实施例提供的状态管理模型优化方法的流示意图之二；
[0024]图7为本申请实施例提供内的单一数据源结构示意图；
[0025]图8为本申请实施例提供的状态管理模型优化方法的流示意图之三；
[0026]图9为图8中步骤S150包括的子步骤的流程示意图；
[0027]图10为本申请实施例提供的状态管理模型优化方法的流示意图之四；
[0028]图11为本申请实施例提供的状态管理模型优化装置的方框示意图之一；
[0029]图12为本申请实施例提供的状态管理模型优化装置的方框示意图之二；
[0030]图13为本申请实施例提供的状态管理模型优化装置的方框示意图之三。
[0031]图标：100
‑
电子设备；110
‑
存储器；120
‑
处理器；130
‑
通信单元；200
‑
状态管理模型优化装置；210
‑
分层模块；220
‑
数据源生成模块；230
‑
修改模块；240
‑
实例化模块。
具体实施方式
[0032]为使本申请实施例的目的、技术方案和优点更加清楚，下面将结合本申请实施例中的附图，对本申请实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例是本申请一部分实施例，而不是全部的实施本文档来自技高网...

【技术保护点】

【技术特征摘要】
中任意一项所述的状态管理模型优化方法。10.一种可读存储介质，其上存储有计算机程序，其特征在于，所述计算机程序被...

【专利技术属性】
技术研发人员：张苗，
申请(专利权)人：北京知道创宇信息技术股份有限公司，
类型：发明
国别省市：