BUG：没有点击 submit 标签也会 return false 的问题。请老师解答代码逻辑问题

来源：5-12 ValidateForm 编码第四部分 - 大功告成

淡语

2021-06-05

图片描述
整个文件中只有一个 console.log 语句，这个语句在 App.vue 中。按理来说只有输入了不正确的邮箱或者密码后点击提交才会打印出 result false。而从上面的图来看，我并没有点击提交，而是点击了某块特殊的空白区域，也返回了值。经过反复点击测试，我发现只有点击了密码框下面的同Submit按钮差不多同样高度的空白区域才会出现这种情况。于是，我在想是不是这块空白区域都会触发 submitForm方法，于是看了下代码，果然是如此。如下所示：
图片描述
那么两个问题来了。1、当初写代码的时候老师为什么没有把 @click.prevent=“submitForm” 写在下面的 <button type="submit" class="btn btn-primary">提交</button>里而是写在了类名为 submit-area 的 div 标签中？2、如何解决上述的 BUG 呢？