Remove the hash value after the vue routing jump address bar#

To remove the hash value after the address bar of the vue routing jump#, we only need to add a code to index.js in the router directory of the management file of the routing jump to remove the hash value#

mode:"history"

 

 

import Vue from 'vue' 
import App from './App.vue'
 // Global import style [every component can use] 
import "./statics/site/css/style.css" 
import Vue from 'vue' 
import VueRouter from 'vue-router' 
import ElementUI from 'element-ui' ;
import axios from 'axios'
import Vuex from 'vuex'
Vue.use(Vuex)
Vue.use (ElementUI);
Vue.use(VueRouter)
import {
    addLocalGoods
} from './common/localStorageTool.js'
axios.defaults.baseURL = 'http://39.108.135.214:8899/';
Vue.prototype.$axios = axios
//路由对象相关
import goodslist from './components/goods/goodslist'
import shopcart from './components/shopcart/shopcart'
import goodsinfo from './components/goods/goodsinfo'
import login from './components/account/login'
import order from './components/order/order'
import test from './components/test/test'
import 'element-ui/lib/theme-chalk/index.css';
// 使用懒加载
import VueLazyLoad from 'vue-lazyload'
import moment from 'moment'
//全局过滤器
Vue.filter('dateFmt', (input, formatString = "YYYY-MM-DD") => {
    return moment(input).format(formatString)
})
const router = new VueRouter({
    mode:"history",
    routes: [{
            path: '/',
            redirect: '/goodslist'
        },
        {
            path: '/goodslist',
            component: goodslist
        },
        {
            path: '/goodsinfo/:goodsId',
            component: goodsinfo
        },
        {
            path: '/shopcart',
            component: shopcart,
            meta: {
                requiresAuth: true
            }
        },
        {
            path: '/login',
            component: login,
        },
        {
            path: '/order',
            component: order,
        },
        {
            path: '/test',
            component: test,
        },
    ]
})

router.beforeEach((to, from, next) => {
    if (to.meta.requiresAuth == true) {
        next()
    } else {
        next()
    }

})
Vue.use(VueLazyLoad, {
    error: require('./statics/site/imgs/erro.jpg'),
    loading: require('./statics/site/imgs/load.gif')
})
const store = new Vuex.Store({
    state: {
        buyCount: 0
    },
    getters: {
        getBuyCount: state => {
            return state.buyCount
        }
    },
    mutations: {
        addGoods(state, payload) {
            // Change state 
            state.buyCount = addLocalGoods(payload)

        },
        updateGoods(state, payload) {
            state.buyCount = updateLocalGoods(payload)
        }
    }
})
/* *Use the root instance created by the Vue framework to render the content in the template of the root component to the div with id=app */ 
new Vue({
    el: "#app",
    router,
    store,
    // render: function (createElement) {
    //     return createElement(App)
    // }
    render: h => h(App)

})

 

Guess you like

Origin http://43.154.161.224:23101/article/api/json?id=325050713&siteId=291194637