@jay.kou/rak-ssr
Version:
A react based UI components for admin system
69 lines (67 loc) • 2.13 kB
JavaScript
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
import { Button, Space, Form } from 'antd';
import { SchemaForm } from "../../..";
import DisplayComponent from "../components/DisplayComponent";
/**
* 演示约定式赋值
* 使用 form
*/
import { jsx as _jsx } from "react/jsx-runtime";
import { jsxs as _jsxs } from "react/jsx-runtime";
var Demo = function Demo() {
var _Form$useForm = Form.useForm(),
_Form$useForm2 = _slicedToArray(_Form$useForm, 1),
form = _Form$useForm2[0];
// 表单提交处理
var handleFormFinish = function handleFormFinish(values) {
// 将结果显示到测试结果区域
var resultElement = document.querySelector('[data-testid="form-submit-result"]');
if (resultElement) {
resultElement.textContent = JSON.stringify(values, null, 2);
}
};
return /*#__PURE__*/_jsxs("div", {
children: [/*#__PURE__*/_jsxs(Space, {
direction: "vertical",
children: [/*#__PURE__*/_jsx(Button, {
"data-testid": "set-fields-btn",
onClick: function onClick() {
form.setFieldsValue({
id: '2',
name: 'John'
});
},
children: "\u8BBE\u7F6E\u5B57\u6BB5\u503C"
}), /*#__PURE__*/_jsx(Button, {
"data-testid": "reset-btn",
onClick: function onClick() {
return form.resetFields();
},
children: "\u91CD\u7F6E\u8868\u5355"
}), /*#__PURE__*/_jsx(Button, {
"data-testid": "submit-btn",
onClick: function onClick() {
return form.submit();
},
children: "\u63D0\u4EA4\u8868\u5355"
})]
}), /*#__PURE__*/_jsx(SchemaForm, {
form: form,
onFinish: handleFormFinish,
initialValues: {
id: '1',
name: 'Jennifer'
},
columns: [{
title: '姓名',
dataIndex: 'id,name',
renderFormItem: function renderFormItem() {
return /*#__PURE__*/_jsx(DisplayComponent, {});
}
}]
}), /*#__PURE__*/_jsx("div", {
"data-testid": "form-submit-result"
})]
});
};
export default Demo;