vue.js - 在点击事件vue.js上将子组件方法传递给父组件

Question

在我的父组件中，我有一个单击事件。单击事件应根据条件显示学生或教职员工页面。子组件应将方法传递给父组件，应显示哪个页面。如何将子方法传递给父组件？

• 父组件

   <student @getStudent="getInfo"/>
   <staff @getStaff="getInfo"/>
  
  
  <div>
      <button @click="getInfo">Click</button>
  </div>
  
  methods: {
     getInfo() {
    if (this.type === 'student') {
        ***How to call child getStudent() method from student component**** 
      }
    if (this.type === 'staff') {
       ***how to call getStaff() method from staff component**** 
      }
    },
  

  --学生（儿童部分）

   methods: {
  
   getStudentInfo() {
   if (this.validateForm) return;
  
   try {
     this.$router.push({
       name: 'student',
     });
   } catch (error) {
  },
  
    getStudent() {
       this.$emit('getStudentInfo');
    },
   },
  

--员工（儿童部分）

    methods: {

    getStaffInfo() {
    if (this.validateForm) return;
   
    try {
      this.$router.push({
        name: 'staff',
      });
    } catch (error) {
   },
      
     getStaff() {
        this.$emit('getStaffInfo');
     },
    },

标签： vue.js