使用 react-jsonschema-form 字段事件

Question

我有一个简单的模式可以生成 form.I 想在鼠标悬停时对字段执行一些操作。但我不知道如何将鼠标悬停在所有字段上。通过阅读 Documents 我发现表单字段有一些事件。 - 表单域模糊事件 - 表单字段焦点事件但是，他们没有任何例子。请帮助我了解在哪里可以设置鼠标悬停事件？这是我的架构：

 "schema":
         {
            "type":"object",
            "properties":{
                "request": {
                    "type": "object",
                    "properties": {
                        "requester": {
                            "type": "string"
                        },
                        "requestDate": {
                            "type": "integer"
                        },
                        "detailList": {
                            "type": "array",
                            "items": {
                                "id": "urn:jsonschema:com:fanap:demo:entity:ItemRequestDetail",
                                "type": "object",
                                "properties": {
                                    "item": {
                                        "id": "urn:jsonschema:com:fanap:demo:entity:ItemClass",
                                        "type": "object",
                                        "properties": {
                                            "name": {
                                                "type": "string"
                                            }
                                        }
                                    },
                                    "requestedAmount": {
                                        "type": "number"
                                    }
                                }
                            }
                        },
                        "description": {
                            "type": "string"
                        },
                        "state": {
                            "id": "urn:jsonschema:com:fanap:demo:entity:CategoryElement",
                            "type": "object",
                            "properties": {
                                "name": {
                                    "type": "string"
                                }
                            }
                        },
                    }
                },
                "processResult": {
                    "type": "object",
                    "properties": {
                        "notificationMessage": { "type": "string" }
                    }
                }
            }
         }

这是我用于显示生成的表单的组件：

class JsonFormWrapper extends React.Component<PropsT> {
render() {
    return (
        <React.Fragment>
            {this.props.jsonResponse ? (
                <Form
                    schema={this.props.jsonResponse.schema}
                    uiSchema={this.props.jsonResponse.uiSchema}
                />
            ) : null}
        </React.Fragment>
    );
  }
 }
 export default JsonFormWrapper;

如何为所有元素设置鼠标悬停？我真的很感激你能提供的任何帮助。

Answer 1

可能是一个 hacky 解决方案，但您可以利用 Field Template 定义自定义事件，例如鼠标悬停。如果可行，您将必须定义一次，而不是为每个输入字段重复它

使用 react-jsonschema-form 字段事件

use react-jsonschema-form field events

reactjs

react-jsonschema-forms