去除vue路由跳转地址栏后的哈希值#,我们只需要在路由跳转的管理文件router目录下的index.js中加上一句代码即可去掉哈希值#
mode:"history"
import Vue from 'vue' import App from './App.vue' // 全局导入样式【每个组件都可以用】 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) { // 变更状态 state.buyCount = addLocalGoods(payload) }, updateGoods(state, payload) { state.buyCount = updateLocalGoods(payload) } } }) /**利用Vue框架创建出来的根实例,去把根组件的template中的内容,渲染到id=app的div中去 */ new Vue({ el: "#app", router, store, // render: function (createElement) { // return createElement(App) // } render: h => h(App) })