小程序调用图片接口API并居中显示

简介: 小程序调用图片接口API并居中显示

wxml:

    <view class='imagesize' wx:for="{{list}}" wx:key="index">
    <image src="{{list.img}}" class='in-image' >
    </image>
    </view>

js:

Page({
  data: {
    list: []
  },
  onLoad: function (options) {
    wx.request({
      url: 'https://api.apiopen.top/getImages',
      header: {
        'content-type': 'application/json'
      },
      success: res => {
        console.log(res.data)
        this.setData({
          //第一个data为固定用法,第二个data是json中的data
          list: res.data.result[0],
        })
      }
    })
  },
})

css:

.imagesize {
  display: flex;
  justify-content: center;
}
.imagesize image {
  width: 400rpx;
  height: 400rpx;
}

注意

以上代码里面每次刷新的时候,都会随机调用接口数据

因为接口文档里面有说明,传0或者不传会随机推荐图片

所以我们在掉接口的时候可以在url后面绑定参数:

url: 'https://api.apiopen.top/getImages?page=1&count=2',
相关文章
|
1天前
|
JSON 安全 API
如何高效编写API接口:以Python与Flask为例
构建RESTful API的简明教程:使用Python的Flask框架,从环境准备(安装Python,设置虚拟环境,安装Flask)到编写首个API(包括获取用户列表和单个用户信息的路由)。运行API服务器并测试在`http://127.0.0.1:5000/users`。进阶话题包括安全、数据库集成、API文档生成和性能优化。【6月更文挑战第27天】
17 7
|
1天前
|
JSON 安全 API
实战指南:使用PHP构建高性能API接口服务端
构建RESTful API的简要指南:使用PHP和Laravel,先安装Laravel并配置数据库,接着在`api.php`中定义资源路由,创建`PostController`处理CRUD操作,定义`Post`模型与数据库交互。使用Postman测试API功能,如创建文章。别忘了关注安全性、错误处理和性能优化。
12 2
|
3天前
|
人工智能 运维 Serverless
函数计算产品使用问题之启动的实例是否有调用api接口停止功能
函数计算产品作为一种事件驱动的全托管计算服务,让用户能够专注于业务逻辑的编写,而无需关心底层服务器的管理与运维。你可以有效地利用函数计算产品来支撑各类应用场景,从简单的数据处理到复杂的业务逻辑,实现快速、高效、低成本的云上部署与运维。以下是一些关于使用函数计算产品的合集和要点,帮助你更好地理解和应用这一服务。
|
2天前
|
敏捷开发 测试技术 API
阿里云云效产品使用问题之API中包含有获取测试计划的接口吗
云效作为一款全面覆盖研发全生命周期管理的云端效能平台,致力于帮助企业实现高效协同、敏捷研发和持续交付。本合集收集整理了用户在使用云效过程中遇到的常见问题,问题涉及项目创建与管理、需求规划与迭代、代码托管与版本控制、自动化测试、持续集成与发布等方面。
|
3天前
|
文字识别 小程序 算法
视觉智能开放平台产品使用合集之通过小程序接入视觉智能开放平台API能力,不是上海地域的OSS链接,该怎么办
视觉智能开放平台是指提供一系列基于视觉识别技术的API和服务的平台,这些服务通常包括图像识别、人脸识别、物体检测、文字识别、场景理解等。企业或开发者可以通过调用这些API,快速将视觉智能功能集成到自己的应用或服务中,而无需从零开始研发相关算法和技术。以下是一些常见的视觉智能开放平台产品及其应用场景的概览。
|
3天前
|
XML JSON 程序员
程序员必知:常用天气预报API接口整理(转)
程序员必知:常用天气预报API接口整理(转)
|
3天前
|
XML JSON 程序员
程序员必知:常用天气预报API接口整理(转)
程序员必知:常用天气预报API接口整理(转)
|
3天前
|
小程序 API
技术心得记录:微信小程序之图片频繁变化,几秒之后输出结果(适用于抽奖)
技术心得记录:微信小程序之图片频繁变化,几秒之后输出结果(适用于抽奖)
|
3天前
|
安全 API 数据安全/隐私保护
​6个值得测试的发送邮件接口API
在数字营销和企业通信中,发送邮件接口API如SendGrid、Mailgun、Amazon SES、AOKSend、Postmark和Sendinblue是关键工具。这些API自动化邮件发送,提高效率,确保及时送达。各具特色,如SendGrid和Mailgun适合大规模发送,AOKSend易于集成,Postmark专于事务邮件,而Sendinblue提供综合营销解决方案。根据企业需求,如邮件量、成本、功能和集成简易度,可选择最适合的API服务。
|
3天前
|
API 开发工具
企业微信SDK接口API调用-通过手机号或微信好友添加客户
企业微信SDK接口API调用-通过手机号或微信好友添加客户