我尝试在组件中嵌入一个脚本标签来渲染表单。我不知道如何在React中做到这一点。如果我将这个标签粘贴到HTML文档中,表单将完美加载,但我不知道如何在React中做同样的事情。由于工作原因,我不能粘贴实际的代码嵌入到这个网站上,但我基本上试图将其嵌入到一个组件中,以便表单呈现和用户可以提交表单:
<script type="text/javascript" src="https://form.jotform.com/jsform/1234566789"></script>
有什么想法吗?
svmlkihl1#
您可以使用标记
const styles = {} // if you want to add some custom CSS const URL = "https://form.jotform.com/jsform/1234566789" //embed URL <iframe title="your title" style={styles} src={URL}></iframe>
阅读更多关于它HERE
3bygqnnd2#
我发现了一个可爱的节点包,它可以让您嵌入Jotforms;你可以在这里找到NPM的文章:https://www.npmjs.com/package/react-jotform-embed
7xllpg7q3#
我做了一个组件,可以轻松地将JotForm.com表单嵌入到基于ReactJS的网站或应用程序中。它像SSR框架一样支持NextJS / Gatsby。如果需要,您还可以访问一些回调,如onSubmit。您可以在这里访问:https://npmjs.com/package/jotform-react
nkoocmlb4#
这比上面的解决方案容易得多,我找不到任何地方告诉我如何做到这一点。所以,这是我所做的:1.转到您的表单和“发布”页面。1.选择iframe并复制代码。1.在public/文件夹中创建一个名为“jotform-embed.htm”的文件(或者您想叫它的任何名称),并将所有iframe代码粘贴到其中。1.在React JSX中,像这样引用文件:
public/
<iframe title="Form Name" src="jotform-embed.htm" style={{ width: '100%', height: '750px', }} />
这就是你要做的!
4条答案
按热度按时间svmlkihl1#
您可以使用标记
阅读更多关于它HERE
3bygqnnd2#
我发现了一个可爱的节点包,它可以让您嵌入Jotforms;你可以在这里找到NPM的文章:
https://www.npmjs.com/package/react-jotform-embed
7xllpg7q3#
我做了一个组件,可以轻松地将JotForm.com表单嵌入到基于ReactJS的网站或应用程序中。它像SSR框架一样支持NextJS / Gatsby。
如果需要,您还可以访问一些回调,如onSubmit。
您可以在这里访问:https://npmjs.com/package/jotform-react
nkoocmlb4#
这比上面的解决方案容易得多,我找不到任何地方告诉我如何做到这一点。所以,这是我所做的:
1.转到您的表单和“发布”页面。
1.选择iframe并复制代码。
1.在
public/
文件夹中创建一个名为“jotform-embed.htm”的文件(或者您想叫它的任何名称),并将所有iframe代码粘贴到其中。1.在React JSX中,像这样引用文件:
这就是你要做的!