zoukankan      html  css  js  c++  java
  • 四: 基本标签

    一、Icon 图标
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    /* ---page/test/test.wxml----*/
     
    <view class="group">
      <block wx:for="{{iconType}}">
        <icon type="{{item}}" size="45"/>
      </block>
    </view>
     
    <view class="group">
      <block wx:for="{{iconColor}}">
        <icon type="success" size="45" color="{{item}}"/>
      </block>
    </view>
     
    <view class="group">
      <block wx:for="{{iconSize}}">
        <icon type="success" size="{{item}}"/>
      </block>
    </view>
     
    /* ---page/test/test.wxml----*/
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    /* ---page/test/test.js----*/
     
    Page({
      data: {
        iconSize: [20, 30, 40, 50, 60, 70],
        iconColor: [
          'red''orange''yellow''green''rgb(0,255,255)''blue''purple'
        ],
        iconType: [
          'success''info''warn''waiting''safe_success''safe_warn',
          'success_circle''success_no_circle''waiting_circle''circle''download',
          'info_circle''cancel''search''clear'
        ]
      }
    })
     
    /* ---page/test/test.js----*/
        
     
    效果图是这样的。。。之后在把属性图附上。。就是样式。这章基本上没啥可说的。
    属性名类型默认值说明
    type String
     
    icon的类型,有效值:success, success_no_circle, info, warn, waiting, cancel, download, search, clear
    size Number 23 icon的大小,单位px
    color Color
     
    icon的颜色,同css的color
    二、text 
    这个其实也没什么可说的。。他相当于 html的 span标签 是个行内元素。两个text标签在一起并不会换行。
     
    三、progress 进度条
    percent Float 百分比0~100
    showInfo Boolean false 在进度条右侧显示百分比
    strokeWidth Number 6 进度条线的宽度,单位px
    color Color #09BB07 进度条颜色
    active Boolean false 进度条从左往右的动画
    1
    2
    3
    4
    5
    6
    7
    8
    9
    /* ---page/test/test.wxml----*/
     
    <progress percent="20" show-info />
    <progress percent="40" stroke-width="12" />
    <progress percent="60" color="pink" />
    <progress percent="80" active />
     
    /* ---page/test/test.wxml----*/
    也是样式。。其实可以 在属性里  percent={{data}} 来操作。然后递增。比如说 上传文件的时候 就可以使用他。。
     
     
     
  • 相关阅读:
    Spark调优之JVM调优
    hive连接MySQL报错
    Kafka安装
    Linux系统Mini版配置相关
    Linux系统完整安装在虚拟机Mini
    hive_异常_01_(未解决)FAILED: Execution Error, return code 1 from org.apache.hadoop.hive.ql.exec.DDLTask. org.apache.hadoop.hbase.HTableDescriptor.addFamily(Lorg/apache/hadoop/hbase/HColumnDescriptor;)V
    HBase的详细安装部署
    MyCat实现数据库与数据库之间的读写分离
    git+github
    react--入门
  • 原文地址:https://www.cnblogs.com/dandingjun/p/6088211.html
Copyright © 2011-2022 走看看