App.vue 2.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139
  1. <template>
  2. <div id="app">
  3. <router-view></router-view>
  4. </div>
  5. </template>
  6. <script>
  7. export default {
  8. name: 'app',
  9. data() {
  10. return {
  11. }
  12. },
  13. created () {
  14. //在页面加载时读取sessionStorage里的状态信息
  15. if (sessionStorage.getItem("store") ) {
  16. this.$store.replaceState(Object.assign({}, this.$store.state,JSON.parse(sessionStorage.getItem("store"))))
  17. }
  18. //在页面刷新时将vuex里的信息保存到sessionStorage里
  19. window.addEventListener("beforeunload",() => {
  20. sessionStorage.setItem("store",JSON.stringify(this.$store.state))
  21. })
  22. //
  23. // console.log(this.$route.query.accessToken)
  24. // sessionStorage.setItem("accessToken", this.$route.query.accessToken);
  25. },
  26. methods: {
  27. initWindow() {
  28. let whdef = 100 / 1920 // 表示1920的设计图,使用100PX的默认值
  29. // let wH = window.innerHeight // 当前窗口的高度
  30. let wW = window.innerWidth // 当前窗口的宽度
  31. let rem = wW * whdef // 以默认比例值乘以当前窗口宽度,得到该宽度下的相应FONT-SIZE值
  32. let html = document.getElementsByTagName('html')[0]
  33. html.style.fontSize = rem + 'px'
  34. }
  35. },
  36. mounted() {
  37. let self = this
  38. this.initWindow()
  39. window.onresize = () => {
  40. self.initWindow()
  41. }
  42. }
  43. }
  44. </script>
  45. <style>
  46. @charset "utf-8";
  47. body,
  48. div,
  49. dl,
  50. dt,
  51. dd,
  52. ul,
  53. ol,
  54. li,
  55. h1,
  56. h2,
  57. h3,
  58. h4,
  59. h5,
  60. h6,
  61. pre,
  62. form,
  63. fieldset,
  64. input,
  65. textarea,
  66. p,
  67. blockquote,
  68. th,
  69. td,
  70. label,
  71. botton {
  72. margin: 0;
  73. padding: 0;
  74. font-size: 12px;
  75. }
  76. table {
  77. border-collapse: initial;
  78. border-spacing: 0;
  79. }
  80. fieldset,
  81. img {
  82. border: 0;
  83. }
  84. address,
  85. caption,
  86. cite,
  87. code,
  88. dfn,
  89. em,
  90. strong,
  91. th,
  92. var {
  93. font-style: normal;
  94. font-weight: normal;
  95. }
  96. ol,
  97. ul {
  98. list-style: none;
  99. }
  100. caption,
  101. th {
  102. text-align: left;
  103. }
  104. /* h1,h2,h3,h4,h5,h6 {
  105. font-weight:normal;
  106. } */
  107. q:before,
  108. q:after {
  109. content: "";
  110. }
  111. abbr,
  112. acronym {
  113. border: 0;
  114. }
  115. * {
  116. margin: 0px;
  117. padding: 0px;
  118. }
  119. a {
  120. text-decoration: none;
  121. }
  122. li {
  123. list-style: none;
  124. }
  125. input,
  126. img {
  127. border: none;
  128. }
  129. .icon {
  130. width: 1em;
  131. height: 1em;
  132. vertical-align: -0.15em;
  133. fill: currentColor;
  134. overflow: hidden;
  135. }
  136. </style>