如何实现页面内部弹出新页面,并有关闭按钮
最终实现的效果:
父组件:
子组件:
步骤:
1、<script>中把组件import
2、export default中components中注册组件的使用
3、在需要打开该弹窗的按钮处增加click事件
4、把需要弹窗的组件加入父组件末尾
5、图片上面addUser_pop_up是data中的属性,用于设置v-show,先给置成false,不显示。下面的openAddUser方法给v-show置成true,从而显示弹出的效果。
6、弹窗实现关闭。使用emit事件来触发父组件的自定义事件。自定义事件就是第5步的hiddenShow,v-show值置成false,从而实现弹窗的关闭
7、假如弹出的不止一个页面,需要把所有的vue组件放入一个div中