微信小程序-image图片显示

众所周知的是php中想让图片正常显示出来，就需要知道图片的src-路径，知道了路径，不仅在html代码中可以正常显示，在css文件也可以正常显示，那么在小程序里边图片要怎么显示呢？

其实小程序里边想要显示图片，也是有两种途径，方法和php中大同小异，不过需要注意的是，在wxss样式文件里边是不识别本地的图片url的，但是它是认可网络路径图片。

让我们先来看一下开发者文档中关于image的介绍

第一种：加载本地图片，只要是路径没问题就会正常显示

<image src="../images/1.jpg" mode="aspectFill">  
</image> 

第二种呢就是通过js加载传输或者利用wxss样式修改背景图片

wxml模板代码

<image src="{{imageUrl}}" mode="aspectFill">  
</image>  

js代码

data:{  
    imageUrl:"http://www.runoob.com/try/demo_source/paris.jpg"  
}, 

或者直接在src属性上写网络图片地址

<image class="image_frame" src="http://www.runoob.com/try/demo_source/paris.jpg" mode="aspectFill">  
</image>  

如果在wxss样式中用到背景图片就必须用网络图片了，使用本地图片地址会报错的

.main{
  background-image: url(http://www.runoob.com/try/demo_source/paris.jpg);
}