說在前面
最近由于項(xiàng)目需要所以學(xué)了下小程序避归，也做了一些東西荣月，隨后便有了以下的一些總結(jié)了，先說說關(guān)于如何解決小程序背景圖片pc端調(diào)試完美不缺梳毙，而在真機(jī)調(diào)試的時候卻消失不見的情況喉童。
問題描述
最近做項(xiàng)目的時候要實(shí)現(xiàn)一個導(dǎo)航頁面，我的想法是用一張好看的圖片做背景顿天，在pc端調(diào)試的時候效果不錯，但是在真機(jī)調(diào)試的時候卻發(fā)現(xiàn)那張背景圖片不翼而飛了蔑担。
老規(guī)矩牌废，以源碼為導(dǎo)向
index.xml
<view class="container" bindtap="coming"></view>
index.wxss
page{
height: 100%;
}
.container{
background-image: url("../resources/images/wait.png");
background-size:100% 100%;
background-repeat:no-repeat;
}
在pc端調(diào)試的時候已經(jīng)可以看到出現(xiàn)背景圖片了，但是在真機(jī)調(diào)試的時候卻發(fā)現(xiàn)沒有背景圖片啤握，那么原因是什么呢鸟缕？我谷歌了多次之后以及翻看了小程序的文檔之后發(fā)現(xiàn)這可以說是小程序的一個bug，我相信小程序在不久會解決這個bug排抬，但是我們現(xiàn)在要用到懂从，總不能等到對方法解決了bug我們才用背景圖片吧？對的蹲蒲，這里提供了幾種解決方法番甩！
- 解決方法一：在使用背景圖片的時候用網(wǎng)絡(luò)圖片，就是用外鏈的形式届搁，比如你將這張圖片放到你的服務(wù)器缘薛，如：https://xxxx/xxx.jpg；
- 解決方法二：將背景圖片使用編碼base64進(jìn)行轉(zhuǎn)換卡睦，可以在這個網(wǎng)址進(jìn)行 http://tool.css-js.com/base64.html 轉(zhuǎn)換宴胧，如：background-image: url("轉(zhuǎn)換后得到的編碼文本")，如果多次使用的話可以將該值設(shè)置為全局變量表锻，再在js文件進(jìn)行引用即可恕齐；
- 解決方法三：使用image組件而去掉背景圖片；
Note:發(fā)布的這些文章全都是自己邊學(xué)邊總結(jié)的瞬逊，難免有紕漏显歧，如果發(fā)現(xiàn)有不足的地方仪或，希望可以指出來，一起學(xué)習(xí)咯追迟，么么噠溶其。
開源愛好者，相信開源的力量必將改變世界:
** osc :** https://git.oschina.net/xi_fan
github: https://github.com/wiatingpub
