微信小程序顶部导航栏自定义组件

navHeader.vue，已经计算好高度，调用： <navHeader></navHeader>

<template>  
    <view>  
        <view class="bg-orange" :style="'height:'+statusBarHeight+'px'"></view>  
        <view class="bg-orange flex align-center justify-center" :style="'height:'+navBarHeight+'px'">  
            <view class="text-lg">  
                {{title}}  
            </view>  
        </view>  
    </view>  
</template>  

<script>  
    export default {  
        name:"navHeader",  
        data() {  
            return {  
                statusBarHeight: 0,  
                navBarHeight: 0,  
                title:'测试'  
            };  
        },  
        created() {  
            this.statusBarHeight = uni.getSystemInfoSync().statusBarHeight;  
             let plat = uni.getSystemInfoSync().platform;  
             this.navBarHeight = 44;  
             if(plat=='android'){  
                  this.navBarHeight = 48;  
             }  
        }  
    }  
</script>  

<style>  

</style>