小程序官方组件navigation-bar高度变动问题

写了一个《小鸟听写》小程序，调试的时候导航栏是正常的，提交的时候页首的标题缺上升到被摄象头挡住了。首先出现这个问题的原因，可能是因为博主在用win7，开发工具的版本过低导致组件代码也过于老旧造成的。但是因为博主并不需要实现过于负责的功能，暂不准备学习使用第三方组件，于是看了下官方组件的js文件--navigation-bar.js:

    attached() {
      const rect = wx.getMenuButtonBoundingClientRect()
      const platform = (wx.getDeviceInfo() || wx.getSystemInfoSync()).platform
      const isAndroid = platform === 'android'
      const isDevtools = platform === 'devtools'
      const { windowWidth, safeArea: { top = 0, bottom = 0 } = {} } = wx.getWindowInfo() || wx.getSystemInfoSync()
      this.setData({
        ios: !isAndroid,
        innerPaddingRight: `padding-right: ${windowWidth - rect.left}px`,
        leftWidth: `width: ${windowWidth - rect.left}px`,
        safeAreaTop: isDevtools || isAndroid ? `height: calc(var(--height) + ${top}px); padding-top: ${top}px` : ``
      })
    },

影响这个高度的应该是其中的safeAreaTop参数。利用deepseek做如下修改后，高度就稳定了：

    attached() {
      const rect = wx.getMenuButtonBoundingClientRect();
      const deviceInfo = wx.getDeviceInfo();
      const windowInfo = wx.getWindowInfo();
      const platform = deviceInfo.platform;
      const isAndroid = platform === 'android';
      const windowWidth = windowInfo.windowWidth;
      const statusBarHeight = windowInfo.statusBarHeight || 0;
      const menuButtonHeight = rect.height || 32;
      const navHeight = statusBarHeight + menuButtonHeight + 8;
      const menuButtonRight = windowWidth - rect.left;
      this.setData({
        ios: !isAndroid,
        innerPaddingRight: `padding-right: ${menuButtonRight}px`,
        leftWidth: `width: ${menuButtonRight}px`,
        safeAreaTop: `height: ${navHeight}px; padding-top: ${statusBarHeight}px;`,
      });
    },

有遇到同样的问题的亲，可以留意一下这个函数。