Vue3组合式API开发表单点击非提交按钮也触发submit事件求助

HTML 原生规范中，位于<form>标签内的<button>如果没有显式声明type属性，默认值为submit，点击后会自动触发表单的submit事件，这是原生表单的默认行为，和按钮绑定的自定义click事件逻辑无关。

两种常用方案按需选择：

• 方案1（推荐，符合原生规范）：给不需要触发提交的按钮显式指定type="button"
  修改对应的按钮代码为：

<button type="button" @click="doSomething">Do Something</button>

设置后该按钮会被识别为普通功能按钮，不会触发表单提交。

• 方案2：在click事件回调中阻止默认行为
  如果不需要修改按钮属性，也可以在doSomething方法中阻止事件的默认提交行为：

const doSomething = (e) => {
  e.preventDefault()
  // 原有业务逻辑
}

你当前的JS代码中submit方法的声明存在语法错误，正确的箭头函数写法为：

const submit = () => {
  axios.post("api/users/", {
    'username': username.value,
    'email': email.value,
    'password': password.value
  })
}

内容的提问来源于stack exchange，提问作者ayitinya