alibaba/lowcode-engine

封装的低代码组件中数据源的dataHandler不执行

Opened this issue · 0 comments

Describe the bug (required) / 详细描述 bug(必填)

自己手写了一个低代码组件,然后通过 material.loadIncrementalAssets 方法注册之后,再组件库中可以显示,
代码如下:

material.loadIncrementalAssets({version: '', components: [
  {
	"devMode": "lowCode",
	"group": "低代码组件",
	"category": "默认分组",
	"priority": "99",
	"configure": {
		"supports": {
			"style": true,
			"className": true
		},
		"component": {}
	},
	"snippets": [{
		"schema": {
			"title": "测试请求数据源",
			"componentName": "LowCodeTestDataSource",
			"props": {}
		}
	}],
	"componentName": "LowCodeTestDataSource",
	"title": "测试请求数据源",
	"schema": {
		"id": "node_dockcviv8fo1",
		"componentName": "Component",
		"title": "",
		"props": {
			"ref": "outerView",
			"style": {}
		},
		"docId": "",
		"fileName": "/",
		"dataSource": {
			"list": [{
				"type": "axios",
				"id": "getUsers",
				"isInit": false,
				"dataSourceType": "API",
				"options": {
					"params": {},
					"method": "GET",
					"isCors": true,
					"timeout": 5000,
					"headers": {},
					"uri": "/lowcode-demo/users/getUsers"
				},
				"dataHandler": {
					"type": "JSFunction",
					"value": "(res) => {\n  return {\n    data: res?.data?.data?.records,\n    total: res?.data?.data?.total,\n  }\n}"
				}
			}]
		},
		"state": {
			"text": {
				"type": "JSExpression",
				"value": "\"刷新\""
			}
		},
		"css": "",
		"lifeCycles": {
			"componentDidMount": {
				"type": "JSFunction",
				"value": "function componentDidMount() {\n}",
				"source": "function componentDidMount() {\n}"
			},
			"componentWillUnmount": {
				"type": "JSFunction",
				"value": "function componentWillUnmount() {\n}",
				"source": "function componentWillUnmount() {\n}"
			}
		},
		"methods": {
			"queryDataSource": {
				"type": "JSFunction",
				"value": "function queryDataSource(event) {\n  // 点击按钮时的回调\n  console.log('请求数据源');\n  this.dataSourceMap['getUsers'].load({\n    current: 1,\n    pageSize: 10\n  }).then(res => {\n    console.log(res);\n  }).catch(error => {\n    console.log(error);\n  });\n}",
				"source": "function queryDataSource(event) {\n  // 点击按钮时的回调\n  console.log('请求数据源');\n  this.dataSourceMap['getUsers'].load({\n    current: 1,\n    pageSize: 10\n  }).then(res => {\n    console.log(res);\n  }).catch(error => {\n    console.log(error);\n  });\n}"
			}
		},
		"originCode": "class Page extends Component {\n  state = {\n    \"text\": \"刷新\",\n  }\n  componentDidMount() {}\n  componentWillUnmount() {}\n  queryDataSource(event) {\n    // 点击按钮时的回调\n    console.log('请求数据源');\n    this.dataSourceMap['getUsers'].load({\n      current: 1,\n      pageSize: 10\n    }).then(res => {\n      console.log(res);\n    }).catch(error => {\n      console.log(error);\n    });\n  }\n}",
		"hidden": false,
		"isLocked": false,
		"condition": true,
		"conditionGroup": "",
		"children": [{
			"componentName": "Button",
			"id": "node_oclttog5iy4",
			"props": {
				"type": "primary",
				"children": {
					"type": "JSExpression",
					"value": "this.state.text"
				},
				"ref": "button-ce457f19",
				"htmlType": "button",
				"size": "middle",
				"shape": "default",
				"block": false,
				"danger": false,
				"ghost": false,
				"disabled": false,
				"_unsafe_MixedSetter_children_select": "VariableSetter",
				"__events": {
					"eventDataList": [{
						"type": "componentEvent",
						"name": "onClick",
						"relatedEventName": "queryDataSource"
					}],
					"eventList": [{
						"name": "onClick",
						"template": "onClick(event,${extParams}){\n// 点击按钮时的回调\nconsole.log('onClick', event);}",
						"disabled": true
					}]
				},
				"onClick": {
					"type": "JSFunction",
					"value": "function(){return this.queryDataSource.apply(this,Array.prototype.slice.call(arguments).concat([])) }"
				}
			},
			"hidden": false,
			"title": "",
			"isLocked": false,
			"condition": true,
			"conditionGroup": ""
		}]
	}
  }
]})

在使用该低代码组件时,有报错
image

并且在点击组件中按钮的时候,根据打印的数据可以判断,数据源‘getUsers’的返回数据处理函数dataHandler没有起作用