Vue Netlify表单成功提交但未显示在netlify网站中

时间:2019-06-01 10:34:28

标签: forms vue.js vuejs2 netlify

我们在Vue应用程序中有一个表单,用于将数据提交给Netlify。一切似乎正常,但是Netlify仪表板中没有表单或提交内容。

我们遵循了netlify网站上有关Vue应用(LINK1)的指南以及在stackoverflow(LINK2LINK3)上发现的类似问题的解决方案,但似乎没有工作。

代码如下:

表格

div(class="input")
          form(method="post" @submit.prevent="submitForm")
            input(type="hidden" name="form-name" value="ask-question")
            input(type="text" name="name" :label="name" v-model="contactInput.name")
            input(type="text" name="email" :label="email" v-model="contactInput.email")
            input(type="text" name="phone" :label="phone" v-model="contactInput.phone")
            textarea(solo name="message" :label="message" v-model="contactInput.message" no-resize)
            v-btn(type="submit" color="info") {{Submit}}

功能

private encode(data: any) {
    return Object.keys(data)
      .map(
        key => ${encodeURIComponent(key)}=${encodeURIComponent(data[key])}
      )
      .join('&');
  }
  private submitForm(){
    fetch('/', {
        method: 'POST',
        headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
        body: this.encode({ 'form-name': 'ask-question', ...this.contactInput }),
      })
        .then((data) => alert("Success!")
        .catch(error => alert(error));
  }

我们希望看到成功! Netlify仪表板中显示消息,表单和提交。经过测试,我们看到了成功!消息,但根据“表单”部分在Netlify的仪表板中什么都没有。

0 个答案:

没有答案