uview自定义导航栏(自定义返回路径)
依赖包:uview框架配置
1.pages.json页面关闭原生的导航栏
{
// 待办事项
"path" : "pages/home/backlog/backlog/backlog",
"style" :
{
"navigationStyle" : "custom" //关闭自带的导航栏
}
}
2.源码
<!-- 选项卡 待办事项 -->
<template>
<view>
<!-- 自定义导航 -->
<!--自定义返回的路径:custom-back="gotabpolice" -->
<u-navbar title-color="#fff" back-icon-color="#fff" :is-fixed="isFixed" :is-back="true" :background="background" :title="title" :back-icon-name="backIconName" :back-text="backText" :custom-back="gotabpolice" >
<view class="navbar-right" slot="right" v-if="slotRight">
<view style="margin:5px 12px 0 0 ">
<image style="width:18.25px;height: 17.75px;" src="../../../../static/img/admin/search.png" mode="">
</image>
</view>
</view>
</u-navbar>
</view>
</template>
<script>
export default {
data() {
return {
// 自定义导航栏
title: '待办事项',
slotRight: true,
backText: '',
backIconName: 'nav-back',
right: false,
showAction: false,
rightSlot: false,
useSlot: false,
background: {
background: '#2E95FF'
},
isBack: true,
search: false,
custom: false,
isFixed: true,
keyword: '',
// #ifdef MP
slotRight: false,
// #endif
// #ifndef MP
slotRight: true,
// #endif
//自定义导航栏结束
}
},
methods: {
gotabpolice(){
uni.switchTab({
url:'../../tabbar/tab-police/tab-police'
})
}
}
}
</script>
<style>
</style>
还没有评论,来说两句吧...