App.vue 2.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142
  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 = 30 / 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. dl,
  49. dt,
  50. dd,
  51. ul,
  52. ol,
  53. li,
  54. h1,
  55. h2,
  56. h3,
  57. h4,
  58. h5,
  59. h6,
  60. pre,
  61. form,
  62. fieldset,
  63. input,
  64. textarea,
  65. p,
  66. blockquote,
  67. th,
  68. td,
  69. label,
  70. botton {
  71. margin: 0;
  72. padding: 0;
  73. font-size: 12px;
  74. }
  75. ul{
  76. text-align: center;
  77. /* margin: 10px 0 !important; */
  78. }
  79. table {
  80. border-collapse: initial;
  81. border-spacing: 0;
  82. }
  83. fieldset,
  84. img {
  85. border: 0;
  86. }
  87. address,
  88. caption,
  89. cite,
  90. code,
  91. dfn,
  92. em,
  93. strong,
  94. th,
  95. var {
  96. font-style: normal;
  97. font-weight: normal;
  98. }
  99. ol,
  100. ul {
  101. list-style: none;
  102. }
  103. caption,
  104. th {
  105. text-align: left;
  106. }
  107. /* h1,h2,h3,h4,h5,h6 {
  108. font-weight:normal;
  109. } */
  110. q:before,
  111. q:after {
  112. content: "";
  113. }
  114. abbr,
  115. acronym {
  116. border: 0;
  117. }
  118. * {
  119. margin: 0px;
  120. padding: 0px;
  121. }
  122. a {
  123. text-decoration: none;
  124. }
  125. li {
  126. list-style: none;
  127. }
  128. input,
  129. img {
  130. border: none;
  131. }
  132. .icon {
  133. width: 1em;
  134. height: 1em;
  135. vertical-align: -0.15em;
  136. fill: currentColor;
  137. overflow: hidden;
  138. }
  139. </style>