uni-app像小程序中的自定义头部（万能封住头部）

第一：先在App.vue中全局获取不同手机的顶部高度
在methods:{
getPhoneHeight(){
let that =this
uni.getSystemInfo({
success:function(res){
that.globalData.phoneHeight=res.statusBarHeight
}
})
}
}

第二步
在components中写公共组件
uni-topBar.vue

第三步：
在需要的页面进行引入 和vue引入公共组件的方法一样
html:


js:
import uniNavBar from "../../../components/uni-nav-bar.vue"

components:{
uniNavBar
},

最后效果显示

image.png

悟空—不死谢谢