javascript - vue組件中使用百度分享初次加載失敗?
問題描述
我的vue項目中使用了百度分享,代碼如下template中js(放在created中)
初次加載時,百度分享的按鈕圖片都不顯示,F12發現class和點擊事件都未生效刷新后就正常顯示使用
在mounted中使用this.$nextTick,也有點問題
mounted() {
let _this = this;this.$nextTick(function () { window._bd_share_config = {common : { bdText : _this.art.title, bdDesc : _this.art.abstract, bdPic : 'http://www.jubao56.com/upload_admin/2016-07-05%2010:08:50-banner4_m.jpg',},share : [{ tag:'share_0', bdSize : 24}], }; const s = document.createElement(’script’); s.type = ’text/javascript’; s.src = ’http://bdimg.share.baidu.com/static/api/js/share.js?v=89860593.js?cdnversion=’ + ~(-new Date() / 36e5); document.body.appendChild(s);}) },
問題解答
回答1:js寫在 mounted事件里,this.$nextTick(() => { ...... });
百度分享的 js可能會 立即執行并查找DOM元素。created事件觸發時,并不存在DOM
相關文章:
1. pip安裝提示Twisted錯誤問題(Python3.6.4安裝Twisted錯誤)2. javascript - vue-echarts-v3使用的過程中折線圖區域呈漸變色。3. 關于Mysql聯合查詢4. centos7 編譯安裝 Python 3.5.1 失敗5. mysql - 這個數據庫合計用 視圖做,和直接算好存在數據庫里,到時候調用起來哪個快?6. python - beautifulsoup獲取網頁內容的問題7. python - 能通過CAN控制一部普通的家用轎車嗎?8. 人工智能 - python 機器學習 醫療數據 怎么學9. mysql - 分庫分表、分區、讀寫分離 這些都是用在什么場景下 ,會帶來哪些效率或者其他方面的好處10. c++ - 請問MySQL_Connection::isReadOnly 怎么解決?
