时间戳

首页 > 解决方案 > 如何在子组件上调用 submit.prevent

vue.js - 如何在子组件上调用 submit.prevent

问题描述

我有一个带有提交按钮的父组件

<v-card flat>
  <child-component :submit="submit()"></child-component>
  <v-card-actions>
    <v-spacer></v-spacer>
    <v-btn @click="submit" type="submit">Change password</v-btn>
  </v-card-actions>
</v-card>

和一个带有@submit.prevent 表单的子组件，每当我单击父级上的按钮时，我都需要调用它：

<v-form @submit.prevent="submit">....</v-form>

Mysubmit()在父级上，它只是一个将数据提交到数据库的简单函数。它需要参数X。我在子表单上有一个原因@submit.prevent是我可以按 Enter 提交表单。

我怎样才能将submit()作为道具传递给孩子？或者如何从子组件调用提交？

标签： vue.jsdata-bindingvuejs2vue-component

解决方案

孩子应该在提交时发出一个事件：

<v-form @submit.prevent="$emit('submit')">....</v-form>

并且父级可以监听该事件来调用该方法：

<child-component @submit="submit"></child-component>

推荐阅读