1

我对 Web 开发 (html/js) 完全陌生,但现在想使用 react-json-schema 包,它在提供的沙箱中效果很好。

但是,我什至无法让教程正常工作。我编写了一个 html,如教程中所述:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div id="app"></div>
<script type="text/jsx" src="react.js"></script>
</body>
</html>

相应的 javascript 文件“react.js”:

const Form = JSONSchemaForm.default;
const schema = {
  title: "Test form",
  type: "string"
};

ReactDOM.render((
  <Form schema={schema} />
), document.getElementById("app"));

但是,打开 html 时,模式根本不会显示在浏览器中。没有错误信息。

我尝试过的事情:

1.)从cdn导入脚本,所以在html头中添加这些行:

<script src="https://unpkg.com/react@16/umd/react.development.js" crossorigin></script>
<script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js" crossorigin></script>
<script src="https://unpkg.com/@rjsf/core/dist/react-jsonschema-form.js"></script>

2.) 在本地和全局重新安装 npm 和 react-json-schema、react 和 react-dom 包

3.)在js中导入所述包:

import react from React
import import ReactDOM from 'react-dom'
import Form from "@rjsf/core";
4

2 回答 2

0

试试下面:

import Form from 'react-jsonschema-form';
class Index extends DataComponent{
  constructor(props){
   super(props);
   this.state={
      schema: {
            type: 'object',
            title: 'Info',
            properties: {
                task: {
                    type: 'string',
                    title: 'First Name'
                }
            }
      }
    }
  }
  render(){
   return(
    <Form 
     schema={this.state.schema}
    />
   )
  }
}
于 2020-06-24T10:55:05.827 回答
0

如果您已安装该库,则删除

//const Form = JSONSchemaForm.default;

于 2020-06-28T15:12:53.803 回答