javascript - GatsbyJS + Netlify 表单不接收提交

Question

因此，我在 Netlify 上托管了一个网站。我遵循了他们网站上的文档(关于表单)，部署后表单的名称显示在我的 Netlify dash 上，但没有任何提交通过。

我可以帮忙吗？

这是我的 Contact.js 组件中的表单:

<form
  name="contact-me"
  method="post"
  action="/success"
  data-netlify="true"
  data-netlify-honeypot="bot-field"
>
  <input type="hidden" name="bot-field" />
  <label htmlFor="name">
    Name: <input type="text" name="name" id="name" required />
  </label>
  <label htmlFor="email">
    Email: <input type="email" name="email" id="email" required />
  </label>
  <label htmlFor="message">
    Message: <textarea name="message" id="message" required />
  </label>
  <footer className="major">
    <ul className="actions">
      <li>
        <button type="submit" className="button small special">
          Send
        </button>
      </li>
      <li>
        {/* eslint-disable-next-line */}
                    <button type="reset" className="button small">
          Clear
        </button>
      </li>
    </ul>
  </footer>
</form>

当然，我正在使用 Gatsby 来构建网站。

请让我知道是否应该在此处放置我的存储库的链接。

谢谢

Answer 1

使用 Gatsby 站点测试 netlify 将看到什么的最快方法:

• 在浏览器中禁用网站的 javascript
• 不使用 javascript 转到联系页面
• 查看页面源代码(页面 netlify 用于注册表格)
• 查看表单并确保 Netlify requires 的值存在
• 需要 data-netlify="true" 形式

<form name="contact" method="POST" data-netlify="true">
  <p>
    <label>Email: <input type="text" name="name" /></label>
  </p>
  <p>
    <label>Message: <textarea name="message"></textarea></label>
  </p>
  <p>
    <button type=”submit”>Send</button>
  </p>
</form>

如果设置正确，您的表单应该在 SPA 中正确处理并正确注册输入字段。