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

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

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