组件状态的改变方法及装置与流程

文档序号:35344003发布日期:2023-09-07 16:56阅读:45来源:国知局
组件状态的改变方法及装置与流程

本申请涉及it应用,具体涉及一种组件状态的改变方法及装置。


背景技术:

1、react是一个用于构建用户界面的javascript库,是用javascript构建快速响应的大型web应用程序的首选方式之一。

2、在react中,可以将页面中每个部分分成每一个独立的小模块,每个小模块就是组件,这些组件可以互相组合和嵌套,就组成每一个页面。由于经常会有组件间的调用,嵌套组件间存在数据的传递。因此,我们在使用react的过程中,经常会遇到组件间数据的传递问题。组件传递问题中,有父子组件传递信息、兄弟组件传递信息。其中父子组件信息传递包括上下级单层数据传递和上下级嵌套多层数据传递。兄弟组件信息传递,指的是在任意没有嵌套关系的两个或多个组件间传递信息。

3、现有技术一般通过以下两种方法进行组件间的信息传递:

4、1.用props和函数调用方式。该方法使用于单层的父子组件调用。在调用过程中分为子组件传递数据给父组件和父组件传递数据给子组件。传递过程如下:

5、父组件传递数据给子组件的时候,是在父组件的render渲染函数中,加上属性和属性值,在子组件的props中可以获取属性和属性值。由此从父组件传递信息到子组件。子组件传递数据给父组件的时候,在组件的render渲染函数中,父组件和子组件分别加上调用的函数,用bind来绑定函数的对象,使函数对象指向组件本身。子组件的调用函数bind绑定的对象是子组件自己,并把子组件里面需要传递的数据用参数的形式传递给父组件。由此,子组件可以把自己的值传递给父组件。

6、此方法简单易用,不过当多层组件嵌套的时候,尤其是跨多层传递的时候,需要逐层传递,来满足跨层的需求,会多很累赘的操作,因此仅适合简单的组件的单层调用。

7、2.用redux的方式。redux解决的是react组件之间通信以及项目的状态变量的保存问题。如果不使用redux,随着项目的越来越大,组件之间通信越来越复杂,组件的状态越来越多,项目将越来越难以维护。使用redux之后,项目的状态都保存到store之中,各个组件可以直接从store之中获取到自己需要的状态,如果需要改变store中的状态,redux也提供了dispatch方法,组件可以dispatch一个action,根据action的type属性,reducer会对状态做出变化并把结果返回给store,就可以把状态传递给需要的组件了。

8、对于比较复杂的组件间的调用,一般使用redux。不过,redux增加了项目的复杂度,提供一套严格的数据传递路径,提出了各种不易理解的概念和模块(store、action、reducer、数据不可直接修改、纯函数),api对开发者极度不友好。


技术实现思路

1、本申请实施例提供一种组件状态的改变方法,用以解决任意组件间数据间的传递的技术问题。

2、第一方面,本申请实施例提供一种组件状态的改变方法,包括:

3、第一组件调用全局公共函数,将所述第一组件存储在所述全局公共函数内;

4、第二组件调用所述全局公共函数,获取所述第一组件;

5、所述第一组件在所述第二组件中改变所述第一组件的状态。

6、在一个实施例中,所述公共函数包括:全局map对象、存储组件和获取方法。

7、在一个实施例中,所述第一组件调用全局公共函数,将所述第一组件存储在所述全局公共函数内,包括:

8、所述第一组件调用全局公共函数,继承所述全局公共函数中的所述存储组件;

9、所述第一组件根据所述存储组件的功能,将所述第一组件存储在所述全局map对象内。

10、在一个实施例中,所述第二组件调用所述全局公共函数,获取所述第一组件,包括:

11、所述第二组件调用所述全局公共函数,并调取所述全局公共函数中的所述获取方法;

12、所述第二组件根据所述获取方法,在所述全局map对象中获取所述第一组件。

13、在一个实施例中,所述将所述第一组件存储在所述全局map对象内,包括:

14、以键值对key value的形式将所述第一组件存储在所述全局map对象内;

15、其中,key为所述第一组件的名称,value为所述第一组件。

16、在一个实施例中,所述第一组件在所述第二组件中改变所述第一组件的状态,包括:

17、所述第一组件在所述第二组件中,根据所述第一组件的setstate方法,改变所述第一组件的状态。

18、第二方面,本申请实施例提供一种组件状态的改变装置,包括:

19、存储模块,用于第一组件调用全局公共函数,将所述第一组件存储在所述全局公共函数内;

20、获取模块,用于第二组件调用所述全局公共函数,获取所述第一组件;

21、改变模块,用于所述第一组件在所述第二组件中改变所述第一组件的状态。

22、在一个实施例中,所述公共函数包括:全局map对象、存储组件和获取方法。

23、第三方面,本申请实施例提供一种电子设备,包括处理器和存储有计算机程序的存储器,所述处理器执行所述程序时实现第一方面所述的组件状态的改变方法。

24、第四方面,本申请实施例提供一种计算机程序产品,包括计算机程序,所述计算机程序被处理器执行时实现第一方面所述的组件状态的改变方法。

25、本申请实施例提供的组件状态的改变方法、装置、电子设备以及计算机程序产品,通过采用公共函数作为中介来传递数据,只要被调组件存入公共函数,其他组件就能通过引入公共函数并获取到里面的被调组件,不受组件间是否是父子嵌套关系,还是平级兄弟组件的影响。用简单的原理,少量的代码,达到任意组件间包括任意兄弟组件和父子组件间可以互相两两传递数据的效果。



技术特征:

1.一种组件状态的改变方法,其特征在于,包括:

2.根据权利要求1所述的组件状态的改变方法,其特征在于,所述公共函数包括:全局map对象、存储组件和获取方法。

3.根据权利要求2所述的组件状态的改变方法,其特征在于,所述第一组件调用全局公共函数,将所述第一组件存储在所述全局公共函数内,包括:

4.根据权利要求3所述的组件状态的改变方法,其特征在于,所述第二组件调用所述全局公共函数,获取所述第一组件,包括:

5.根据权利要求4所述的组件状态的改变方法,其特征在于,所述将所述第一组件存储在所述全局map对象内,包括:

6.根据权利要求5所述的组件状态的改变方法,其特征在于,所述第一组件在所述第二组件中改变所述第一组件的状态,包括:

7.一种组件状态的改变装置,其特征在于,包括:

8.根据权利要求7所述的组件状态的改变装置,其特征在于,所述公共函数包括:全局map对象、存储组件和获取方法。

9.一种电子设备,包括处理器和存储有计算机程序的存储器,其特征在于,所述处理器执行所述计算机程序时实现权利要求1至6任一项所述的组件状态的改变方法。

10.一种计算机程序产品,包括计算机程序,其特征在于,所述计算机程序被处理器执行时实现如权利要求1至6任一项所述的组件状态的改变方法。


技术总结
本申请提供一种组件状态的改变方法及装置,涉及IT应用技术领域。所述方法包括:第一组件调用全局公共函数,将所述第一组件存储在所述全局公共函数内;第二组件调用所述全局公共函数,获取所述第一组件;所述第一组件在所述第二组件中改变所述第一组件的状态。本申请实施例提供的组件状态的改变方法及装置,通过采用公共函数作为中介来传递数据,只要被调组件存入公共函数,其他组件就能通过引入公共函数并获取到里面的被调组件,不受组件间是否是父子嵌套关系,还是平级兄弟组件的影响。用简单的原理,少量的代码,达到任意组件间包括任意兄弟组件和父子组件间可以互相两两传递数据的效果。

技术研发人员:邓丽春,周双
受保护的技术使用者:中移信息技术有限公司
技术研发日:
技术公布日:2024/1/15
网友询问留言 已有0条留言
  • 还没有人留言评论。精彩留言会获得点赞!
1