react-jsonschema-form如何通过cdn使用？

Question

我正在尝试使用" react - jsonschema -form“这个库来创建使用react和jsonschema的表单。我正在尝试在我的项目中使用它，就像网站上的示例中所描述的那样，通过cdn包含.js文件。它不起作用。导出的组件"Form“未定义。

我看过这个类似的问题Using React component from js source maps，但我不能理解提供的解决方案。我应该为JSONSchemaForm的默认导出设置别名。但是什么是JSONSchemaForm呢？我在哪里可以找到它？它是要包含的另一个库吗？

下面是我尝试做的事情：

我已经使用Require.js导入了cdn库：

var require = {
        baseUrl: "/js/",
        waitSeconds: 600,
        paths: {              
            'react-forms': ['https://unpkg.com/react-jsonschema-form/dist/react-jsonschema-form']
        },            
    }

然后在我的代码中，我导入了这个库：

var rf = require('react-forms')

但是现在当我访问表单(rf.Form)时，它是未定义的。我看过"react-jsonschema-form.js“源代码。"Form“没有在哪里定义。

从图书馆页面的说明中可以看出：

    You'll also need to alias the default export property to use the Form component:
    const Form = JSONSchemaForm.default;

    // or
    const {default: Form} = JSONSchemaForm;

但是JSONSchemaForm也是未定义的。

所以我不知道我做错了什么。如何通过将"react-jsonschema-form“库作为脚本标记来使用它？

感谢你的社区。

Answer 1

通过cdn脚本标签使用react-jsonschema-form (带require.js)：

1. 通过指示url路径通过require.js包含此库：

路径：{

' react -forms'：['https://unpkg.com/react-jsonschema-form/dist/react-jsonschema-form'] }react

• 包含此多边形填充库:react确保在您的代码中使用最新的react版本( version V15)

• ，需要库和别名作为其默认导出，如下所示：

var rf = require("react-forms")；const Form = rf.default；

(这是因为我正在使用require.js模块系统。对于另一个模块系统，您可以使用JSONSchemaForm.default)

Answer 2

1. Include the cdn path

        <script src="https://cdn.jsdelivr.net/npm/react-jsonschema-form@1.0.3/dist/react-jsonschema-form.js"></script>

    2.By using field get the access of jsonformDefaultValues;
` <script type="text/babel"
   const fields = JSONSchemaForm.default                        
   return(
   <Form 
        schema={schema}
        uiSchema={uiSchema}   
        field={fields}  
        onSubmit={onSubmit}    
   </Form>)   
   </script>`