没有类型的 vue-js 按钮元素 --> 提交

Question

我们在 vue-js（@vue-cli，Build 版本）应用程序中遇到了一个非常奇怪的问题。 App.vue 中有一个按钮具有 onclick

<button @click="goIRList" id="irlistBtn">IR List</button>

这对某些用户每次都很好，但对其他用户则不然。对于其他人，我检查（有警报）根本没有达到 goIRList 代码。这些其他人在我们尝试过的任何浏览器上都有这个问题。当 Vue+Developer Tools 打开时，他们确实没有问题 - 让我更难调试它。

这些用户得到的不是 goIRList 代码，而是一个仅包含错误消息的页面

Cannot GET /menu.csp

这尤其令人困惑，因为 menu.csp 是来自完全不同系统的代码，尽管它也与同一台计算机相关联。它从未在 vue-js 应用程序中被引用。
最终我意识到发生的事情是 submit，即使按钮在页面上没有任何形式 [我原以为按钮默认只是一种提交类型，如果它在表格内]。一旦我添加了类型

Answer 1

在表单中添加一个“提交”事件捕获器，并阻止默认操作。

<template>
  <div id="app">
    <form @submit="submit">
      <input value="Tom">
      <button>Submit</button>
    </form>
  </div>
</template>

<script>
export default {
  name: "App",
  methods: {
    submit(e) {
      e.preventDefault();
      console.log("Success!");
    }
  }
};
</script>

Answer 2

然后有人给我指出了答案。荒谬：这两个按钮隐藏在页面上方的徽标图像下方。这是包含伪造 link.
的图像我从来没有得到错误，因为我看不太清楚，所以我保持高尺寸，按钮离标志很远。其他人有一个更正常的页面大小，除了那个图像之外的一切都变小了；图像的不可见边缘超出了按钮，有人试图点击按钮触发了 link。我将图片设置为随页面调整大小，一切正常。

没有类型的 vue-js 按钮元素 --> 提交

vue-js button element with no type --> submit

button

form-submit

vue.js