vue相关

1、当页面路由发生跳转要想保持本页面的数据显示不变，应该在router-view上包裹keep-live标签，并且在相关路由下面添加meta字段

            path: '/',
            redirect: '/home',
            name: 'home',
            component: home,
            meta: {
                keepAlive: true
            }
        
    

2、在启动vue-cli的项目时，如果切换路由会在端口号和文件名之间加一个#号，要想去除的话，要在router.js里面增加 mode字段，并将其值改为history即可去除。
http://localhost:8080/#/home增加之后变为：http://localhost:8080/home

3、控制路由高亮的样式类名叫做 linkActiveClass这个字段也是需要在router.js里面进行配置，通过配置不同的类名就可以利用这个类名进行路由高亮样式的控制。

整体的router.js大概可以这样写

import Vue from 'vue'
import Router from 'vue-router'
import home from '@/components/home'
import shop from '@/components/shop'
import my from '@/components/my'

Vue.use(Router)


const router = new Router({
    mode: 'history',
    // linkActiveClass: 'linkActive',
    routes: [{
            path: '/',
            redirect: '/home',
            name: 'home',
            component: home,
            meta: {
                keepAlive: true
            }
        },
        {
            path: '/home',
            component: home,
            beforeEnter: (to, from, next) => {
                // alert('hah')
                next();
            },
            meta: {
                keepAlive: true
            }

        }, {
            path: '/shop',
            name: 'shop',
            component: shop,

        }, {
            path: '/my',
            name: 'my',
            component: my
        }
    ]
})

//全局守卫 在路由进入之前进行一些操作，例如判断是否登陆
router.beforeEach((to, from, next) => {
    next();
})
export default router;

4、引入axios 用npm i axios 安装完成之后在package.json里面会看到axios的版本号

    "axios": "^0.18.0",
    "vue": "^2.5.2",
    "vue-router": "^3.0.1"

然后在main.js里面引入axios

import axios from 'axios'
Vue.prototype.axios = axios //将axios放入Vue方法里面，然后就可以运用axios,在各个组件里面通过this.axios.方法名就可以了
axios.defaults.baseURL ='设置的全局基础URL，这样在请求的url就可以接拼接后面的就可以了，这样方便更改试环境或者正式环境'

5、npm run build 之后打开dist文件夹下的index文件之后会显示报错信息

Failed to load resource: net::ERR_FILE_NOT_FOUND
manifest.2ae2e69a05c33dfc65f8.js:1 Failed to load resource: net::ERR_FILE_NOT_FOUND
vendor.c397231b51d1afea579a.js:1 Failed to load resource: net::ERR_FILE_NOT_FOUND
app.cb5916c3a53968444905.js:1 Failed to load resource: net::ERR_FILE_NOT_FOUND

在npm run build之后控制台也会在build complete之后会有提示

  Opening index.html over file:// won't work.

解决办法：
在config文件夹里面的index.js文件里面找到build这个对象里面的 assetsPublicPath: '/'，将'/'换为'./'；另外在bulid文件夹里面的build.js里面将console.log里面的打印消息隐藏或者删除就可以了。再次点击dist文件夹下的index.html文件已经不报错了，但是当你点击下面的跳转路由的时候会报找不到页面的错误，这是由于你没有启动服务大原因，这就要求你在本地启动一个服务然后再次点击就可以看到切换的效果了。