index.vue 1.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374
  1. <template>
  2. <div class="home">
  3. <div class="btnR" @touchstart="goIndex">
  4. <p>进 入</p>
  5. <p>史 馆</p>
  6. </div>
  7. </div>
  8. </template>
  9. <script>
  10. export default {
  11. name: "home",
  12. components: {},
  13. data() {
  14. // 这里存放数据
  15. return {};
  16. },
  17. // 监听属性 类似于data概念
  18. computed: {},
  19. // 监控data中的数据变化
  20. watch: {},
  21. // 方法集合
  22. methods: {
  23. goIndex() {
  24. this.$router.replace("/index?m=TEST");
  25. this.$nextTick(() => {
  26. setTimeout(() => {
  27. location.reload(true);
  28. }, 300);
  29. });
  30. },
  31. },
  32. // 生命周期 - 创建完成(可以访问当前this实例)
  33. created() {},
  34. // 生命周期 - 挂载完成(可以访问DOM元素)
  35. mounted() {},
  36. beforeCreate() {}, // 生命周期 - 创建之前
  37. beforeMount() {}, // 生命周期 - 挂载之前
  38. beforeUpdate() {}, // 生命周期 - 更新之前
  39. updated() {}, // 生命周期 - 更新之后
  40. beforeDestroy() {}, // 生命周期 - 销毁之前
  41. destroyed() {}, // 生命周期 - 销毁完成
  42. activated() {}, // 如果页面有keep-alive缓存功能,这个函数会触发
  43. };
  44. </script>
  45. <style lang='less' scoped>
  46. /deep/.all{
  47. display: none !important;
  48. }
  49. .home {
  50. position: relative;
  51. width: 100%;
  52. height: 100%;
  53. background: url("../../assets/img/indexBac.png") center center;
  54. .btnR {
  55. color: #fff;
  56. font-size: 18px;
  57. border-radius: 8px;
  58. cursor: pointer;
  59. position: absolute;
  60. left: 50%;
  61. bottom: 80px;
  62. transform: translateX(-50%);
  63. width: 80px;
  64. height: 80px;
  65. background: url('../../assets/img/homeBtn.png');
  66. background-size: 100% 100%;
  67. display: flex;
  68. justify-content: center;
  69. align-items: center;
  70. flex-direction: column;
  71. }
  72. }
  73. </style>