index.vue 1.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869
  1. <template>
  2. <div class="null">
  3. <div>
  4. <div @click="$router.push('/')">返 回 首 页</div>
  5. <div class="back" @click="$router.go(-1)">返 回 上 一 页</div>
  6. </div>
  7. </div>
  8. </template>
  9. <script>
  10. //这里可以导入其他文件(比如:组件,工具js,第三方插件js,json文件,图片文件等等)
  11. //例如:import 《组件名称》 from '《组件路径》';
  12. export default {
  13. name: "null",
  14. components: {},
  15. data() {
  16. //这里存放数据
  17. return {};
  18. },
  19. //监听属性 类似于data概念
  20. computed: {},
  21. //监控data中的数据变化
  22. watch: {},
  23. //方法集合
  24. methods: {},
  25. //生命周期 - 创建完成(可以访问当前this实例)
  26. created() {},
  27. //生命周期 - 挂载完成(可以访问DOM元素)
  28. mounted() {},
  29. beforeCreate() {}, //生命周期 - 创建之前
  30. beforeMount() {}, //生命周期 - 挂载之前
  31. beforeUpdate() {}, //生命周期 - 更新之前
  32. updated() {}, //生命周期 - 更新之后
  33. beforeDestroy() {}, //生命周期 - 销毁之前
  34. destroyed() {}, //生命周期 - 销毁完成
  35. activated() {}, //如果页面有keep-alive缓存功能,这个函数会触发
  36. };
  37. </script>
  38. <style lang='less' scoped>
  39. .null {
  40. background-color: #f5feff;
  41. width: 100vw;
  42. height: 100vh;
  43. & > div {
  44. width: 100%;
  45. height: 100%;
  46. background: url('../../assets/images/null.png') no-repeat center 100px;
  47. &>div{
  48. font-size: 24px;
  49. cursor: pointer;
  50. text-align: center;
  51. position: absolute;
  52. left: 50%;
  53. transform: translateX(-50%);
  54. bottom: 200px;
  55. border-radius: 35px;
  56. border: 2px solid aqua;
  57. font-weight: 700;
  58. width: 210px;
  59. height: 70px;
  60. line-height: 66px;
  61. }
  62. .back{
  63. bottom: 300px;
  64. }
  65. }
  66. }
  67. </style>