1. 程式人生 > >vue中呼叫微信公眾號的圖片預覽

vue中呼叫微信公眾號的圖片預覽

今天做專案的時候遇到這個問題,不多說廢話,直接上步驟:

   引入wxjs

    <script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>

下面寫個函式呼叫:

   /*呼叫微信預覽圖片的方法*/
        funcReadImgInfo(value) {
          
            WeixinJSBridge.invoke("imagePreview", {
                "urls": [this.HTTP + value],
                "current": this.HTTP + value
            });
             
        }

然後在html中呼叫它:

 <div v-for="(value,index) in commend.rReviewImgs.split(',')" class="img-list" :class="(index+1)%3==0?'noneRight':''">
                                <img v-lazy="HTTP + value" style="width:100px;height:100px;" @click="funcReadImgInfo(value)">
                            </div>

實際中的圖片路徑都是需要我們傳入的,不過測試在微信中測試或者用微信開發者工具,建議不要用瀏覽器。