微信小程序图片怎么用

这篇文章主要为大家展示了“微信小程序图片怎么用”，内容简而易懂，条理清晰，希望能够帮助大家解决疑惑，下面让小编带领大家一起研究并学习一下“微信小程序图片怎么用”这篇文章吧。

1：加载本地文件夹图片

1. <image class="lazy" data-src="/image/pig.jpg" mode="aspectFill">

2. </image>

服务器图片">2:加载服务器图片

wxml:

1. <image class="lazy" data-src="{{imageUrl}}" mode="aspectFill">

2. </image>

js:

1. Page({

2. data: {

3. imageUrl: "http://www.intmote.com/timg.jpg",

4.  

5. },

       g  或者直接在wxml写代码：

1. <image class="lazy" data-src="http://www.intmote.com/timg.jpg" mode="aspectFill">

2. </image>

3：给小程序页面加载一张背景图片

方法一：  使用背景图片的时候用网络图片，就是用外链的形式，比如你将这张图片放到你的服务器。

方法二：  将背景图片使用编码base64进行转换，可以在这个网址进行http://tool.css-js.com/base64.html 转换，如：background-image: url("转换后得到的编码文本")，如果多次使用的话可以将该值设置为全局变量，再在js文件进行引用即可；

以上是“微信小程序图片怎么用”这篇文章的所有内容，感谢各位的阅读！相信大家都有了一定的了解，希望分享的内容对大家有所帮助，如果还想学习更多知识，欢迎关注编程网行业资讯频道！