@jay.kou/rak-ssr/es/SchemaForm/cases/render/index.js

A react based UI components for admin system

import { SchemaForm, Button } from "../../..";
import DisplayComponent from "../components/DisplayComponent";
import { useRef } from 'react';

/**
 * 演示只读模式下的 render 方法
 */
import { jsx as _jsx } from "react/jsx-runtime";
import { jsxs as _jsxs } from "react/jsx-runtime";
var Demo = function Demo() {
  var formRef = useRef();
  return /*#__PURE__*/_jsxs("div", {
    children: [/*#__PURE__*/_jsx(Button, {
      "data-testid": "set-btn",
      onClick: function onClick() {
        var _formRef$current;
        (_formRef$current = formRef.current) === null || _formRef$current === void 0 || _formRef$current.setFieldsValue({
          userId: '1',
          userName: 'Tom'
        });
      },
      children: "\u8D4B\u503C"
    }), /*#__PURE__*/_jsx(SchemaForm, {
      formRef: formRef,
      columns: [{
        title: '名称',
        dataIndex: 'userId,userName',
        renderFormItem: function renderFormItem() {
          return /*#__PURE__*/_jsx(DisplayComponent, {});
        }
      }, {
        valueType: 'dependency',
        name: ['userId,userName'],
        columns: function columns() {
          return [{
            title: '渲染',
            readonly: true,
            render: function render(dom, entity) {
              return /*#__PURE__*/_jsx("div", {
                "data-testid": "render-result",
                children: entity.userName
              });
            }
          }];
        }
      }]
    })]
  });
};
export default Demo;