最近被問到VueRouter的兩種模式的區別，答：Hash模式url上有#號，History模式url上沒有#。完！
也不知道這么回答對不對，就看了看資料，發現也就是這個意思吧！
Vue-Router中有兩種URL模式，一個是Hash(默認)，一個是History模式。
const router = new VueRouter({ mode: 'history', routes: [{...}] }) History模式需要后台設置，具體設置請看文檔
說說這個#的是什么
1. #的含義
#（Hash）代表網頁中的一個位置，右邊就是該位置的標識符，2010年twitter第一次將#用到URL中，（這是主流網站第一次大規模的使用），比如：http://www.example.com/index.html#print 就代表網頁中index.html的print位置。瀏覽器讀取這個URL后會自動將頁面滾動到print這個標識符的位置，在html中指定標識符的方法有兩種：
1.使用錨點 <a name="print"></a>
2.使用id屬性<div id="print"></div>
2. http請求完全忽略 #
#是用來指示瀏覽器的動作，對服務器完全無用，所以http請求中沒有#，比如訪http://www.example.com/index.html#print
GET index.html HTTP/1.1
Host: www.example.com //#print完全被忽略 由於請求將#后的字符完全忽略，但是可以將#轉義為%23
例如：http://www.example.com/index.html?color=#fff 改為 http://www.example.com/index.html?color=%23fff
GET index.html?color
GET index.html?color=#fff //轉義后 Host: www.example.com 3. 修改#后面的url不會觸發網頁加載
比如：http://www.example.com/index.html#location1 改為 http://www.example.com/index.html#lcoation2
瀏覽器不會發起任何請求。
4. 但是改變#會改變瀏覽器的訪問歷史
每改變一次#后面的，都會在瀏覽器的訪問歷史中增加一個記錄，使用倒退按鈕可以返回，前進等。這對於Ajax應用程序特別有用，
用不同的#值，代表不同的訪問狀態，對ie6/7沒用，他們不會應為#后的變化而增加歷史記錄。
5. window.location.hash讀取#值
window.location.hash 的值可讀可寫，讀取來判斷狀態是否改變，寫入時可以在不重載網頁的前提下，添加一條歷史訪問記錄。
6. onhashchange事件
onhashchange是一個HTML5新增的事件，hash變化時就會觸發這個事件
三種事件監聽方式：
window.onhashchange = foo <div onhashchange="foo()"> window.addEventlistener('hashchange',foo,false) 不支持該事件的瀏覽器可以用setInterval監控location.hash的變化
7. google抓取#的機制
默認情況下google爬蟲會忽略URL的#部分，但是如果你希望，Ajax生成的內容可以被爬蟲讀取，name可以使用#!
google會自動將后面的內容轉化成查詢字符串_escaped_fragment_的值，即#!被?_escaped_fragment_=替換
http://twitter.com/#!/username //轉化為 http://twitter.com/?_escaped_fragment_=/username 總結
對URL中的# （Hash）對照阮一峰老師的博客 做了個簡單總結，后期要對history等關鍵知識進行一下總結，先插個旗。