pad-nl-three-uni/components/NavBar.vue

<template>
	<view class="header">
		<span @tap="goBack" class="iconfont icon_back">&#xe6db;</span>
		<span class="page_name">{{title}}</span>
		<span @tap="backHome" class="iconfont icon_home" :class="{'vhide': show1 === false}">&#xe69b;</span>
	</view>
</template>

<script>
	export default {
		data() {
			return {
			};
		},
		props: {
			title: String,
			inner: {
				type: Boolean,
				default: false
			},
			inner2: {
				type: Boolean,
				default: false
			},
			show1: {
				type: Boolean,
				default: true
			}
		},
		methods: {
			goBack () {
				if (this.inner) {
					uni.navigateBack()
				} else if (this.inner2) {
					this.$emit('goIn')
				} else {
					uni.redirectTo({
						url: '/pages/home/home'
					})
					// uni.navigateBack()
				}
			},
			backHome () {
				uni.redirectTo({
					url: '/pages/home/home'
				})
				// uni.navigateBack()
			}
		}
	}
</script>

<style lang="stylus">
@import '@/common/style/mixin.styl';
.header
	_fj()
	_wh(100%, 30px)
	background-color #041427
	border-bottom 1px solid #13568B
	z-index 200
	padding 0 10px
	box-shadow: 0 1px 2px 0 RGBA(19, 86, 139, 0.5);
.page_name
	_font(22px, 30px, #F6F9FE,700,center)
	font-family: YouSheBiaoTiHei
	background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(49,190,255,0.9) 0%, rgba(239,252,254,1) 40%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
.icon_back {
	font-size: 26px;
	line-height: 30px;
	color: #fff;
}
.icon_home {
	font-size: 26px;
	line-height: 30px;
	color: #fff;
}
</style>