我正在尝试使用这个库“react-jsonschema-form”来使用react和jsonschema创建表单。 我试图在我的项目中使用它,如网站上的示例所述,通过cdn包含.js文件。它不起作用。导出的组件“表单”未定义。
我看过这个类似的问题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')
但是现在当我访问Form(rf.Form)时,它是未定义的。我看了一下“react-jsonschema-form.js”源代码。 “表格”没有定义在哪里。
从图书馆页面的说明中可以说:
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”库包含为脚本标记来使用它?
谢谢社区。 p>
答案 0 :(得分:0)
我能够解决这个问题,我在这里报告任何一个面临同类问题的解决方案。通过cdn脚本标记(使用require.js)使用react-jsonschema-form:
通过指示url路径来通过require.js包含此库:
路径:{
' react-forms':[' https://unpkg.com/react-jsonschema-form/dist/react-jsonschema-form']
}
包含此polyfill库:cdn.polyfill.io/v2/polyfill.min.js
确保使用最新的反应版本(版本v15)
在您的代码中,要求库和别名默认导出如下:
var rf = require(" react-forms"); const Form = rf.default;
(这是因为我使用的是require.js模块系统。对于另一个模块系统,你可以使用JSONSchemaForm.default)
答案 1 :(得分:0)
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>`