【微信小程序】image组件 API 协同工作和发布

目录

🍒小程序的宿主环境 - 组件

🍈image 组件的基本使用

🥭image 组件的 mode 属性

🍓小程序的宿主环境 - API

🥦小程序 API 概述

🍅小程序 API 的 3 大分类

🍘协同工作和发布 - 协同工作

🍊了解权限管理需求

🥝了解项目成员的组织结构

🍉小程序的开发流程

---

🍒小程序的宿主环境 - 组件

🍈image 组件的基本使用

WXML:

<image></image>
<image src="/image/a.jpg"></image>

WXSS:通过边框线证明image 有默认的宽和高

image{
  border: 1px solid rgb(127, 20, 214);
}

🥭image 组件的 mode 属性

image 组件的 mode 属性用来指定图片的裁剪和缩放模式，常用的 mode 属性值如下：

mode 值	说明
scaleToFill	（默认值）缩放模式， 不保持纵横比缩放图片 ，使图片的宽高完全拉伸至 填满 image 元素
aspectFit	缩放模式， 保持纵横比缩放图片，使图片的长边能完全显示出来 。也就是说，可以完整地将图片显示出来。
aspectFill	缩放模式， 保持纵横比缩放图片，只保证图片的短边能完全显示出来 。也就是说，图片通常只在水平或垂直方 向是完整的，另一个方向将会发生截取。
widthFix	缩放模式， 宽度不变，高度自动变化 ，保持原图宽高比不变
heightFix	缩放模式， 高度不变，宽度自动变化 ，保持原图宽高比不变

aspectFit：

 

<image src="/image/a.jpg" mode="aspectFit"></image>

widthFix： 

 

<image src="/image/a.jpg" mode="widthFix"></image>

🍓小程序的宿主环境 - API

🥦小程序 API 概述

小程序中的 API 是由宿主环境提供的 ，通过这些丰富的小程序 API，开发者可以方便的调用微信提供的能力， 例如：获取用户信息、本地存储、支付功能等。

🍅小程序 API 的 3 大分类

小程序官方把 API 分为了如下 3 大类：

• 事件监听 API

特点：以 on 开头，用来 监听某些事件的触发

举例：wx. onWindowResize (function callback) 监听窗口尺寸变化的事件

• 同步 API

特点1：以 Sync 结尾的 API 都是同步 API

特点2：同步 API 的执行结果，可以通过函数返回值直接获取，如果执行出错会抛出异常

举例：wx. setStorageSync ('key', 'value') 向本地存储中写入内容

• 异步 API

特点：类似于 jQuery 中的 $.ajax(options) 函数，需要通过 success、fail、complete 接收调用的结果

举例：wx. request () 发起网络数据请求，通过 success 回调函数接收数据

🍘协同工作和发布 - 协同工作

🍊了解权限管理需求

在中大型的公司里，人员的分工非常仔细：同一个小程序项目，一般会有不同岗位、不同角色的员工同时参与设计与开发。

此时出于管理需要，我们 迫切需要对 不同岗位、不同角色的 员工的权限进行边界的划分 ，使他们能够高效的进行协同工作。

🥝了解项目成员的组织结构

 

🍉小程序的开发流程