Bootstrap

uniapp开发微信小程序 ,使用本地图片做背景图应该怎么处理

<view class="answering_page" v-if="bgImg" :style="{'backgroundImage':backBg}">
</view>

data(){
return{
bgImg: '/static/image/background.png',
}},
computed:{
            backBg(){
               //这里在引用全局定义的图片转base64方法,处理成base64主要是在开发者工具中调试便于图片能够正常显示
                return 'url('+getApp().globalData.urlToBase64(this.bgImg)+')'
            },
}
//图片转换base64
urlToBase64(url){
            let imgBase64 = wx.getFileSystemManager().readFileSync(url, "base64"),
            base64Url = `data:image/png;base64,${imgBase64}`;
            return base64Url;
            }

注意,把获取可用的base64地址的方法放在computed 里面是非常必要的。如果放在methods里面初次进入这个页面时候会报错(除了首页之外)。这里就是跟methods和computed特性有关。

;