vue公共头部、底部可控制显示隐藏的方法

vue公共头部、底部可控制显示隐藏的方法

找到<router-view/>路由插入点一般在App.vue页面

/* App.vue的template */
<template>
	<div class="home">
		<PCheader v-if="header_show"></PCheader>
		<router-view v-on:public_header="public_header" v-on:public_footer="public_footer"></router-view>
		<PCfoot v-if="footer_show"></PCfoot>
	</div>
</template>

在App.vue中引入公共头部和底部，设置v-if 默认设置显示，为router-view设置v-on事件

/* App.vue的script */
<script>
import PCfoot from '@/views/Public/PCfoot'