完整微信小程序(Java后端) 技术贴目录清单页面(必看)

图标。组件属性的长度单位默认为px,2.4.0起支持传入单位(rpx/px)。

属性 类型 默认值 必填 说明 最低版本
type string icon的类型,有效值:success, success_no_circle, info, warn, waiting, cancel, download, search, clear 1.0.0
size number/string 23 icon的大小 1.0.0
color string icon的颜色,同css的color 1.0.0

示例代码

在开发者工具中预览效果

index.js

Page({data: {iconSize: [20, 30, 40, 50, 60, 70],iconColor: ['red', 'orange', 'yellow', 'green', 'rgb(0,255,255)', 'blue', 'purple'],iconType: ['success', 'success_no_circle', 'info', 'warn', 'waiting', 'cancel', 'download', 'search', 'clear']}
})

index.wxml

<view class="group"><block wx:for="{{iconSize}}"><icon type="success" size="{{item}}"/></block>
</view><view class="group"><block wx:for="{{iconType}}"><icon type="{{item}}" size="40"/></block>
</view><view class="group"><block wx:for="{{iconColor}}"><icon type="success" size="40" color="{{item}}"/></block>
</view>

index.wxss

.intro {margin: 30px;text-align: center;
}

运行效果:

微信搜一搜【java1234】关注这个放荡不羁的程序员,关注后回复【资料】有我准备的一线大厂笔试面试资料以及简历模板

微信小程序图标 icon组件相关推荐

  1. A095_day01_微信小程序入门与组件

    目录 微信小程序入门与组件 - Day01 1.内容介绍 2.微信小程序简介(了解) 2.1.什么是小程序 2.2.微信小程序与app的区别 2.3.小程序在入口 2.4.微信小程序的工作原理 2.5 ...

  2. 微信小程序_基础组件学习02

    微信小程序_基础组件学习02 swiper组件 swiper是滑块容器,也就是手机端的轮播图. swiper组件有两部分组成swiper和swiper-item. swiper-item需要放在swi ...

  3. 微信小程序授权登录 组件的封装

    微信小程序授权登录 组件的封装 新建components文件 写wxml文件 wxss部分 js部分 json引用 页面使用 页面js 授权登录 流程如下: 因为多个页面功能需要登录状态 所以做了个组 ...

  4. 微信小程序上传组件(可同时长传图片+视频)

    写了个微信小程序上传组件,同时支持上传视频+图片,并且可以返显. 废话不多说,上代码: upload.wxml <view class="clearfix"><v ...

  5. 微信小程序自定义标签组件component封装、组件生命周期,组件通信

    微信小程序自定义标签组件component封装.组件生命周期,组件通信 本文来说下小程序的自定义标签组件封装. 相比于vue,react的非路由组件,微信小程序的component组件要麻烦些,而且生 ...

  6. 微信小程序用vant组件制作通讯录

    微信小程序用vant组件制作通讯录 效果图: 代码如下: .wxml: 在这里插入<van-index-bar index-list="{{ indexList }}"> ...

  7. 微信小程序基于swiper组件的tab切换

    代码地址如下: http://www.demodashi.com/demo/14010.html 一.前期准备工作 软件环境:微信开发者工具 官方下载地址:https://mp.weixin.qq.c ...

  8. 微信小程序使用image组件显示图片的方法

    本文实例讲述了微信小程序使用image组件显示图片的方法.分享给大家供大家参考,具体如下: 1.效果展示 2.关键代码 ① index.wxml 代码如下: <image style=" ...

  9. 【微信小程序】选择器组件picker

    文章目录 [微信小程序]选择器组件picker picker组件的定义 picker组件的类型 picker属性 共同的属性 时间选择器time 参考 [微信小程序]选择器组件picker picke ...

  10. 微信小程序的父子组件传值

    微信小程序的父子组件传值 如果小程序中有可复用的UI且具有一定的功能性,就可以使用自定义组件将其封装起来. 下面介绍父子组件的数据传递方法,以及一个简单的组件和一个复杂的组件示例. 二.父子组件传递数 ...

最新文章

  1. SQLite API
  2. python插件安装包_python 离线安装插件包
  3. 多项式加法c语言数组解,急!!!!c语言:求n次多项式的加法和乘法
  4. 【Spring MVC 之应用篇】3_SpringMVC常见注解
  5. Linux Tomcat 安装
  6. 春招我借这份PDF的复习思路,论程序员成长的正确姿势
  7. 百度贴吧发帖软件_贴吧自动发帖软件
  8. QT [007] QT UI 的控件操控问题 - 如何操控多嵌套的UI控件
  9. MYSQL 无重复插入数据更新语法 sql一句话使insert时若主键重复则更新
  10. eureka 客户端服务启动了又失败了_SpringCloud-Eureka(2)
  11. 计算机组成原理白中英ppt,计算机组成原理(本全)白中英.ppt
  12. 企业新闻媒体资源有哪些类型?从哪里找?
  13. 小游戏--三子棋——N子棋(实现)
  14. 对 Linux 初级、中级、高级用户非常有用的 60 个命令(转)
  15. 六级(2020/12-3) Text 1
  16. bzero与memset
  17. 关于Redis的数据清理
  18. Web Services 应用开发学习笔记(三):XML模式定义
  19. 收藏 | 什么是功率因数?
  20. 重庆的小面50强[转自经典重庆]

热门文章

  1. 升级IE11时,失败报错如何解决
  2. javaweb网上鞋店
  3. 继续教育计算机组成原理a试卷,计算机组成原理试卷.docx
  4. Lenovo联想键盘关闭fn功能恢复F1-F12按键
  5. 自然语言处理入门新手上路
  6. [转]Go语言(golang)开源项目大全
  7. 电商实训三:网店经营
  8. 关于 XcodeGhost , 如何进行保护APP安全性
  9. CSDN博客下载器的使用教程
  10. electron中加载html,electron页面加载函数loadFile