add doc
This commit is contained in:
		| @@ -8,4 +8,6 @@ dooringx-lib 的事件是在eventCenter上,它上面会集成functionCenter与 | ||||
|  | ||||
| 在eventCenter中可以获取组件注册的时机。时机类似于组件生命周期一样,可以注册后在对应的时机进行调用。 | ||||
|  | ||||
| 而functionCenter中的函数则会与时机结合,再由事件链对用户设定的队列进行统一处理。 | ||||
| 而functionCenter中的函数则会与时机结合,再由事件链对用户设定的队列进行统一处理。 | ||||
|  | ||||
| 每个事件链在执行中会有上下文对象,这个对象会贯穿这个事件链。 | ||||
| @@ -98,4 +98,6 @@ function MInput(props: MInputProps) { | ||||
|  | ||||
| 由于可以很轻松的拿到store,所以可以在任意地方进行修改数据。 | ||||
|  | ||||
| 将组件的value关联current的属性,onChange去修改store,这样就完成了个双向绑定。 | ||||
| 将组件的value关联current的属性,onChange去修改store,这样就完成了个双向绑定。 | ||||
|  | ||||
| 注意:如果你的右侧组件需要用到block以外的属性,可能需要去判断是否处于弹窗模式。 | ||||
| @@ -1,5 +1,135 @@ | ||||
| --- | ||||
| title: 函数开发 | ||||
| title: 函数 | ||||
| sTitle: dooringx-lib插件开发 | ||||
| order: 16 | ||||
| --- | ||||
| --- | ||||
|  | ||||
|  | ||||
| ## 函数导入 | ||||
|  | ||||
| 函数导入做成对象置入initFunctionMap即可 | ||||
|  | ||||
| ```js | ||||
| initFunctionMap: functionMap, | ||||
| ``` | ||||
|  | ||||
| ## 函数开发 | ||||
|  | ||||
|  | ||||
| 键名会显示出来所以键名是唯一的。 | ||||
|  | ||||
| 它的值是2个对象,一个是函数内容fn,一个是配置项config。 | ||||
|  | ||||
| config中的数组里每个配置会显示出来让用户去配置,name则是展示名字,data代表数据去哪里获取,可以选择从输入框(input),数据源(dataSource),上下文(ctx)中获取,另外还有个特殊的弹窗(modal)。 | ||||
|  | ||||
| options中的receive表示会从args哪个键上获取该值。 | ||||
|  | ||||
| multi代表是否允许多个选项配置。 | ||||
|  | ||||
| dooringx-lib中写好了2个函数changeUserValue与changeUserValueRecord,第一个函数会将得到的结果做成数组,如果非multi则取第一个结果就行。而第二个函数会将结果做成对象,比如用户在数据源中选了keya,那么就会把数据源的键值对作为个对象返回。 | ||||
|  | ||||
|  | ||||
| fn中,第一个ctx参数代表上下文,如果有转换函数之类,可能需要使用(比如要把第一个函数的结果导给后面的函数) | ||||
|  | ||||
| 第二个参数next是需要运行完毕后执行的,否则事件链会一直在该函数中不退出。 | ||||
|  | ||||
| 第三个参数config就可以拿到整个config对象。 | ||||
|  | ||||
| 第四个参数args是用户填写的参数,会根据options里填写的字段进行返回。 | ||||
|  | ||||
| 第五个是eventList,可以获取整个事件链的参数。 | ||||
|  | ||||
| 第六个参数iname可以拿到用户的选择项。 | ||||
|  | ||||
|  | ||||
| ```js | ||||
|  通用GET请求函数: { | ||||
|     fn: (ctx, next, config, args, _eventList, iname) => { | ||||
|       console.log(args, '参数x'); | ||||
|       const userSelect = iname.data; | ||||
|       const urlVal = changeUserValue( | ||||
|         userSelect['请求url'], | ||||
|         args, | ||||
|         '_url', | ||||
|         config, | ||||
|         ctx | ||||
|       ); // input datasource ctx //datasource会去取值 ,ctx取ctx上字段 | ||||
|       const paramSource = changeUserValueRecord( | ||||
|         // 设定只能从datasource或者ctx里取 | ||||
|         userSelect['请求参数'], | ||||
|         args, | ||||
|         '_origin', | ||||
|         config, | ||||
|         ctx | ||||
|       ); | ||||
|       const ctxVal = changeUserValue( | ||||
|         userSelect['返回上下文字段'], | ||||
|         args, | ||||
|         '_ctx', | ||||
|         config, | ||||
|         ctx | ||||
|       ); | ||||
|       // 检查参数是否存在 | ||||
|       // 都是数组,非multi则取第一个。 | ||||
|       const url = urlVal[0]; | ||||
|       if (!url) { | ||||
|         return next(); | ||||
|       } | ||||
|       const ctxKey = ctxVal[0]; | ||||
|  | ||||
|       axios | ||||
|         .get(url, { | ||||
|           params: { | ||||
|             ...paramSource, | ||||
|           }, | ||||
|         }) | ||||
|         .then((res) => { | ||||
|           const data = res.data; | ||||
|           ctx[ctxKey] = data; | ||||
|           next(); | ||||
|         }) | ||||
|         .catch((e) => { | ||||
|           console.log(e); | ||||
|           next(); | ||||
|         }); | ||||
|     }, | ||||
|     config: [ | ||||
|       { | ||||
|         name: '请求url', | ||||
|         data: ['dataSource', 'ctx', 'input'], | ||||
|         options: { | ||||
|           receive: '_url', | ||||
|           multi: false, | ||||
|         }, | ||||
|       }, | ||||
|       { | ||||
|         name: '请求参数', | ||||
|         data: ['dataSource', 'ctx'], | ||||
|         options: { | ||||
|           receive: '_origin', | ||||
|           multi: true, | ||||
|         }, | ||||
|       }, | ||||
|       { | ||||
|         name: '返回上下文字段', | ||||
|         data: ['input'], | ||||
|         options: { | ||||
|           receive: '_ctx', | ||||
|           multi: false, | ||||
|         }, | ||||
|       }, | ||||
|     ], | ||||
|   }, | ||||
| ``` | ||||
|  | ||||
| ## 时机与函数装载 | ||||
|  | ||||
| 如果有需要,一般使用: | ||||
|  | ||||
|  ```js | ||||
|  	eventCenter.manualUpdateMap(cur, displayName, arr); | ||||
|  ``` | ||||
|  | ||||
|  manualUpdateMap第一个是时机名,第二个是展示名,第三个是用户选择。 | ||||
|  | ||||
|  更新事件中心后还需要更新store,结果以store为准。 | ||||
|   | ||||
		Reference in New Issue
	
	Block a user
	 hufeixiong
					hufeixiong