vue2在父组件中点击按钮弹出子组件弹窗

你可以按照以下步骤进行操作：

1. 在父组件中定义一个按钮，并设置点击事件。

<template>
  <div>
    <button @click="showChild">点击打开子组件弹窗</button>
    <child v-if="displayChild" @close="hideChild"/>
  </div>
</template>

2. 在父组件中定义一个变量 `displayChild`，用于控制子组件的显示与隐藏。

<script>
import Child from './Child.vue'

export default {
  components: {
    Child
  },
  data() {
    return {
      displayChild: false
    }
  },
  methods: {
    showChild() {
      this.displayChild = true
    },
    hideChild() {
      this.displayChild = false
    }
  }
}
</script>

3. 在父组件中引入子组件，并在需要的地方使用 `v-if` 控制子组件的显示与隐藏。

<template>
  <div>
    <button @click="showChild">点击打开子组件弹窗</button>
    <child v-if="displayChild" @close="hideChild"/>
  </div>
</template>

4. 在子组件中定义一个关闭方法，用于向父组件传递关闭事件。

<template>
  <div>
    <button @click="close">关闭</button>
  </div>
</template>

<script>
export default {
  methods: {
    close() {
      this.$emit('close')
    }
  }
}
</script>