//获取应用实例 const app = getApp() Component({ options: { multipleSlots: true }, properties: { title: { //导航栏标题 type: String, value: '诺信云' }, color: { //标题字体颜色 type: String, value: '#fff' }, transparent: { //是否透明 type: Boolean, value: false }, background: { //背景色 type: String, value: '#007dff' }, border: { //导航栏下边框样式 type: String, value: 'border-bottom:none' }, cusPath: { //用户自定义返回操作 type: Boolean, value: false }, backPath: { //左侧返回按钮点击后的返回路径(没有的话默认返回上一页) type: Boolean, value: false }, backImage: { //左侧箭头图片 type: String, value: '../../images/icon-back.svg' }, loading: { //是否显示导航栏loading type: Boolean, value: false }, dbclickBackTop: { //双击标题返回顶部功能是否开启 type: Boolean, value: false }, leftType: { //标题显示方式normal(安卓居左,ios居右),android(无论ios还是安卓,全部居左),ios(无论安卓还是ios,全部居中) type: String, value: 'normal' } }, data: { showBack: false, //是否显示返回按钮 }, attached: function () { let systemInfo = app.globalData.systemInfo if (systemInfo) { this.setNavbar(systemInfo) } else { wx.getSystemInfo({ success: res => { this.setNavbar(res) } }) } //是否显示返回按钮(如果是第一页,就不显示,如果不是第一页,就显示) let pages = getCurrentPages() if (pages.length > 1) { this.setData({ showBack: true }) } }, methods: { //点击返回按钮 goBack() { if (this.data.cusPath === false) { if (this.data.backPath) { wx.switchTab({ url: this.data.backPath }) } else { wx.navigateBack() } } else { this.triggerEvent('back') } }, //双击返回顶部 doubleClick(e) { if (!this.data.dbclickBackTop) { return } if (this.timeStamp && (e.timeStamp - this.timeStamp < 300)) { this.timeStamp = 0 wx.pageScrollTo({ scrollTop: 0, duration: 300 }) } else { this.timeStamp = e.timeStamp } }, //设置自定义导航信息 setNavbar(systemInfo) { let isSupport = !!wx.getMenuButtonBoundingClientRect //是否支持获取胶囊按钮信息 let rect = wx.getMenuButtonBoundingClientRect ? wx.getMenuButtonBoundingClientRect() : null //获取胶囊按钮信息 let ios = !!(systemInfo.system.toLowerCase().search('ios') + 1) //是否是ios系统 let topBarHeight = ios ? (44 + statusBarHeight) : (48 + statusBarHeight) //获取导航栏高度 let statusBarHeight = systemInfo.statusBarHeight //获取状态栏高度 let leftStyle if (ios) { if (this.data.leftType !== 'android') { leftStyle = isSupport ? 'width:' + (systemInfo.windowWidth - rect.left) + 'px' : '' } else { leftStyle = 'margin-right:18px;' } } else { if (this.data.leftType !== 'ios') { leftStyle = 'margin-right:18px;' } else { leftStyle = isSupport ? 'width:' + (systemInfo.windowWidth - rect.left) + 'px' : '' } } this.setData({ ios, topBarHeight, statusBarHeight, innerWidth: isSupport ? 'width:' + rect.left + 'px' : '', innerPaddingRight: isSupport ? 'padding-right:' + (systemInfo.windowWidth - rect.left) + 'px' : '', leftStyle }) let eventDetail = { topBarHeight, statusBarHeight } this.triggerEvent('getNavbarInfo', eventDetail) } } })