使用header组件
<header> //css 写在当前page页面下 <image class="leftIcon" src="/file/leftIcon.png" bindtap="backFun"></image> <text class="title" bindtap="backFun">标题</text> </header>
WXML代码
<view class="header" style="padding-top:{{paddingTop}}px;height:{{lineHeight}}px"> <slot></slot> </view>
WXSS代码
.header{ background-color: #ffffff; padding-bottom: 18rpx; width: 100%; z-index: 999; padding-left: 30rpx; display: flex; align-items: center; }
JS代码
const app=getApp(); Component({ properties: { }, data: { }, lifetimes: { attached: function() { let {height,top} = wx.getMenuButtonBoundingClientRect(); let lineHeight=height let paddingTop=top this.setData({ lineHeight,paddingTop }) } }, methods: { } })