You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

73 lines
1.8 KiB

  1. <template>
  2. <view class="up-nvue-root" :style="rootStyle">
  3. <slot />
  4. </view>
  5. </template>
  6. <script>
  7. import { applyNativeThemeUI, getThemePageStyle, getThemeVarsForStyle, syncThemeRuntimeFromStorage } from '../theme/runtime.js'
  8. export default {
  9. name: 'UpNvueRoot',
  10. data() {
  11. return {
  12. rootStyle: {
  13. ...getThemeVarsForStyle(),
  14. ...getThemePageStyle()
  15. },
  16. minPageHeight: '0px'
  17. }
  18. },
  19. created() {
  20. this.syncPageHeight()
  21. this.refreshRootStyle()
  22. this.themeChangeHandler = () => {
  23. this.refreshRootStyle()
  24. }
  25. if (typeof uni !== 'undefined' && typeof uni.$on === 'function') {
  26. uni.$on('uThemeChange', this.themeChangeHandler)
  27. }
  28. },
  29. mounted() {
  30. this.refreshRootStyle()
  31. },
  32. beforeUnmount() {
  33. if (this.themeChangeHandler && typeof uni !== 'undefined' && typeof uni.$off === 'function') {
  34. uni.$off('uThemeChange', this.themeChangeHandler)
  35. }
  36. this.themeChangeHandler = null
  37. },
  38. methods: {
  39. syncPageHeight() {
  40. let windowHeight = 0
  41. try {
  42. if (typeof uni !== 'undefined' && typeof uni.getWindowInfo === 'function') {
  43. windowHeight = Number((uni.getWindowInfo() || {}).windowHeight || 0)
  44. } else if (typeof uni !== 'undefined' && typeof uni.getSystemInfoSync === 'function') {
  45. windowHeight = Number((uni.getSystemInfoSync() || {}).windowHeight || 0)
  46. }
  47. } catch (e) {
  48. windowHeight = 0
  49. }
  50. this.minPageHeight = `${windowHeight || 0}px`
  51. },
  52. refreshRootStyle() {
  53. syncThemeRuntimeFromStorage()
  54. this.rootStyle = {
  55. ...getThemeVarsForStyle(),
  56. ...getThemePageStyle(),
  57. minHeight: this.minPageHeight,
  58. width: '750rpx'
  59. }
  60. applyNativeThemeUI()
  61. }
  62. }
  63. }
  64. </script>
  65. <style>
  66. .up-nvue-root {
  67. width: 750rpx;
  68. }
  69. </style>