@sim-design/form NPM

表单通用组件

快速开始

npm install @sim-design/form --save

参数

参数	说明	类型
formId	表单 id	string
onOk	表单回调，返回 key:value 对象	Function
FormCheckType	考核规则。对象字符串	string
FormKeys	正确答案	string
FormScores	得分规则。对象字符串	string
FormDataSource	映射数据源。对象字符串	string
showCorrect	显示对错图标	Boolean
dragProps	拖拽区相关配置项	dragProps
dropProps	放置区相关配置项	dragProps

dragProps

参数	说明	类型
titleStyle	面板标题样式	CSSProperties
panelStyle	面板样式	CSSProperties
contentStyle	面板拖拽源父类容器样式	CSSProperties
itemWrapStyle	单个拖拽源容器默认样式	CSSProperties
itemStyle	选项默认样式	CSSProperties
itemHoverStyle	选项默认选中样式	CSSProperties
itemDelStyle	选项被删除时样式	CSSProperties

dropProps

panelTitleStyle示例：
{
    fontSize:1rem;
    color:red;
}

panelStyle示例：
{
    background: #fff;
    padding: 10px;
    margin: 20px;
}

Ref 方法实例

你可以通过 ref 获取数据域

参数	说明	类型
getFieldsValue	获取提交数据	Object
getFormScore	获取表单得分信息 id	Object

用法示例

import {useState,useRef} from 'react'
import SimForm from "@sim-design/form";

const Demo = (props) => {

    const [showCorrect, setShowCorrect] = useState(false)

    const formRef = useRef()

    // 获取得分和提交记录
    //const values = formRef?.current.getFieldsValue()
    //const values = formRef?.current.getFormScore()

    return <SimForm ref={formRef} formId="123123123" showCorrect={showCorrect} />
}

@ant-design/icons antd classnames echarts immer react-pdf swiper use-immer

@everything-registry/sub-chunk-836 @infinitebrahmanuniverse/nolb-_sim @sim-design/simd

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago