提交 fcf384ac 编写于 作者: tao.wu's avatar tao.wu

修改头部组件,与native的头部一致

上级 46411812
......@@ -9,7 +9,6 @@ header{
}
.head-wrap{
width: 375px;
height: 44px;
box-sizing: border-box;
padding: 0 20px 0 16px;
display: flex;
......
<template>
<header>
<div class="status" :class="{'bgfff': isScroll}" :style="{height: statusBarHeight + 'px'}"></div>
<div class="head-wrap" :class="{'bgfff': isScroll}">
<div class="head-wrap" :class="{'bgfff': isScroll}" :style="{height: titleHeight + 'px'}">
<img @click="goBack" :src="leftIcon">
<span v-if="isScroll">{{title}}</span>
<img @click="goShare" :src="rightIcon">
......@@ -36,15 +36,18 @@
leftIcon: leftimg1,
rightIcon: rightimg1,
isScroll: false,
statusBarHeight: 20
statusBarHeight: 40, // 给一个默认值,20 * 2
titleHeight: 44 // title高度默认是44px
}
},
mounted(){
this.$rocNative.getStatusBarHeight().then(res=>{
if(this.isIOS){
this.statusBarHeight = res.statusBarHeight;
const dpr = window.devicePixelRatio;
if(this.$rocNative.isIOS){
this.statusBarHeight = res.statusBarHeight * dpr;
this.titleHeight = this.titleHeight * dpr;
}else{
this.statusBarHeight = res.statusBarHeight / window.devicePixelRatio;
this.statusBarHeight = res.statusBarHeight / dpr;
}
})
},
......
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册