时间戳

首页 > 解决方案 > 如何在子组件中使用父组件传递的函数

vue.js - 如何在子组件中使用父组件传递的函数

问题描述

我有一个叫孩子的父母：

<select-school-type placeholder="Filter par type école" @selected="getSchools"></select-school-type>

我希望在用户更改子组件中的值时调用“getSchools”方法。getSchool 方法使用所选值调用端点。

我的孩子是：

<template>
    <select @change="onChange($event)">
        <option>{{ placeholder }}</option>
        <option v-for="schoolType in schoolTypes" :key="schoolType.id">{{ schoolType.id }}</option>
    </select>
</template>

在我的方法中，我有这个：

onChange(event){
      console.log(event.target.value)
      this.$emit('selected')
    }

我看到带有正确值的 console.log 消息。

之后，如何使用正确的值调用 getSchools 方法？我尝试了很多事情都没有成功。

我是 Vue 初学者。

标签： vue.js

解决方案

您需要将值传递给$emit方法：

this.$emit('selected', event.target.value)

推荐阅读