如何从表单容器Vue之外的另一个组件提交表单

【问题标题】：How to submit a form from another component outside of the form container Vue如何从表单容器Vue之外的另一个组件提交表单
【发布时间】：2021-05-10 00:55:33
【问题描述】：

我的页面上有一个表单，我希望从表单外的另一个按钮触发提交，我该怎么做？

【问题讨论】：

请分享代码

标签： vue.js nuxt.js

【解决方案1】：

你必须在 HTML 表单中添加一个引用

<form ref="form">
  <input name="field" v-model="value">
</form>

然后在您的方法中，您可以使用引用来提交表单

methods: {
  send: function(){
    this.$refs.form.submit()
  }
}

你可以在任何你想要的地方调用 send 方法。

您可以在此处了解有关 ref 属性的更多信息

https://v3.vuejs.org/guide/component-template-refs.html

【讨论】：