54 lines
1.2 KiB
Vue
54 lines
1.2 KiB
Vue
<template>
|
||
<view class="nav-bar">
|
||
<u-navbar :is-back="isBack" :back-text="backText" back-icon-size="40" :title-width="titleWidth" :back-icon-color="color" :title="title" :title-color="color" :border-bottom="borderBottom" :background="{ background: background }"></u-navbar>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default{
|
||
props:{
|
||
// 标题
|
||
title:{
|
||
type:String,
|
||
default:''
|
||
},
|
||
// 是否显示导航栏左边返回图标和辅助文字
|
||
isBack:{
|
||
type:Boolean,
|
||
default:false
|
||
},
|
||
// 返回图标右边的辅助提示文字
|
||
backText:{
|
||
type:String,
|
||
default:''
|
||
},
|
||
// 导航栏背景设置(APP和小程序上包括状态栏的颜色)
|
||
background:{
|
||
type:String,
|
||
default:'#1B85E9'
|
||
},
|
||
// 导航栏底部是否显示下边框，如定义了较深的背景颜色，可取消此值
|
||
borderBottom: {
|
||
type:Boolean,
|
||
default:true
|
||
},
|
||
// 导航栏标题的最大宽度，内容超出会以省略号隐藏，单位rpx
|
||
titleWidth: {
|
||
type:Number,
|
||
default:250
|
||
},
|
||
// 标题的颜色
|
||
color: {
|
||
type:String,
|
||
default:'#fff'
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style scoped>
|
||
/deep/.uicon-nav-back{
|
||
font-weight: bold !important;
|
||
}
|
||
</style>
|