最近寫好了幾個頁面,今天試着將各個頁面的鏈接打通,然后問題就來了...(╯︵╰)
這里看一下原來想要實現的兩個頁面跳轉的效果--點擊圖一標注的欄目可以跳轉到一個新的頁面圖二...
按照之前寫a標簽的跳轉鏈接那樣,直接輸入相對路徑,然后測試~
頁面跳轉后出來的是圖三,樣式都沒了???刷新看看,然后圖二就出來了!
以為是瀏覽器反應慢的原因,然后拿其他頁面做同樣的測試,結果也是這樣.....
然后試着不要SUI框架直接寫個簡單的頁面測試,咦,可以正常跳轉刷新,所以就猜想問題出在使用了框架這里!
這里先說一下本人解決這個問題的思路:
首先想到SUI提供的工具欄(上圖)就是可以正常跳轉刷新的a標簽,對比它們與其他a標簽的不同之處,我發現的它們多了class=“external”屬性值.
所以就試着給測試的a標簽加上這個屬性,發現頁面正常跳轉刷新了 φ(>ω<*) 開心啊 !
解決方法: 在a標簽中加上屬性值 class=“external”.
接下來看一下SUI的sm.js源碼(看得不是很懂),所以再去百度一下,終於知道這個問題的原因啦.
原因: SUI框架的Router默認開啟，會自動攔截所有鏈接的Touch行為，如果希望一個鏈接走瀏覽器原生跳轉而不使用router，可以在鏈接上增加 class="external". (或者自定義屬性)
如果需要禁用路由功能,那么可以在 zepto 之后, msui 之前使用 script $.config = {router: false} 來禁用.
由於個人經驗及掌握的太有限了,所以很多問題理解的不是很深,需要在這方面不斷的探索與積累~