vue微信分享出來的鏈接點(diǎn)開是首頁問題的解決方法
最近工作上遇到了這樣一個(gè)Bug：“vue微信分享出來的鏈接點(diǎn)開是首頁”
公司網(wǎng)站有PC端和移動(dòng)端，兩個(gè)版本。其中如果手機(jī)訪問PC端，則自動(dòng)跳轉(zhuǎn)到移動(dòng)端。（這是常規(guī)操作，沒啥稀奇點(diǎn)。）
可神奇的問題來了。
在移動(dòng)端中有微信分享功能，如果手機(jī)直接訪問手機(jī)端的地址進(jìn)入子頁面分享，點(diǎn)開分享的鏈接進(jìn)入的是子頁面。但是如果是從PC端跳轉(zhuǎn)進(jìn)入手機(jī)端，分享子頁面鏈接打開將會(huì)是主頁。
這個(gè)問題我也百度了各種方法，折騰了一天，然而都沒啥用。
最后自己想了一個(gè)替代方案：
在static目錄下新建一個(gè)名為html的文件夾，在html文件夾中再新建一個(gè)redirect.html（看到這個(gè)文件名是不是知道我要干啥了）
沒錯(cuò)，我們做一個(gè)重定向。
html中寫入以下內(nèi)容
<script>
let url = location.href.split('?')
let pars = url[1].split('&')
let data = {}
pars.forEach((n, i) => {
let p = n.split('=')
data[p[0]] = p[1]
})
if (!!data.app3Redirect) {
self.location = decodeURIComponent(data.app3Redirect)
}
</script>
只需要script標(biāo)簽就可以了，反正只是做重定向。
接下來就簡單了，原本設(shè)置給微信的分享鏈接是
shareWxLink = window.location.href
現(xiàn)在我們給他改成
shareWxLink = window.location.href.split('#')[0] + 'static/html/redirect.html?app3Redirect=' + encodeURIComponent(window.location.href)
這樣，我們就把當(dāng)前頁的地址編碼后放到參數(shù)app3Redirect里面，當(dāng)訪問redirect.html時(shí)將自動(dòng)重定向到解碼后的原地址。
到此，終于把這個(gè)坑爹的Bug給修復(fù)了。
以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
Vue實(shí)現(xiàn)阻止瀏覽器記住密碼功能的三種方法
本文主要介紹了Vue實(shí)現(xiàn)阻止瀏覽器記住密碼功能的三種方法，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2023-06-06
Vue.js通過簡潔的API提供高效的數(shù)據(jù)綁定和靈活的組件系統(tǒng)。在前端紛繁復(fù)雜的生態(tài)中，Vue.js有幸受到一定程度的關(guān)注，所以本文將從各方面對Vue.js的組件開發(fā)做一個(gè)深入介紹。有需要的朋友們可以參考借鑒。2016-10-10
vuejs移動(dòng)端實(shí)現(xiàn)div拖拽移動(dòng)
這篇文章主要為大家詳細(xì)介紹了vuejs移動(dòng)端實(shí)現(xiàn)div拖拽移動(dòng)，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-07-07
這篇文章主要介紹了vue 修改vant自帶的樣式過程，具有很好的參考價(jià)值，希望對大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-04-04
vue.js中使用echarts實(shí)現(xiàn)數(shù)據(jù)動(dòng)態(tài)刷新功能
這篇文章主要介紹了vue.js中使用echarts實(shí)現(xiàn)數(shù)據(jù)動(dòng)態(tài)刷新功能,需要的朋友可以參考下2019-04-04
VueJS 組件參數(shù)名命名與組件屬性轉(zhuǎn)化問題
這篇文章主要介紹了VueJS 組件參數(shù)名命名與組件屬性轉(zhuǎn)化問題，非常不錯(cuò)，具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2018-12-12
Vue中img的src是動(dòng)態(tài)渲染時(shí)不顯示的解決
今天小編就為大家分享一篇Vue中img的src是動(dòng)態(tài)渲染時(shí)不顯示的解決，具有很好的參考價(jià)值，希望對大家有所幫助。一起跟隨小編過來看看吧2019-11-11
這篇文章主要介紹了vue3彈出層V3Popup實(shí)例詳解,本文給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2021-01-01
axios解決高并發(fā)的方法:axios.all()與axios.spread()的操作
這篇文章主要介紹了axios解決高并發(fā)的方法:axios.all()與axios.spread()的操作，具有很好的參考價(jià)值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-11-11
由于 Vue 會(huì)在初始化實(shí)例時(shí)進(jìn)行雙向數(shù)據(jù)綁定，使用Object.defineProperty()對屬性遍歷添加 getter/setter 方法，所以屬性必須在 data 對象上存在時(shí)才能進(jìn)行上述過程 ，這樣才能讓它是響應(yīng)的，這篇文章主要介紹了Vue中$set()的使用方法場景分析,需要的朋友可以參考下2023-02-02