小程序之如何设置图片以及image组件的属性

admin 1565次浏览

摘要:1. 设置图片,小程序支持两种引用图片方法,一种是本地引用,一种是网络资源引用。 但是引用本地图片的的时候不能用wxml样式去引用本地的

1. 设置图片,小程序支持两种引用图片方法,一种是本地引用,一种是网络资源引用。

但是引用本地图片的的时候不能用wxml样式去引用本地的图片,不会报错,也没效果。就是在wxss页面中不能引用本地的图片。这个时候就要用image组件了。

2. 加载本地的图片

src是图片的相对路径,一般图片放在images这个文件夹中。这样就可以显示了。

相反如果你是在wxss里这样写是没有效果的。

看下效果:

加载网络资源的图片:

直接在src这个属性附上地址,它会自动加载。

这个imageUrl是在js文件中数据

data:{

imageUrl:"http://img1.3lian.com/2015/w7/85/d/101.jpg"

},

3. image的属性

需要注意image组件默认宽度300px、高度225px,然后主要是mode这个属性。mode有12种模式,其中3种是缩放模式,9种是裁剪模式。

相关文章
友情链接