微信小程序 background-image的圖片真機調試和體驗版中無法加載

前言

在我的微信小程序項目中,我一般在引用靜態本地資源時用相對路徑，然後我就碰到一個坑：我在給一個view添加背景圖時，本地查看效果正常，但是使用真機調試或者體驗版查看是加載不出來的。

原先代碼

<view style="background-image:url("../../images/pics/bg_img.png')">
</view>

解決方案

說明:注意不要以/開頭，不然也加載不出來,圖片名最好不要用中文，否則可能也加載不出來。

<view style="background-image:url("images/pics/bg_img.png')">
</view>

擴展

在wxss中圖片使用本地路徑會報錯，解決方案是轉換成bas64編碼。
我這裏建議：要使用背景圖片時儘量把圖片轉成base64編碼,在wxss裏面添加背景圖，這裏提供一個網址用於轉換圖片base64編碼：http://tool.chinaz.com/tools/imgtobase。