Question

我正在开发一个vuejs应用程序，我有一个表格，当它留空并单击提交时，我希望它给出验证错误消息。我想查看所有空html元素的所有验证错误，而无需单击它们。

这在网站上很常见，但是我做不到，我很困惑。我为按钮使用了组件，我禁止在本机按钮中提交。

我发现了一些堆栈溢出页面和一些其他页面，但它们仅处理获取验证状态，但是，我在单击输入元素内部时将其作为行为，以便它将在输入框下显示错误消息。

我在波纹管连接中尝试了解决方案，但没有用，它只处理透明和报告。 https://itnext.io/https-medium-com-joshstudley-form-field-validation-with-html-and-a-little-javascript-1bda6a4a4c8c

             <form ref="myMessageForm">
             <v-input ref="myInput" placeholder="Ad Soyad" v-model="messageForm.name" required/>
             <v-input action="javascript:myFunction()" placeholder="Üniversite" v-model="messageForm.university" required/>
             <v-input placeholder="Fakülte" v-model="messageForm.faculty"/>

我尝试过这些

      this.$refs.myMessageform.checkValidity()
      this.$refs.myMessageform.reportValidity()

我在表单元素下看不到任何红色错误消息。

我还尝试通过添加并调用一个临时按钮来触发表单

      var tmpSubmit = document.createElement('button')
    this.$refs.myMessageform.appendChild(tmpSubmit)
    tmpSubmit.click()
    this.$refs.myMessageform.removeChild(tmpSubmit)

提交类型的呼叫按钮不会触发验证

0 个答案: