xc-app/pages/components/header.vue

67 lines
1.0 KiB
Vue

<template>
<view class="nav">
<image src="@/static/new/back.png" mode="" class="nav-back" @click="goBack"></image>
<view class="nav-title">{{title}}</view>
<view class="nav-back"></view>
</view>
</template>
<script>
export default {
props: {
title: {
type: String,
default: ""
},
type: {
type: String,
default: ""
},
},
data() {
return {}
},
methods: {
goBack() {
if (this.type) {
this.$emit('click')
} else {
let canNavBack = getCurrentPages()
if (canNavBack && canNavBack.length > 1) {
uni.navigateBack()
} else {
history.back();
}
}
}
}
}
</script>
<style lang="scss" scoped>
.nav {
z-index: 100;
width: 100%;
height: 112rpx;
padding: 0 32rpx;
display: flex;
align-items: center;
justify-content: space-between;
box-sizing: border-box;
position: fixed;
top: 0;
left: 0;
.nav-back {
width: 48rpx;
height: 48rpx;
}
.nav-title {
font-weight: 500;
font-size: 34rpx;
color: #000000;
}
}
</style>