微信小程序> 微信小程序image图片显示

微信小程序image图片显示

浏览量:3936 时间: 来源:vigliang

众所周知的是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);}




版权声明

即速应用倡导尊重与保护知识产权。如发现本站文章存在版权问题,烦请提供版权疑问、身份证明、版权证明、联系方式等发邮件至197452366@qq.com ,我们将及时处理。本站文章仅作分享交流用途,作者观点不等同于即速应用观点。用户与作者的任何交易与本站无关,请知悉。

  • 头条
  • 搜狐
  • 微博
  • 百家
  • 一点资讯
  • 知乎