alibaba
如何获取高级表单上的输入值
点确定时， 如何拿到表单上的值？？
我通过ref拿到了这个表单， 但打印出来， 没看到相应的数据 console.log(this.$("pro-form-entrylaafb6rh"))
this.$("pro-form-entrylaafb6rh").value也是空的。
你好 @huangapple，由于缺乏必要的信息（如 bug 重现步骤、引擎版本信息 等），无法定位问题，请按照 issue bug 模板 补全信息，也可以通过阅读引擎的 issue 说明 了解什么类型的 issue 可以获得更好、更快的支持。
![github-actions[bot] avatar](https://avatars.githubusercontent.com/in/15368?v=4 "Published by a pub.dev verified publisher"){kind=small}
Describe the bug (required) / 详细描述 bug（必填）
高级表单上的输入值要如何获取
To Reproduce (required) / 如何复现 bug？（必填，非常重要）
Steps to reproduce the behavior: / 详细复现步骤：
打包官方 demo 网站： https://lowcode-engine.cn/demo/index.html
导入以下 schema
{ "componentName": "Page", "id": "node_dockcviv8fo1", "props": { "ref": "outerView", "style": { "height": "100%" } }, "fileName": "/", "dataSource": { "list": [ { "type": "fetch", "isInit": true, "options": { "params": {}, "method": "GET", "isCors": true, "timeout": 5000, "headers": {}, "uri": "mock/info.json" }, "id": "info", "shouldFetch": { "type": "JSFunction", "value": "function() { \n console.log('should fetch.....');\n return true; \n}" } } ] }, "css": "body {\n font-size: 12px;\n}\n\n.button {\n width: 100px;\n color: #ff00ff\n}", "originCode": "class LowcodeComponent extends Component {\n state = {\n \"text\": \"outer\",\n \"isShowDialog\": false\n }\n componentDidMount() {\n console.log('did mount');\n }\n componentWillUnmount() {\n console.log('will unmount');\n }\n testFunc() {\n console.log('test func');\n }\n onClick() {\n this.setState({\n isShowDialog: true\n })\n }\n closeDialog() {\n this.setState({\n isShowDialog: false\n })\n }\n\n\tonClick_new(){\n alert(\"点击按钮\")\n console.log(this.$(\"pro-form-entrylag7ephk\"))\n console.log(this.$(\"pro-form-entrylag7ephk\").value)\n\t}\n}", "title": "", "isLocked": false, "condition": true, "conditionGroup": "", "state": { "text": { "type": "JSExpression", "value": "\"outer\"" }, "isShowDialog": { "type": "JSExpression", "value": "false" } }, "methods": { "testFunc": { "type": "JSFunction", "value": "function testFunc() {\n console.log('test func');\n}" }, "onClick": { "type": "JSFunction", "value": "function onClick() {\n this.setState({\n isShowDialog: true\n });\n}" }, "closeDialog": { "type": "JSFunction", "value": "function closeDialog() {\n this.setState({\n isShowDialog: false\n });\n}" }, "onClick_new": { "type": "JSFunction", "value": "function onClick_new() {\n alert(\"点击按钮\");\n console.log(this.$(\"pro-form-entrylag7ephk\"));\n console.log(this.$(\"pro-form-entrylag7ephk\").value);\n}" } }, "lifeCycles": { "componentDidMount": { "type": "JSFunction", "value": "function componentDidMount() {\n console.log('did mount');\n}" }, "componentWillUnmount": { "type": "JSFunction", "value": "function componentWillUnmount() {\n console.log('will unmount');\n}" } }, "children": [ { "componentName": "NextPage", "id": "node_ockzs2vw431", "props": { "headerDivider": true, "minHeight": "100vh", "presetNav": true, "presetAside": true, "footer": false, "nav": false, "aside": false, "placeholderStyle": { "gridRowEnd": "span 1", "gridColumnEnd": "span 12" }, "headerProps": { "background": "surface" }, "header": { "type": "JSSlot", "value": [ { "componentName": "NextPageHeader", "id": "node_ockzs2vw433", "props": {}, "title": "页面头部", "isLocked": false, "condition": true, "conditionGroup": "", "children": [ { "componentName": "NextRowColContainer", "id": "node_ockzs2vw434", "props": { "rowGap": 20, "colGap": 20 }, "title": "行列容器", "isLocked": false, "condition": true, "conditionGroup": "", "children": [ { "componentName": "NextRow", "id": "node_ockzs2vw435", "props": {}, "title": "行", "isLocked": false, "condition": true, "conditionGroup": "", "children": [ { "componentName": "NextCol", "id": "node_ockzs2vw436", "props": { "colSpan": 1 }, "title": "列", "isLocked": false, "condition": true, "conditionGroup": "", "children": [ { "componentName": "NextP", "id": "node_ockzvfoetv17", "props": { "wrap": false, "type": "body2", "verAlign": "middle", "textSpacing": true, "align": "left" }, "docId": "dockzvfoetv", "title": "段落", "isLocked": false, "condition": true, "conditionGroup": "", "children": [ { "componentName": "NextText", "id": "node_ockzvfoetv18", "props": { "type": "h5", "children": { "type": "JSExpression", "value": "this.state.info?.info", "mock": "标题标题" }, "mark": false, "code": false, "delete": false, "underline": false, "strong": false }, "docId": "dockzvfoetv", "title": "", "isLocked": false, "condition": true, "conditionGroup": "" } ] } ] } ] } ] } ] } ], "title": "header" }, "isTab": false, "contentAlignCenter": false, "contentProps": { "style": { "background": "rgba(255,255,255,0)" } }, "ref": "nextpage-00ef7a14" }, "title": "页面", "isLocked": false, "condition": true, "conditionGroup": "", "children": [ { "componentName": "NextBlock", "id": "node_oclag7emmwj", "props": { "placeholderStyle": { "height": "100%" }, "noPadding": false, "noBorder": false, "title": "区域标题", "rowGap": 20, "colGap": 20, "background": "surface", "layoutmode": "O", "strict": true, "colSpan": 12, "rowSpan": 1, "mode": "transparent", "childTotalColumns": 12 }, "title": "区域", "isLocked": false, "condition": true, "conditionGroup": "", "children": [ { "componentName": "NextBlockCell", "id": "node_oclag7emmwk", "props": { "colSpan": 12, "rowSpan": 1, "mode": "procard", "isAutoContainer": true, "title": "高级表单", "hasDivider": true, "loading": false, "bodyPadding": "", "hasCollapse": false, "text": true, "visibleButtonCount": 3, "operationConfig": { "align": "center" }, "operations": [], "ref": "nextblockcell-3550b9fc" }, "title": "", "isLocked": false, "condition": true, "conditionGroup": "", "children": [ { "componentName": "NextRowColContainer", "id": "node_oclag7emmwl", "props": { "rowGap": 20, "colGap": 20, "ref": "nextrowcolcontainer-668783e6" }, "title": "行列容器", "isLocked": false, "condition": true, "conditionGroup": "", "children": [ { "componentName": "NextRow", "id": "node_oclag7emmwm", "props": { "ref": "nextrow-836dcfbf" }, "title": "行", "isLocked": false, "condition": true, "conditionGroup": "", "children": [ { "componentName": "NextCol", "id": "node_oclag7emmwn", "props": { "colSpan": 1, "justifyContent": "flex-start", "ref": "nextcol-0ad57c41" }, "title": "列", "isLocked": false, "condition": true, "conditionGroup": "", "children": [ { "componentName": "NextP", "id": "node_oclag7emmwo", "props": { "wrap": false, "type": "body2", "verAlign": "middle", "textSpacing": true, "align": "left", "ref": "nextp-e4f26629" }, "title": "段落", "isLocked": false, "condition": true, "conditionGroup": "", "children": [ { "componentName": "ProForm", "id": "node_oclag7emmwp", "props": { "placeholder": "请在右侧面板添加表单项+", "placeholderStyle": { "height": "38px", "color": "#0088FF", "background": "#d8d8d836", "border": 0, "gridArea": "span 4 / span 4" }, "columns": 4, "labelCol": { "fixedSpan": 4 }, "labelAlign": "top", "emptyContent": "添加表单项", "ref": "pro-form-entrylag7ephk", "operationConfig": { "visibleButtonCount": 3, "align": "center" }, "operations": [] }, "docId": "doclag7emmw", "title": "高级表单", "isLocked": false, "condition": true, "conditionGroup": "", "children": [ { "componentName": "FormInput", "id": "node_oclag7eszn2", "props": { "formItemProps": { "primaryKey": "2286", "label": "表单项", "size": "medium", "device": "desktop", "fullWidth": true, "columnSpan": 1, "required": false, "name": "a" }, "placeholder": "请输入", "size": "medium" }, "title": "", "isLocked": false, "condition": true, "conditionGroup": "" }, { "componentName": "FormInput", "id": "node_oclag7eszn3", "props": { "formItemProps": { "primaryKey": "2020", "label": "表单项", "size": "medium", "device": "desktop", "fullWidth": true, "columnSpan": 1, "required": false, "name": "b" }, "placeholder": "请输入", "size": "medium" }, "title": "", "isLocked": false, "condition": true, "conditionGroup": "" }, { "componentName": "FormInput", "id": "node_oclag7eszn4", "props": { "formItemProps": { "primaryKey": "7609", "label": "表单项", "size": "medium", "device": "desktop", "fullWidth": true, "columnSpan": 1, "required": false, "name": "c" }, "placeholder": "请输入", "size": "medium" }, "title": "", "isLocked": false, "condition": true, "conditionGroup": "" }, { "componentName": "FormInput", "id": "node_oclag7eszn5", "props": { "formItemProps": { "primaryKey": "9599", "label": "表单项", "size": "medium", "device": "desktop", "fullWidth": true, "columnSpan": 1, "required": false, "name": "d" }, "placeholder": "请输入", "size": "medium" }, "title": "", "isLocked": false, "condition": true, "conditionGroup": "" }, { "componentName": "FormInput", "id": "node_oclag7eszn6", "props": { "formItemProps": { "primaryKey": "6823", "label": "表单项", "size": "medium", "device": "desktop", "fullWidth": true, "columnSpan": 1, "required": false, "name": "e" }, "placeholder": "请输入", "size": "medium" }, "title": "", "isLocked": false, "condition": true, "conditionGroup": "" }, { "componentName": "FormInput", "id": "node_oclag7eszn7", "props": { "formItemProps": { "primaryKey": "966", "label": "表单项", "size": "medium", "device": "desktop", "fullWidth": true, "columnSpan": 1, "required": false, "name": "f" }, "placeholder": "请输入", "size": "medium", "ref": "forminput-c8fc1992" }, "title": "", "isLocked": false, "condition": true, "conditionGroup": "" }, { "componentName": "FormInput", "id": "node_oclag7eszn8", "props": { "formItemProps": { "primaryKey": "1220", "label": "表单项", "size": "medium", "device": "desktop", "fullWidth": true, "columnSpan": 1, "required": false, "name": "g" }, "placeholder": "请输入", "size": "medium", "ref": "forminput-1a22f36a" }, "title": "", "isLocked": false, "condition": true, "conditionGroup": "" }, { "componentName": "FormInput", "id": "node_oclag7eszn9", "props": { "formItemProps": { "primaryKey": "9786", "label": "表单项", "size": "medium", "device": "desktop", "fullWidth": true, "columnSpan": 1, "required": false, "name": "h" }, "placeholder": "请输入", "size": "medium", "ref": "forminput-5bd066a7" }, "title": "", "isLocked": false, "condition": true, "conditionGroup": "" } ] } ] } ] } ] } ] } ] } ] }, { "componentName": "NextBlock", "id": "node_oclag7emmw5f", "props": { "placeholderStyle": { "height": "100%" }, "noPadding": false, "noBorder": false, "title": "区域标题", "rowGap": 20, "colGap": 20, "background": "surface", "layoutmode": "O", "strict": true, "colSpan": 12, "rowSpan": 1, "mode": "transparent", "childTotalColumns": 12 }, "title": "区域", "isLocked": false, "condition": true, "conditionGroup": "", "children": [ { "componentName": "NextBlockCell", "id": "node_oclag7emmw5g", "props": { "colSpan": 12, "rowSpan": 1, "mode": "procard", "isAutoContainer": true, "title": "区块标题" }, "title": "", "isLocked": false, "condition": true, "conditionGroup": "", "children": [ { "componentName": "NextRowColContainer", "id": "node_oclag7emmw5h", "props": { "rowGap": 20, "colGap": 20 }, "title": "行列容器", "isLocked": false, "condition": true, "conditionGroup": "", "children": [ { "componentName": "NextRow", "id": "node_oclag7emmw5i", "props": {}, "title": "行", "isLocked": false, "condition": true, "conditionGroup": "", "children": [ { "componentName": "NextCol", "id": "node_oclag7emmw5j", "props": { "colSpan": 1 }, "title": "列", "isLocked": false, "condition": true, "conditionGroup": "", "children": [ { "componentName": "NextP", "id": "node_oclag7emmw5k", "props": { "wrap": false, "type": "body2", "verAlign": "middle", "textSpacing": true, "align": "left" }, "title": "段落", "isLocked": false, "condition": true, "conditionGroup": "", "children": [ { "componentName": "Button", "id": "node_oclag7emmw5l", "props": { "prefix": "next-", "type": "primary", "size": "medium", "htmlType": "button", "component": "button", "children": "点击获取上面高级表单的值", "iconSize": "xxs", "ghost": false, "loading": false, "text": false, "warning": false, "disabled": false, "__events": { "eventDataList": [ { "type": "componentEvent", "name": "onClick", "relatedEventName": "onClick_new" } ], "eventList": [ { "name": "onClick", "description": "点击按钮的回调\n@param {Object} e Event Object", "disabled": true }, { "name": "onMouseUp", "disabled": false } ] }, "onClick": { "type": "JSFunction", "value": "function(){this.onClick_new.apply(this,Array.prototype.slice.call(arguments).concat([])) }" }, "ref": "button-40c7ae7a" }, "docId": "doclag7emmw", "title": "", "isLocked": false, "condition": true, "conditionGroup": "" } ] } ] } ] } ] } ] } ] } ] } ] }
Expected behavior (required) / 预期行为（必填，非常重要）
A clear and concise description of what did you expect to happen. / 请清晰和精确的描述你预期的行为
期望获取到高级表单上的输入值， 目前文档上没看到要如何获取。
我尝试使用
console.log(this.$("pro-form-entrylag7ephk")) console.log(this.$("pro-form-entrylag7ephk").value)
但不行。
想知道如何获取该表单上的输入值
Screenshots (optional) / bug 截图（可选）
Sceenshots for further information. (If applicable.) / 一些有用的截图将会帮助我们更好的明确以及定位问题
Environments (please complete the following information) (required): / 请提供如下信息（必填）
- 引擎版本 1.0.14
- ext 版本 1.0.4
- 物料
- moment﹫2.24.0
- lodash
- ﹫alifd/next﹫1.24.18
- NextTable﹫1.0.1
- ﹫alilc/lowcode-materials﹫1.0.2
- ﹫alifd/pro-layout﹫1.0.1-beta.6
- ﹫alifd/fusion-ui﹫1.0.5
- my-material-name﹫0.1.2
- 浏览器为 chrome 版本 107.0.5304.88（正式版本） （64 位）
@yuduxyz @huangapple 目前应该有三种方法，来获取表单的值，一个是绑定高级表单的 onChange 事件，onChange 会在表单变化时触发，这个值可以保存起来使用。第二个是绑定高级表单的 onSubmit 事件，onSubmit 会在表单提交时触发，这个事件需要配合提交按钮使用，提交按钮可以在高级表单的操作项里配置出来。第三个是绑定高级表单的 saveField 事件，这个方法会在渲染的时候传回一个 field 实例可以保存起来。在想要获取值时调用 field.getValues() 来获取值。这些用法和 fusion form 的用法一致。也可以查看 fusion 的文档获取更详细的说明。
@yuduxyz @huangapple 目前应该有三种方法，来获取表单的值，一个是绑定高级表单的 onChange 事件，onChange 会在表单变化时触发，这个值可以保存起来使用。第二个是绑定高级表单的 onSubmit 事件，onSubmit 会在表单提交时触发，这个事件需要配合提交按钮使用，提交按钮可以在高级表单的操作项里配置出来。第三个是绑定高级表单的 saveField 事件，这个方法会在渲染的时候传回一个 field 实例可以保存起来。在想要获取值时调用 field.getValues() 来获取值。这些用法和 fusion form 的用法一致。也可以查看 fusion 的文档获取更详细的说明。
根据你们的 demo-general 的示例，真的是啥也拿不到啊，全是空的，是 bug
不知道为啥，演示的物料里面缺了好多东西，不是这里设置不了，就是那里不能拿到结果
比如 - 高级表单 - 点击submit 事件，按说应该直接给 values, 但是什么都拿不到
再比如 - 过滤 Filter，点击 搜索 事件 也是拿不到值
再比如 - 精品组件的抽屉，按说 下面设置的 footer 那里，应该可以设置上事件，但是 属性 和 高级 里啥也没有
@alilc/[email protected]
