<template>

<div style="height:50px;">

<van-nav-bar

:title="title"

left-text=""

left-arrow

:z-index="999"

@click-left="onBack"

>

<van-icon name="user-o" slot="right" @click="userInfo"/>

 

</van-nav-bar>

</div>

</template>

 

<script>

import { NavBar } from 'vant';

export default {

name:'headerNav',

components:{

[NavBar.name]: NavBar,

},

props:{

title:String,

},

methods: {

onBack() {

history.back();

},

userInfo(){

this.$router.push({ path: '/user' });

}

}

}

</script>

 

<style>

.van-nav-bar{

background: url(../../assets/images/user-title.png) no-repeat;

background-size: 100% 100%;

width:100%;

position: fixed;

z-index: 999;

top:0

}

.van-nav-bar__title{

color:#fff;

}

.van-icon-arrow-left:before {

content: "\F008";

color:#fff;

}

.van-icon-user-o:before {

content: "\F0CC";

color:#fff;

font-size: 0.6rem;

}

</style>

 

技术
今日推荐
PPT
阅读数 119
下载桌面版
GitHub
百度网盘(提取码:draw)
Gitee
云服务器优惠
阿里云优惠券
腾讯云优惠券
华为云优惠券
站点信息
问题反馈
邮箱:ixiaoyang8@qq.com
QQ群:766591547
关注微信