微信分享時,標題、內容、圖標不顯示問題(時序問題)


今天在處理微信分享時,標題,內容、圖標不顯示問題,最后發現是時序問題。

只說思路,不上代碼,

我是在主頁,和詳情頁獲取的分享的參數(是一個對象,里面含有title、shareUrl、content、iconUrl屬性),

在主頁和詳情頁這些父組件拿到分享參數后,傳給他們共用的子組件footer,然后在footer組件內調用的微信分享方法;

首先,微信分享依托於微信環境,另外要想分享出正常的分享畫面,需要等到分享參數里的屬性全部拿到值(為什么這樣說,因為有些分享參數的屬性值是在后台接口的回調里面拿到的);

但是,我們不敢保證或者是沒法確定父組件里的異步接口和微信初始化哪個先進行完,我們必須保證這兩個異步事件都進行完,才能分享出正常的分享畫面,(之前就是微信初始化快與父組件的異步接口,而微信分享方法是在微信初始化回調里面調用的,所以分享出來的頁面里面不含內容、圖標、標題);那么怎樣去處理這個問題呢?

大致思路是:保證微信初始化完成並且父組件的異步接口完成,再調用微信分享方法,所以得將微信分享方法的調用從微信初始化回調里單獨拿出來,封裝一個方法,分別在微信初始化回調里調用,和父組件的接口回調方法里調用,當滿足微信初始化完成以及父組件接口調用完成之后再調用微信分享方法,也就是,誰最后完成,那么誰就調用微信分享方法,若不滿足任何一個條件,則分享參數為默認參數。

具體的做法是:1、先將微信分享方法拿出來封裝一個方法

shareReady(shareParameters){
            var self=this;
            if(self.wxReadyState&&shareParameters&&shareParameters.title&&shareParameters.shareUrl&&shareParameters.iconUrl){//滿足倆條件
                wxVue.share(shareParameters);
            }else{
                shareParameters={
                    title: "我噠 學生用品署名定制商城", // 分享標題
                    content: "每個寶寶都該擁有自己噠專屬商城,這里買的所有東東都帶着寶寶的名字哦", // 分享描述
                    shareUrl: window.location.href, // 分享鏈接
                    iconUrl: window.location.origin + "/wodaa_logo.png", // 分享圖標
                }
                wxVue.share(shareParameters);
            }
        },

2、在添加一個微信初始化成功的狀態,用於服務上面代碼

wxReadyState:false,//微信初始化完成狀態  

3、在微信初始化回調里調用

    onWxReady(){
            var self = this;
            console.log('onWxReady 微信環境加載完成的回調');
            console.log('--'+self.pageUserInfo.loginState);
            if(self.pageUserInfo.loginState != 'logining'){
                //微信登陸
                self.wxLoginEvent('ready');
            }
            self.wxReadyState=true;
            self.shareReady(self.shareParameters);
        },

4、在父組件的接口回調里調用

self.$refs.footer.shareReady(self.shareObj);

另外,今天發現這個問題,主要是之前在父組件接口沒完成時,先調用了微信分享方法,我console出來了分享的參數是含有屬性的,但當我打印具體的屬性值時卻是undefined,然后老同事說的是,我看到的打印結果不一定是當時的實際值,因為打印也是需要用時間的,雖然是以毫秒計,但是接口的返回以及微信初始化也是按毫秒計的,所以有時候不能相信打印出來的結果。。。

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM