[vue3] Settings of routing hash and History in vue3

Settings of routing hash and History in vue3

history routing

history keyword: createWebHistory, modify router/index
URL format: hhh.com/user/id. It looks better than hash mode.

import { createRouter, createWebHistory } from 'vue-router'
const routes = [ {
  path: '/userinfo',
  name: 'UserInfo',
  component: () => import('../views/UserInfo.vue')
}]
const router = createRouter({
  history: createWebHistory(process.env.BASE_URL),
  routes
})
export default router

hash routing

hash keyword: createWebHashHistory
URL format: www.abc.com/#/vue, its hash value is #/vue.

import { createRouter, createWebHashHistory } from 'vue-router'
const routes = [{
  path: '/userinfo',
  name: 'UserInfo',
  component: () => import('../views/UserInfo.vue')
}]
const router = createRouter({
  history: createWebHashHistory(),
  routes
})
export default router