wxml

<i-cell-group>
    <i-cell title="测试" is-link>
          <i-icon slot="icon" type="feedback" size="28" color="#80848f" />
    </i-cell>
    <i-cell title="测试" is-link url="../../pages/dashboard/index">
          <i-icon slot="icon" type="activity" size="28" color="#80848f" />
    </i-cell>
    <i-cell title="测试" is-link url="../../pages/dashboard/index">
          <i-icon slot="icon" type="collection" size="28" color="#80848f" />
    </i-cell>
    <i-cell title="测试" is-link url="../../pages/dashboard/index">
            <i-icon slot="icon" type="coordinates" size="28" color="#80848f" />
    </i-cell>
</i-cell-group>
 
页面效果
 
在<i-cell>里面嵌套<i-icon> 要注意slot属性，关于list与icon的详细用法
https://weapp.iviewui.com/docs/guide/start

微信小程序 IView List与Icon结合使用的更多相关文章

  1. 微信小程序内容组件图标 icon

    小程序内置了一下图标可以用 需要自定义图标的看这里 ==>微信小程序中使用iconfont/font-awesome等自定义字体图标 小程序内置图标使用示例 <icon type=&quo ...

  2. 微信小程序中使用阿里ICON图标

    由于微信小程序不支持ttf字体,只支持base64的问题,需要把从图库下载下来的字体文件中的ttf文件转码为base64后使用如图 需将图中箭头所指的字体文件通过 https://transfonte ...

  3. 小程序开发运营必看：微信小程序平台运营规范

    一.原则及相关说明 ​ 微信最核心的价值,就是连接——提供一对一.一对多和多对多的连接方式,从而实现人与人.人与智能终端.人与社交化娱乐.人与硬件设备的连接,同时连接服务.资讯.商业. ​ 微信团队一 ...

  4. 微信小程序之mpvue+iview踩坑之旅

    因为之前参照微信的原生的文档写过一些小程序的demo,写的过程比较繁琐,后来出了美团的mpvue,可以直接使用vue开发,其他的不作对比,这篇文章记录一下踩坑之旅. 参照mpvue http://mp ...

  5. 微信小程序引入外部组件 iView Weapp

    iview Weapp组件的使用方法: 1. 下载小程序组件库 (前提是你已经有了项目目录) 你可以直接去github把iView Weapp的代码下载下来,也可以用过npm来下载. github地址 ...

  6. 微信小程序UI组件库 iView Weapp快速上手

    概述 今天在网上突然看到iView新出了一个微信小程序的组件库iView Weapp,自己就上手试了一下,发现用起来还是不错的,把自己使用的过程与大家分享下. 一 预览iView组件 1.可以在手机上 ...

  7. 微信小程序把玩（十一）icon组件

    原文:微信小程序把玩(十一)icon组件 这些是提供的所支持的图标样式,根据需求在此基础上去修改大小和颜色. 主要属性: 使用方式: wxml <!--成功图标--> <icon t ...

  8. 微信小程序_(组件)icon、text、rich-text、progress四大基础组件

    微信小程序基础组件官方文档 传送门 Learn 一.icon图标组件 二.rich-text富文本组件 三.text文本组件 四.progress进度条组件 一.icon图标组件 type:icon的 ...

  9. 小程序开发-iView Weapp微信小程序UI组件库入门使用

    iView Weapp UI组件库 今天来试试iView Weapp 这个微信小程序组件库,看看好不好用~~ 官网地址: http://inmap.talkingdata.com/wx/index_p ...

随机推荐

  1. 买SD卡和TF卡要买U3和A2协议的

    A3 最低平稳写入30M/s

  2. Tomcat配置多域名 Alias

    在Tomcat配置多域名,目的是和apache相对应,实现多域名访问. 使用 < Alias></ Alias>,务必注意,使用的是首字母大写. 我刚开配置使用小写,如果hos ...

  3. mysql学生成绩排名,分组取前 N 条记录

    转载  https://blog.csdn.net/jslcylcy/article/details/72627762 score表: CREATE TABLE `score` ( `student_ ...

  4. Android传感器【转】

    本文转载自:http://blog.csdn.net/ffmxnjm/article/details/52101592?locationNum=3&fps=1 传感器的意义 事实上,目前智能手 ...

  5. leetcode-mid- 50. Pow(x,n)-NO

    mycode  time limited 例如 x=0.00001 n=2147483647 参考: class Solution(object): def myPow(self, x, n): &q ...

  6. 清北学堂2019.7.18 & 清北学堂2019.7.19

    Day 6 钟皓曦 经典题目:石子合并 可以合并任意两堆,代价为数量的异或(^)和 f[s]把s的二进制所对应石子合并成一堆所花代价 枚举s的子集 #include<iostream> u ...

  7. ThreadLocal 源码分析

    线程局部变量 ThreadLocal 用于实现线程隔离和类间变量共享. 创建实例 /** * 当前 ThreadLocal 实例的哈希值 */ private final int threadLoca ...

  8. 测开之路一百五十五：jquery-validation前台数据验证

    前面做的wtform验证是服务器端的验证,需要把数据传输到服务器,服务器验证后再吧结果传输到前端,网络慢的时候,用户体验不好,所以需要前端验证,且后端验证不能少 传统的js或者jquery如果要验证信 ...

  9. Linux监控命令之==>top

    一.命令说明 top 命令能够实时监控系统的运行状态,并且可以按照CPU.内存和执行时间进行排序,同时top 命令还可以通过交互式命令进行设定显示,通过top 命令可以查看即时活跃的进行. 二.参数说 ...

  10. 四种方法 恢复损坏的Excel文档

    四种方法 恢复损坏的Excel文档 打开一个以前编辑好的Excel工作簿,却发现内容混乱,无法继续进行编辑,而且还不能够进行打印.这是很多朋友在处理Excel文件时都可能会遇到的一个问题,面对这种情况 ...