javascript - vue 動態改微信分享文案的問題
問題描述
現在是這樣的 有一個需求 當我在首頁分享的時候標題 是 aaaa 當我在詳情頁分享的時候標題是 bbb 但是頁面一加載 文案就定死了 我如何動態改分享的文案 我使用的是vue2 代碼如下
我寫在main.js中 一開始執行就加載了 一開始定義了 var title = ’aaaa’ desc = ’bbbb’我的做法是 在路由跳轉到詳情頁的時候 title 改變
router.beforeEach(function (to, from, next) { if (to.path.indexOf(’/details’) != -1) { // 當跳轉到這個頁面時候改變title title = ’cccc’; desc = ’dddd’ } else { title = ’aaaa’; desc = ’bbbb’; }}
但是這樣做不行 不知道為什么 從一開始加載 title就永遠是 aaa了 除非我在詳情頁刷新 此時才會重新new vue的實例 才會改變title
分享代碼如下:
wx.onMenuShareAppMessage({ // 分享給朋友 title: title, // 我需要動態改這個標題 desc: desc, // 動態改這個描述 link: ’’, // 分享鏈接 默認以當前鏈接 imgUrl: imgUrl + ’/static/images/share.png’,// 分享圖標 // 用戶確認分享后執行的回調函數 success: function () { }); } },
問題解答
回答1:你的微信分享功能的初始化應該是在全局做的。我覺得可以將wx分享封裝成一個函數,然后將需要修改的參數暴露成接口,你這里的title。然后在不同的路由(組件)中去完成注冊以及配置。
回答2:setPageTitle:function(video){ document.querySelector(’head title’).innerText = video.title; // hack微信等webview中無法修改標題 var iframe = document.createElement(’iframe’); iframe.addEventListener(’load’, function () {setTimeout(function(){document.body.removeChild(iframe)},0) ; }); document.body.appendChild(iframe); // 標題(內容) document.querySelector(’.video_title’).innerText = video.title;},回答3:
推薦一款修改title的組件
相關文章:
1. mac里的docker如何命令行開啟呢?2. css3 - progress漸變效果css3. docker綁定了nginx端口 外部訪問不到4. 如何解決docker宿主機無法訪問容器中的服務?5. css3 隱藏文本6. angular.js - AngularJS如何添加的DOM元素且能綁定事件7. html5 - svg如何做到一組動畫循環8. vue.js - vue+webpack+vue-router 部署到nginx服務器下,非根目錄,前后端怎樣配置文件?9. 老師可以把數據庫也給我們嗎10. node.js - 在vuejs-templates/webpack中dev-server.js里為什么要exports readyPromise?
