vue中两种history和hash模式的使用

电玩女神 2021-09-03 05:13 814阅读 0赞

# vue2.0中的history和hash模式 #

**1. history模式**

import Vue from 'vue';
    import Router from 'vue-router';
    Vue.use(Router);
    
    const router = new Router({ 
    	mode: 'history',
    	routes: [
    		{ 
    			path: '/',
    			name: '',
    			component: ''
    		}
    	]
    })

**2. hash模式**

import Vue from 'vue';
    import Router from 'vue-router';
    Vue.use(Router);
    
    const router = new Router({ 
    	mode: 'hash',
    	routes: [
    		{ 
    			path: '/',
    			name: '',
    			component: ''
    		}
    	]
    })

# vue3.0中的history和hash模式 #

**1. history模式**

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

**2. hash模式**

import {  createRouter, createWebHashHistory } from "vue-router";
    const routes = [
    	{ 
    		path: '/',
    		name: '',
    		component: ''
    	}
    ];
    const router = createRouter({ 
      history: createWebHashHistory(),
      routes
    });
    
    export default router;

发表评论取消回复

表情：

评论列表（有 0 条评论，814人围观）

还没有评论，来说两句吧...

相关阅读

相关 hash和history两种模式的区别

ue-router（前端路由）有两种模式，hash模式和history模式，这里来谈谈两者的区别。 1. hash 就是指 url 尾巴后的 \ 号以及后面的字符，h...

布满荆棘的人生/ 2024年04月19日 12:44/ 0 赞/ 81 阅读

相关前端路由的两种模式： hash 模式和 history 模式

[前端路由的两种模式： hash 模式和 history 模式][hash _ history] </h1> <div class...

青旅半醒/ 2024年04月18日 13:00/ 0 赞/ 75 阅读

相关 vue-router的两种模式（hash和history）及区别

为什么要有hash 和history？对于Vue这类渐进式前端开发框架，为了构建SPA（单页面应用），需要引入前端路由系统，这也就是Vue-Router存在的意义。前端

╰半橙微兮°/ 2023年06月06日 15:28/ 0 赞/ 23 阅读

相关 vue路由两种模式区别hash和history

hash hash模式原理是onhashchange事件，可以在window对象上监听这个事件： window.onhashchange = function(

清疚/ 2023年01月19日 03:05/ 0 赞/ 26 阅读

相关 Vue 路由的两种模式 history 和 hash，以及命名路由

对于Vue这类渐进式前端开发框架，为了构建SPA（单页面应用），需要引入前端路由系统，这也就是Vue-Router存在的意义。前端路由的核心，就在于——改变试图的同时不会向后端

迷南。/ 2022年12月31日 02:28/ 0 赞/ 172 阅读

相关【Vue】Vue-router中的history模式和hash模式

为了构建SPA（单页面应用），Vue引入了前端路由Vue-Router，前端路由的核心就是在改变视图的同时不会向后端发起请求。Vue-Router有两种模式：hash模式和hi

布满荆棘的人生/ 2022年11月28日 13:36/ 0 赞/ 202 阅读

相关 Vue中hash和history两种路由模式的区别

Vue中的两种路由模式Hash和History 前言：我遇到的两个问题 Hash模式 History模式 Vue文档对路由模式~阐述前言：我

墨蓝/ 2022年09月04日 04:46/ 0 赞/ 229 阅读

相关 vue-router的两种模式（hash和history）及区别

为什么要有hash 和history？对于Vue这类渐进式前端开发框架，为了构建SPA（单页面应用），需要引入前端路由系统，这也就是Vue-Router存在的意义。前端

亦凉/ 2022年01月28日 05:19/ 0 赞/ 244 阅读

相关 vue router中hash模式和history模式的区别

面试问答 hash 模式与 history 模式的区别，这个也是面试常问的问题，不要小看这道题其实问到这里的时候那个面试官应该是个大牛，开发经验丰富，这个题其实就

朴灿烈づ我的快乐病毒、/ 2021年09月20日 11:24/ 0 赞/ 350 阅读

相关 vue中两种history和hash模式的使用

vue2.0中的history和hash模式 1. history模式 import Vue from 'vue'; import Router

电玩女神/ 2021年09月03日 05:13/ 0 赞/ 815 阅读