【微信小程序】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 回调函数接收数据


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


🍊了解权限管理需求


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


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


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


🍉小程序的开发流程

相关文章
|
1月前
|
小程序 前端开发 JavaScript
在线课堂+工具组件小程序uniapp移动端源码
在线课堂+工具组件小程序uniapp移动端源码
35 0
在线课堂+工具组件小程序uniapp移动端源码
|
2月前
|
小程序 数据可视化 JavaScript
微信小程序:轻松实现时间轴组件
本文介绍了如何在微信小程序中实现一个可视化时间轴组件。该组件适用于展示用户资金流动、投资结算等时间节点,帮助用户直观了解资金去向。时间轴支持自定义节点形状、显示序号、倒序排列等功能,并通过插槽灵活定义动态内容。文中详细介绍了组件的设计与使用方法,以及如何结合动态 slot 实现自定义操作。该组件为展示用户资金信息提供了美观、易用的解决方案。
70 1
微信小程序:轻松实现时间轴组件
|
1月前
|
监控 小程序 安全
小程序的 API 做了什么处理,能够做到全局变量的隐藏
【10月更文挑战第23天】小程序的 API 通过运行环境隔离、作用域限制、数据绑定机制、事件机制、状态管理、代码封装和模块化、安全策略和权限控制以及运行时监控和检测等多种手段来实现全局变量的隐藏。这些措施共同作用,确保了小程序的安全、稳定和可靠运行,同时也提高了开发效率和代码质量。
|
2月前
|
小程序
微信小程序动态tabBar实现:基于自定义组件,灵活支持不同用户角色与超过5个tab自由组合(更新版)
微信小程序动态tabBar实现:基于自定义组件,灵活支持不同用户角色与超过5个tab自由组合(更新版)
641 1
|
2月前
|
小程序 搜索推荐 API
微信小程序:自定义关注公众号组件样式
尽管关注公众号组件的样式固定且不可修改,但产品经理的需求却需要个性化的定制。在这种情况下,我们需要寻找解决方案,以满足这些特殊需求,尽管这可能有点棘手。
81 0
微信小程序:自定义关注公众号组件样式
|
2月前
|
小程序 前端开发 JavaScript
微信小程序图表制作利器:ECharts组件的使用与技巧
微信小程序图表制作利器:ECharts组件的使用与技巧
77 1
|
2月前
|
缓存 小程序 索引
uni-app开发微信小程序时vant组件van-tabs的使用陷阱及解决方案
uni-app开发微信小程序时vant组件van-tabs的使用陷阱及解决方案
251 1
|
2月前
|
小程序 JavaScript
微信小程序之input组件及其获取用户输入信息
微信小程序之input组件及其获取用户输入信息
71 1
|
3月前
|
小程序 容器
微信小程序常用组件的简单使用 view,scroll-view,swiper,swiper-item,text,rich-text,button,image
本文介绍了微信小程序中常用组件的使用方法,包括view、scroll-view、swiper与swiper-item、text与rich-text、button以及image组件。详细解释了各组件的功能、属性以及如何在小程序页面中进行使用。
微信小程序常用组件的简单使用 view,scroll-view,swiper,swiper-item,text,rich-text,button,image
|
2月前
|
小程序 前端开发 JavaScript
小程序入门之认识view和text组件
小程序入门之认识view和text组件
93 0

热门文章

最新文章