贵阳市网站建设公司,wordpress 去掉版权信息,家政服务网站建设方案,做论坛网站4g空间够不够用优维低代码技术专栏#xff0c;是一个全新的、技术为主的专栏#xff0c;由优维技术委员会成员执笔#xff0c;基于优维7年低代码技术研发及运维成果#xff0c;主要介绍低代码相关的技术原理及架构逻辑#xff0c;目的是给广大运维人提供一个技术交流与学习的平台。
优维… 优维低代码技术专栏是一个全新的、技术为主的专栏由优维技术委员会成员执笔基于优维7年低代码技术研发及运维成果主要介绍低代码相关的技术原理及架构逻辑目的是给广大运维人提供一个技术交流与学习的平台。
优维低代码实践连载第12期
《Context / State》
▽
在开发中有一项重要的工作是维护和管理我们的数据比如页面需要获取远端的数据进行渲染或者声明变量然后动态更新数据等这些都需要我们能提供一套声明和消费数据的机制。对此我们平台提供了 Context 和 State 两种数据的管理方式。
Context 为全局的状态数据在一个路由的页面周期中都有效作用域为整个路由范围内相当于我们的全局变量而 State 是局部的状态数据相当于我们的局部变量其只应用于模板的内部。同时引用的这些状态数据还能支持实时更新的能力这对于我们编排来说可谓是如虎添翼。
Context
context 通常声明在某一个路由下表示在该路由下可使用的变量我们来看一下 context 具体使用方式。
1.1 context 定义 上述图中我们发现 context 还有一些配置项分别是 ifonchangetrack和 provider 相关的 transform 和 onReject我们接下来详细说明下该配置项的用途。 1.2 配置详解
Context 级别的配置我们以 yaml 的配置形式来介绍。
1.2.1 basic settings
if 条件配置
可以配置 if 来按条件决定是否执行对应的 Context onChange
有时候我们希望声明一个 Context 变量但不对它立即赋值而是通过特定事件触发赋值并且希望能监听其变更事件。
可以在声明 Context 时定义 onChange, 然后在特定条件发生时再对其赋值当 Context 发生变化时onChange 注册的事件处理器将被调用。图中的EVENT.detail为该 Context 的值 track
依赖追踪也就是说当前 contextA 下有依赖的其他的contextB当 ContextB 变化后(通过 context.replace/context.refresh等) contextA 的值会重新计算。 1.2.2 Provider settings
transform/onReject
当 context 为 provider/contract 类型时针对该请求的返回可配置 transform, onReject 和 lazy 项
transform 顾名思义是对返回的接口做数据处理用而 OnReject 则对请求报错时额外做的特殊处理正常情况我们一般不会配置 OnReject因为系统会统一捕获并显示错误信息。 lazy
对于 provider 中的 lazy 项我们称之为懒加载。默认情况下我们的请求都会在页面加载前发起并会阻塞渲染但有些数据并不着急需要可能只需在特定条件下发起请求即可例如打开抽屉和弹窗。这时可以标记为 lazy: true 将它设置为懒加载该数据将不会默认发送请求需要在特定条件下主动触发 context.load /context.refresh 来发起请求。 1.2.3 PATH
PATH 的配置项是给 context 分组用的当一个路由管理的 context 很多时为了方便管理和查找我们可以给每一个 context 进行分类这样同一类下的 context 会放在同一目录下展示。 1.3 context 使用
当我们定义好 context 后就可以在编排中直接使用了在使用时需要加上 CTX 的前缀同时我们使用 context 的地方也支持了 track context 的能力只要在表达式前面添加一句 track context 构件的属性就能跟随 Context 变化而自动重新计算并赋值。 State
State 的能力和 Context 几乎完全一致不同的是Context 的作用域是整个页面、是全局的我们的自定义模板同一个模板在页面中可能有多个实例如果直接使用 Context则多个实例间的数据会互相影响。另外使用全局的 Context 也会破坏模板的封装削弱应用的可维护性并带来潜在的问题。
因此 State 正是为了解决这个问题它用于管理自定义模板内的数据其作用域是模板的实例多个模板实例之间的数据互相隔离。同时在能力上完全与 Context 对等。 State 的定义也和 Context 一致它只能在模板的页面中使用与 Context 不同的是 State 有属于自己的状态更新的 action它与 context 一一对应。
