两种调用组件方法

1.props
父组件

<div class="bt1" @click="goaddemployees()">
    <img src="/static/img/usercenter/bt1.png"> 添加
</div>

    <addemployees v-if="show" :show="show" :gbe="gbe"></addemployees>
    import Addemployees from './addemployees'
    components: { Addemployees}

data () {
  return {
    show: false,
        }}

  goaddemployees () {
     this.show = true
  },
 gbe () {
     this.show = false
 },

子组件

<template>
  <div>
    <div class="alls" @click.stop="guanbi()">
      <div class="alls-body" style="position: relative" @click.stop="on()">
      ...

props:{
      gbe:Function
  },
methods: {
      guanbi () {
        this.gbe()
      },
      on () {
      }
    }

2.$emit
父组件

<div class="bt1" @click="goaddperson()">
    <img src="/static/img/usercenter/bt1.png"> 添加
</div>

    <addpeople v-if="show2" :show2="show2" v-on:gbp="gbp"></addpeople>
      import Addpeople from './addpeople'
    components: {Addpeople}

data () {
  return {
    show2: false,
        }}

  goaddperson () {
     this.show2 = true
  },
 gbe () {
     this.show2 = false
 },

子组件

<template>
  <div>
    <div class="alls" @click.stop="guanbi()">
      <div class="alls-body" style="position: relative" @click.stop="on()">
      ...

methods: {
      guanbi () {
          this.$emit('gbp')
      },
      on () {
      }
    }