91 lines
1.6 KiB
Vue
91 lines
1.6 KiB
Vue
<!-- 可自定义导航栏的骨架组件：通用型（属于CustomNavbarPage骨架组件的强化版） -->
|
||
<template>
|
||
<view>
|
||
<!-- hearder -->
|
||
<!-- 自定义导航栏 -->
|
||
<uni-nav-bar
|
||
:left-icon="leftIcon"
|
||
:right-text="rightText"
|
||
:title="title"
|
||
:color="color"
|
||
:rightTextColor="rightTextColor"
|
||
:backgroundColor="backgroundColor"
|
||
:fixed="fixed"
|
||
statusBar
|
||
@clickLeft="clickLeft"
|
||
@clickRight="clickRight">
|
||
<slot name="left" slot="left"></slot>
|
||
<slot name="hearder"></slot>
|
||
<slot name="right" slot="right"></slot>
|
||
</uni-nav-bar>
|
||
|
||
<!-- content -->
|
||
<slot></slot>
|
||
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
name: 'NavBarSkeletonPage',
|
||
props: {
|
||
leftIcon: {
|
||
type: String,
|
||
default: ''
|
||
},
|
||
rightText: {
|
||
type: String,
|
||
default: ''
|
||
},
|
||
rightTextColor: {
|
||
type: String,
|
||
default: '#5FC48D'
|
||
},
|
||
backgroundColor: {
|
||
type: String,
|
||
default: "#FFFFFF"
|
||
},
|
||
title: {
|
||
type: String,
|
||
default: ''
|
||
},
|
||
// 是否固定
|
||
fixed: {
|
||
type: Boolean,
|
||
default: true
|
||
},
|
||
// 标题字体颜色
|
||
color: {
|
||
type: String,
|
||
default: "#404C69"
|
||
},
|
||
clickLeftFn: {
|
||
type: [Boolean, Function],
|
||
default: false
|
||
},
|
||
clickRightFn: {
|
||
type: [Boolean, Function],
|
||
default: false
|
||
},
|
||
// BottomNavBar配置
|
||
curKey: {
|
||
type: String,
|
||
default: 'mall'
|
||
}
|
||
},
|
||
data() {
|
||
return {
|
||
|
||
};
|
||
},
|
||
methods: {
|
||
clickLeft () {
|
||
!this.clickLeftFn ? uni.navigateBack() : this.clickLeftFn()
|
||
},
|
||
clickRight () {
|
||
this.clickRightFn && this.clickRightFn()
|
||
},
|
||
}
|
||
}
|
||
</script>
|