如果在wxml文件中使用本地路径图片作为背景图,在微信开发者工具中可以显示出来,但运行到手机上显示不出来,解决如下:
方法一( require 引入)
使用 require 引入本地图片,require方式获取的值可以直接生成base64格式
data中声明:imgBacUrl:require('@/static/images/风景.png'),
<view class="" :style="{'background': 'url('+ imgBacUrl +') no-repeat;background-size: 100%'}">
<view class=""></view>
</view>
方法二(使用网络图片)
使用网络图片
background: url('https://img2.baidu.com/it/u=355673106,1614830790&fm=253&fmt=auto&app=138&f=JPEG?w=800&h=500') no-repeat center;
方法三(使用在线转换工具)
使用在线转换工具
http://www.jsons.cn/img2base64/
方法四(使用< image />标签)
使用<image/>标签替换background
<image src="本地图片" ></image>