|
- <template>
- <div id="app">
- <router-view v-if="isRouterAlive"></router-view>
- </div>
- </template>
-
- <script>
- import { mapState, mapActions } from "vuex";
- export default {
-
- name: 'App',
- provide(){
- return{
- reload: this.reload
- }
- },
- data () {
- return {
- isRouterAlive:true
- }
- },
- methods:{
- ...mapActions(["setIndex"]),
- reload () {
- this.isRouterAlive = false
- this.$nextTick(function(){
- this.isRouterAlive =true
- })
- }
- },
- computed: {
- //当前导航状态
- ...mapState({
- topNav: state => state.topNav.data, //将 this.topNav 映射为 this.$store.topNav.data
- index: state => state.topNav.index,
- })
- },
- // created() {
- // //在页面加载时读取sessionStorage里的状态信息
- // if (sessionStorage.getItem("index")) {
- // this.setIndex(JSON.parse(sessionStorage.getItem("index")))
- // }
- // //在页面刷新时将vuex里的信息保存到sessionStorage里
- // window.addEventListener("beforeunload", () => {
- // sessionStorage.setItem("index", JSON.stringify(this.index));
- // })
- // },
- }
-
- </script>
-
- <style>
-
- @import url('../node_modules/bootstrap/dist/css/bootstrap.min.css');
- .fl{float: left;}
- .fr{float: right;}
- .clearfix:after {
- content: ".";
- display: block;
- height: 0;
- clear: both;
- visibility: hidden;
- }
- h1, h2 {
- font-weight: normal;
- }
- ul {
- list-style-type: none;
- padding: 0;
- }
- li {
- display: inline-block;
- margin: 0 10px;
- }
- a {
- color: #42b983;
- text-decoration: none;
- }
- #app {
- font-family: 'Avenir', Helvetica, Arial, sans-serif;
- -webkit-font-smoothing: antialiased;
- -moz-osx-font-smoothing: grayscale;
- text-align: center;
- color: #2c3e50;
- position: relative;
- }
- body::-webkit-scrollbar {
- width: 8px;
- height: 8px;
- }
- /*正常情况下滑块的样式*/
- body::-webkit-scrollbar-thumb {
- background-color: rgba(0,0,0,.05);
- border-radius: 10px;
- -webkit-box-shadow: inset 1px 1px 0 rgba(0,0,0,.3);
- }
- /*鼠标悬浮在该类指向的控件上时滑块的样式*/
- body:hover::-webkit-scrollbar-thumb {
- background-color: rgba(0,0,0,.2);
- border-radius: 10px;
- -webkit-box-shadow: inset 1px 1px 0 rgba(0,0,0,.1);
- }
- /*鼠标悬浮在滑块上时滑块的样式*/
- body::-webkit-scrollbar-thumb:hover {
- background-color: rgba(0,0,0,.4);
- -webkit-box-shadow: inset 1px 1px 0 rgba(0,0,0,.1);
- }
- /*正常时候的主干部分*/
- body::-webkit-scrollbar-track {
- border-radius: 10px;
- -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0);
- background-color: white;
- }
- /*鼠标悬浮在滚动条上的主干部分*/
- body::-webkit-scrollbar-track:hover {
- -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.4);
- background-color: rgba(0,0,0,.01);
- }
- .insight,.production,.server,.about,.case,.partner,.copy{
- width: 100%;
- position: relative;
- }
- </style>
|