v2.0.3

1.修复一些单位错误（带输入框的操作条）
2.纠正一些单词拼写...
3.抛弃icon标签，改回text标签的写法
4.抛弃px单位的样式文件
5.优化一些组件的字体大小
6.新增两种加载样式

demo/pages/component/bar/bar.wxml

@@ -1,7 +1,7 @@
 <custom style="height:{{CustomBar}}px;">
   <bar class="fixed gradual-pink" style="height:{{CustomBar}}px;padding-top:{{StatusBar}}px;">
     <navigator class='action' open-type="navigateBack" delta="1" hover-class="none">
-      <icon class='icon-back' />
+      <text class='icon-back'></text>
       <text>操作条</text>
     </navigator>
   </bar>
@@ -9,31 +9,31 @@
 
 <bar class="margin-top">
   <view class='action'>
-    <icon class='icon-back text-gray' />
+    <text class='icon-back text-gray'></text>
     <text>返回</text>
   </view>
 </bar>
 
 <bar class="margin-top">
   <view class='action'>
-    <icon class='icon-title text-green ' />
+    <text class='icon-title text-green'></text>
     <text>案例</text>
   </view>
   <view class='action'>
     <button class='bg-green shadow-blur sm'>添加
-      <icon class='icon-add' /> </button>
+      <text class='icon-add'></text> </button>
   </view>
 </bar>
 
 <bar class="margin-top justify-end">
   <view class='action'>
-    <icon class='icon-close text-red'></icon>
+    <text class='icon-close text-red'></text>
   </view>
 </bar>
 
 <bar class="margin-top">
   <view class='action'>
-    <icon class='icon-back text-gray' /> 返回
+    <text class='icon-back text-gray'></text> 返回
   </view>
   <view class='content'>
     操作条
@@ -42,20 +42,20 @@
 
 <bar class="margin-top">
   <view class='action'>
-    <icon class='icon-homefill text-gray' /> 首页
+    <text class='icon-homefill text-gray'></text> 首页
   </view>
   <view class='content'>
     鲜亮的高饱和色彩，专注视觉的小程序组件库
   </view>
   <view class='action'>
-    <icon class='icon-cardboardfill text-grey' />
-    <icon class='icon-recordfill text-red' />
+    <text class='icon-cardboardfill text-grey'></text>
+    <text class='icon-recordfill text-red'></text>
   </view>
 </bar>
 
 <bar class="margin-top bg-blue">
   <view class='action'>
-    <icon class='icon-close' /> 关闭
+    <text class='icon-close'></text> 关闭
   </view>
   <view class='content'>
     海蓝
@@ -63,7 +63,7 @@
 </bar>
 <bar class="margin-top bg-orange">
   <view class='action'>
-    <icon class='icon-back' /> 返回
+    <text class='icon-back'></text> 返回
   </view>
   <view class='content'>
     操作条
@@ -76,49 +76,49 @@
     ColorUI
   </view>
   <view class='action'>
-    <icon class="icon-more" />
+    <text class="icon-more"></text>
   </view>
 </bar>
 
 <bar class="margin-top bg-red search">
   <avatar class="round" style="background-image:url(https://image.weilanwl.com/img/square-1.jpg);"></avatar>
-  <view class='serach-form radius'>
-    <icon class="icon-search" />
-    <input type="text" placeholder="搜索图片、文章、视频" confirm-type="search" />
+  <view class='search-form radius'>
+    <text class="icon-search"></text>
+    <input type="text" placeholder="搜索图片、文章、视频" confirm-type="search"></input>
   </view>
   <view class='action'>
     <text>广州</text>
-    <icon class="icon-triangledownfill" />
+    <text class="icon-triangledownfill"></text>
   </view>
 </bar>
 
 <bar class="margin-top search">
   <avatar class="round" style="background-image:url(https://image.weilanwl.com/img/square-2.jpg);"></avatar>
-  <view class='serach-form round'>
-    <icon class="icon-search" />
-    <input type="text" placeholder="搜索图片、文章、视频" confirm-type="search" />
+  <view class='search-form round'>
+    <text class="icon-search"></text>
+    <input type="text" placeholder="搜索图片、文章、视频" confirm-type="search"></input>
   </view>
   <view class='action'>
     <text>广州</text>
-    <icon class="icon-triangledownfill" />
+    <text class="icon-triangledownfill"></text>
   </view>
 </bar>
 
 <bar class="margin-top bg-cyan search">
-  <view class='serach-form radius'>
-    <icon class="icon-search" />
-    <input type="text" placeholder="搜索图片、文章、视频" confirm-type="search" />
+  <view class='search-form radius'>
+    <text class="icon-search"></text>
+    <input type="text" placeholder="搜索图片、文章、视频" confirm-type="search"></input>
   </view>
   <view class='action'>
-    <icon class='icon-close' />
+    <text class='icon-close'></text>
     <text>取消</text>
   </view>
 </bar>
 
 <bar class="margin-top search">
-  <view class='serach-form round'>
-    <icon class="icon-search" />
-    <input type="text" placeholder="搜索图片、文章、视频" confirm-type="search" />
+  <view class='search-form round'>
+    <text class="icon-search"></text>
+    <input type="text" placeholder="搜索图片、文章、视频" confirm-type="search"></input>
   </view>
   <view class='action'>
     <button class='bg-green shadow-blur round'>搜索</button>
@@ -144,35 +144,35 @@
 </bar>
 
 <bar class="margin-top shop">
-  <view class="action">
-    <icon class='icon-service text-green'>
+  <button class="action"  open-type='contact'>
+    <text class='icon-service text-green'>
       <tag class='badge'></tag>
-    </icon>
+    </text>
     客服
-  </view>
+  </button>
   <view class="action text-orange">
-    <icon class='icon-favorfill' /> 已收藏
+    <text class='icon-favorfill'></text> 已收藏
   </view>
   <view class="action">
-    <icon class='icon-cart'>
+    <text class='icon-cart'>
       <tag class='badge'>99</tag>
-    </icon>
+    </text>
     购物车
   </view>
   <view class='bg-red submit'>立即订购</view>
 </bar>
 
 <bar class="margin-top shop">
-  <view class="action">
-    <icon class='icon-service text-green'>
+  <button class="action"  open-type='contact'>
+    <text class='icon-service text-green'>
       <tag class='badge'></tag>
-    </icon>
+    </text>
     客服
-  </view>
+  </button>
   <view class="action">
-    <icon class='icon-cart'>
+    <text class='icon-cart'>
       <tag class='badge'>99</tag>
-    </icon>
+    </text>
     购物车
   </view>
   <view class='bg-orange submit'>加入购物车</view>
@@ -180,19 +180,19 @@
 </bar>
 
 <bar class="margin-top shop">
-  <view class="action">
-    <icon class='icon-service text-green'>
+  <button class="action"  open-type='contact'>
+    <text class='icon-service text-green'>
       <tag class='badge'></tag>
-    </icon>
+    </text>
     客服
+  </button>
+  <view class="action">
+    <text class=' icon-shop'></text> 店铺
   </view>
   <view class="action">
-    <icon class=' icon-shop' /> 店铺
-  </view>
-  <view class="action">
-    <icon class='icon-cart'>
+    <text class='icon-cart'>
       <tag class='badge'>99</tag>
-    </icon>
+    </text>
     购物车
   </view>
   <view class='submit'>
@@ -201,16 +201,16 @@
 </bar>
 
 <bar class="margin-top shop">
-  <view class="action">
-    <icon class='icon-service text-green'>
+  <button class="action"  open-type='contact'>
+    <text class='icon-service text-green'>
       <tag class='badge'></tag>
-    </icon>
+    </text>
     客服
-  </view>
+  </button>
   <view class="action">
-    <icon class='icon-cart'>
+    <text class='icon-cart'>
       <tag class='badge'>99</tag>
-    </icon>
+    </text>
     购物车
   </view>
   <view class='submit'>
@@ -223,11 +223,11 @@
 
 <bar class="margin-top input">
   <view class='action'>
-    <icon class='icon-sound text-grey' />
+    <text class='icon-sound text-grey'></text>
   </view>
   <input class='solid-bottom' focus="{{false}}" maxlength="300" cursor-spacing="10"></input>
   <view class='action'>
-    <icon class='icon-emojifill text-grey' />
+    <text class='icon-emojifill text-grey'></text>
   </view>
   <button class='bg-green shadow-blur'>发送</button>
 </bar>
@@ -235,11 +235,11 @@
 <bar class="margin-top input">
   <avatar class="round" style="background-image:url(https://image.weilanwl.com/img/square-3.jpg);"></avatar>
   <view class='action'>
-    <icon class='icon-roundaddfill text-grey' />
+    <text class='icon-roundaddfill text-grey'></text>
   </view>
   <input class='solid-bottom' maxlength="300" cursor-spacing="10"></input>
   <view class='action'>
-    <icon class='icon-emojifill text-grey' />
+    <text class='icon-emojifill text-grey'></text>
   </view>
   <button class='bg-green shadow-blur'>发送</button>
 </bar>

demo/pages/component/card/card.wxml

@@ -1,13 +1,13 @@
 <custom style="height:{{CustomBar}}px;">
   <bar class="fixed gradual-pink" style="height:{{CustomBar}}px;padding-top:{{StatusBar}}px;">
     <navigator class='action' open-type="navigateBack" delta="1" hover-class="none">
-      <icon class='icon-back' /> 卡片
+      <text class='icon-back'></text> 卡片
     </navigator>
   </bar>
 </custom>
 <bar class="solid-bottom">
   <view class='action'>
-    <icon class='icon-titles text-orange ' /> 案例类卡片
+    <text class='icon-titles text-orange '></text> 案例类卡片
   </view>
   <view class='action'>
     <switch class='sm' checked='{{isCard}}' bindchange='isCard'></switch>
@@ -28,9 +28,9 @@
           <view class='text-gray text-sm flex justify-between'>
             十天前
             <view class="text-gray text-sm">
-              <icon class="icon-attentionfill" /> 10
-              <icon class="icon-appreciatefill" /> 20
-              <icon class="icon-messagefill" /> 30
+              <text class="icon-attentionfill"></text> 10
+              <text class="icon-appreciatefill"></text> 20
+              <text class="icon-messagefill"></text> 30
             </view>
           </view>
         </view>
@@ -40,7 +40,7 @@
 </card>
 <bar class="solid-bottom {{isCard?'margin-top':''}}">
   <view class='action'>
-    <icon class='icon-titles text-orange ' /> 动态类卡片
+    <text class='icon-titles text-orange '></text> 动态类卡片
   </view>
   <view class='action'>
     <switch class='sm' checked='{{isCard}}' bindchange='isCard'></switch>
@@ -67,9 +67,9 @@
       </view>
     </view>
     <view class='text-gray text-sm text-right padding'>
-      <icon class="icon-attentionfill" /> 10
-      <icon class="icon-appreciatefill" /> 20
-      <icon class="icon-messagefill" /> 30
+      <text class="icon-attentionfill"></text> 10
+      <text class="icon-appreciatefill"></text> 20
+      <text class="icon-messagefill"></text> 30
     </view>
     <list class="menu menu-avatar comment solids-top">
       <item wx:for="{{2}}" wx:key>
@@ -88,8 +88,8 @@
           <view class='margin-top-sm flex justify-between'>
             <view class='text-gray text-df'>2018年12月4日</view>
             <view>
-              <icon class="icon-appreciate{{!isZan?'fill':''}} text-{{!isZan?'red':'gray'}}" />
-              <icon class="icon-messagefill text-gray margin-left-sm" />
+              <text class="icon-appreciate{{!isZan?'fill':''}} text-{{!isZan?'red':'gray'}}"></text>
+              <text class="icon-messagefill text-gray margin-left-sm"></text>
             </view>
           </view>
         </view>
@@ -100,7 +100,7 @@
 
 <bar class="solid-bottom margin-top">
   <view class='action'>
-    <icon class='icon-titles text-orange ' /> 文章类卡片
+    <text class='icon-titles text-orange '></text> 文章类卡片
   </view>
   <view class='action'>
     <switch class='sm' checked='{{isCard}}' bindchange='isCard'></switch>

demo/pages/component/chat/chat.wxml

@@ -1,7 +1,7 @@
 <custom style="height:{{CustomBar}}px;">
   <bar class="fixed gradual-pink" style="height:{{CustomBar}}px;padding-top:{{StatusBar}}px;">
     <navigator class='action' open-type="navigateBack" delta="1" hover-class="none">
-      <icon class='icon-back'/>
+      <text class='icon-back'></text>
       聊天
     </navigator>
   </bar>
@@ -28,7 +28,7 @@
     <view class='date '> 13:23</view>
   </item>
   <info>
-    <icon class='icon-roundclosefill text-red '/> 对方拒绝了你的消息
+    <text class='icon-roundclosefill text-red '></text> 对方拒绝了你的消息
   </info>
   <info>
     对方开启了好友验证，你还不是他(她)的好友。请先发送好友验证请求，对方验证通过后，才能聊天。
@@ -47,7 +47,7 @@
         3"
       </view>
       <view class='content shadow'>
-        <icon class='icon-sound text-xxl padding-right-xl'> </icon>
+        <text class='icon-sound text-xxl padding-right-xl'> </text>
       </view>
     </view>
     <avatar class="radius" style="background-image:url(https://image.weilanwl.com/img/square-3.jpg);"></avatar>
@@ -56,7 +56,7 @@
   <item class="self">
     <view class="main">
       <view class='action'>
-        <icon class='icon-locationfill text-orange text-xxl'/>
+        <text class='icon-locationfill text-orange text-xxl'></text>
       </view>
       <view class='content shadow'>
         喵星球，喵喵市
@@ -72,7 +72,7 @@
        @#$^&**
       </view>      
       <view class='action text-grey'>
-        <icon class='icon-warnfill text-red text-xxl'/> <text class='text-sm margin-left-sm'>翻译错误</text> 
+        <text class='icon-warnfill text-red text-xxl'></text> <text class='text-sm margin-left-sm'>翻译错误</text> 
       </view>
     </view>
     <view class='date'>13:23</view>
@@ -81,11 +81,11 @@
 
 <bar class="foot input">
   <view class='action'>
-    <icon class='icon-sound text-grey'/>
+    <text class='icon-sound text-grey'></text>
   </view>
   <input class='solid-bottom' focus="{{false}}" maxlength="300" cursor-spacing="10"></input>
   <view class='action'>
-    <icon class='icon-emojifill text-grey'/>
+    <text class='icon-emojifill text-grey'></text>
   </view>
   <button class='bg-green shadow-blur'>发送</button>
 </bar>

demo/pages/component/form/form.wxml

@@ -1,7 +1,7 @@
 <custom style="height:{{CustomBar}}px;">
   <bar class="fixed gradual-pink" style="height:{{CustomBar}}px;padding-top:{{StatusBar}}px;">
     <navigator class='action' open-type="navigateBack" delta="1" hover-class="none">
-      <icon class='icon-back' /> 表单
+      <text class='icon-back'></text> 表单
     </navigator>
   </bar>
 </custom>
@@ -22,7 +22,7 @@
   <form-group>
     <view class='title'>收货地址</view>
     <input placeholder="输入框带个图标" class='radius' name='input'></input>
-    <icon class='icon-locationfill text-orange' />
+    <text class='icon-locationfill text-orange'></text>
   </form-group>
   <form-group>
     <view class='title'>验证码</view>
@@ -94,34 +94,34 @@
   </form-group>
   <form-group>
     <view class='title'>定义颜色</view>
-    <switch class='red sm' checked/>
+    <switch class='red sm' checked></switch>
   </form-group>
   <form-group>
-    <switch class='switch-sex' checked/>
+    <switch class='switch-sex' checked></switch>
     <view class='title'>定义图标</view>
   </form-group>
   <form-group>
     <view class='title'>方形开关</view>
-    <switch class='orange radius sm' checked/>
+    <switch class='orange radius sm' checked></switch>
   </form-group>
   <radio-group class="block">
     <form-group class="margin-top">
       <view class='title'>单选操作(radio)</view>
-      <radio checked />
+      <radio checked></radio>
     </form-group>
     <form-group>
       <view class='title'>定义尺寸</view>
-      <radio class='sm' />
+      <radio class='sm'></radio>
     </form-group>
     <form-group>
       <view class='title'>定义样式</view>
-      <radio class='radio' />
+      <radio class='radio'></radio>
     </form-group>
     <form-group>
       <view class='title'>定义颜色</view>
       <view>
-        <radio class='blue radio' />
-        <radio class='red margin-left-sm' />
+        <radio class='blue radio'></radio>
+        <radio class='red margin-left-sm'></radio>
       </view>
     </form-group>
   </radio-group>
@@ -148,11 +148,11 @@
       </view>
       <view class="padding-xs bg-img" style="background-image:url(https://image.weilanwl.com/img/square-2.jpg);">
         <tag class="bg-red">
-          <icon class='icon-close'></icon>
+          <text class='icon-close'></text>
         </tag>
       </view>
       <view class="padding-xs solids">
-        <icon class='icon-cameraadd'></icon>
+        <text class='icon-cameraadd'></text>
       </view>
     </view>
   </form-group>

demo/pages/component/home/home.wxml

@@ -3,6 +3,6 @@
   <navigator hover-class='none' url="../{{item.name}}/{{item.name}}" class="nav-li bg-{{item.color}}" style='animation: show {{(index+1)*0.2+1}}s 1;-webkit-animation: show {{(index+1)*0.2+1}}s 1;' wx:for="{{elements}}" wx:key>
     <view class="nav-title">{{item.title}}</view>
     <view class="nav-name">{{item.name}}</view>
-    <icon class='icon-{{item.icon}}'/>
+    <text class='icon-{{item.icon}}'></text>
   </navigator>
 </view>

demo/pages/component/list/list.wxml

@@ -1,173 +1,173 @@
 <custom style="height:{{CustomBar}}px;">
   <bar class="fixed gradual-pink" style="height:{{CustomBar}}px;padding-top:{{StatusBar}}px;">
     <navigator class='action' open-type="navigateBack" delta="1" hover-class="none">
-      <icon class='icon-back'/> 列表
+      <text class='icon-back'></text> 列表
     </navigator>
   </bar>
 </custom>
 <view class="page {{skin?' invert ':' '}}">
   <list class="grid col-3">
     <item>
-      <icon class='icon-cardboardfill text-red'/>
+      <text class='icon-cardboardfill text-red'></text>
       <text>VR</text>
     </item>
     <item>
-      <icon class='icon-recordfill text-orange'/>
+      <text class='icon-recordfill text-orange'></text>
       <text>录像</text>
     </item>
     <item>
-      <icon class='icon-picfill text-yellow'/>
+      <text class='icon-picfill text-yellow'></text>
       <text>图像</text>
     </item>
     <item>
-      <icon class='icon-noticefill text-olive'>
+      <text class='icon-noticefill text-olive'>
         <tag class="badge">99+</tag>
-      </icon>
+      </text>
       <text>通知</text>
     </item>
     <item>
-      <icon class='icon-upstagefill text-cyan'/>
+      <text class='icon-upstagefill text-cyan'></text>
       <text>排行榜</text>
     </item>
     <item>
-      <icon class='icon-clothesfill text-blue'>
+      <text class='icon-clothesfill text-blue'>
         <tag class="badge"></tag>
-      </icon>
+      </text>
       <text>皮肤</text>
     </item>
     <item>
-      <icon class='icon-discoverfill text-purple'/>
+      <text class='icon-discoverfill text-purple'></text>
       <text>发现</text>
     </item>
     <item>
-      <icon class='icon-questionfill text-mauve'/>
+      <text class='icon-questionfill text-mauve'></text>
       <text>帮助</text>
     </item>
     <item>
-      <icon class='icon-servicefill text-pink'/>
+      <text class='icon-servicefill text-pink'></text>
       <text>反馈</text>
     </item>
   </list>
   <list class="grid col-4">
     <item>
-      <icon class='icon-cardboardfill text-red'/>
+      <text class='icon-cardboardfill text-red'></text>
       <text>VR</text>
     </item>
     <item>
-      <icon class='icon-recordfill text-orange'/>
+      <text class='icon-recordfill text-orange'></text>
       <text>录像</text>
     </item>
     <item>
-      <icon class='icon-picfill text-yellow'/>
+      <text class='icon-picfill text-yellow'></text>
       <text>图像</text>
     </item>
     <item>
-      <icon class='icon-noticefill text-olive'>
+      <text class='icon-noticefill text-olive'>
         <tag class="badge">99+</tag>
-      </icon>
+      </text>
       <text>通知</text>
     </item>
     <item>
-      <icon class='icon-upstagefill text-cyan'/>
+      <text class='icon-upstagefill text-cyan'></text>
       <text>排行榜</text>
     </item>
     <item>
-      <icon class='icon-clothesfill text-blue'>
+      <text class='icon-clothesfill text-blue'>
         <tag class="badge"></tag>
-      </icon>
+      </text>
       <text>皮肤</text>
     </item>
     <item>
-      <icon class='icon-discoverfill text-purple'/>
+      <text class='icon-discoverfill text-purple'></text>
       <text>发现</text>
     </item>
     <item>
-      <icon class='icon-questionfill text-mauve'/>
+      <text class='icon-questionfill text-mauve'></text>
       <text>帮助</text>
     </item>
   </list>
   <list class="grid no-border col-4">
     <item>
-      <icon class='icon-cardboardfill text-red'/>
+      <text class='icon-cardboardfill text-red'></text>
       <text>VR</text>
     </item>
     <item>
-      <icon class='icon-recordfill text-orange'/>
+      <text class='icon-recordfill text-orange'></text>
       <text>录像</text>
     </item>
     <item>
-      <icon class='icon-picfill text-yellow'/>
+      <text class='icon-picfill text-yellow'></text>
       <text>图像</text>
     </item>
     <item>
-      <icon class='icon-noticefill text-olive'>
+      <text class='icon-noticefill text-olive'>
         <tag class="badge">99+</tag>
-      </icon>
+      </text>
       <text>通知</text>
     </item>
     <item>
-      <icon class='icon-upstagefill text-cyan'/>
+      <text class='icon-upstagefill text-cyan'></text>
       <text>排行榜</text>
     </item>
     <item>
-      <icon class='icon-clothesfill text-blue'>
+      <text class='icon-clothesfill text-blue'>
         <tag class="badge"></tag>
-      </icon>
+      </text>
       <text>皮肤</text>
     </item>
     <item>
-      <icon class='icon-discoverfill text-purple'/>
+      <text class='icon-discoverfill text-purple'></text>
       <text>发现</text>
     </item>
     <item>
-      <icon class='icon-questionfill text-mauve'/>
+      <text class='icon-questionfill text-mauve'></text>
       <text>帮助</text>
     </item>
   </list>
   <list class="grid col-5 no-border">
     <item>
-      <icon class='icon-cardboardfill text-red'>
+      <text class='icon-cardboardfill text-red'>
         <tag class="badge">99+</tag>
-      </icon>
+      </text>
       <text>VR</text>
     </item>
     <item>
-      <icon class='icon-recordfill text-orange'/>
+      <text class='icon-recordfill text-orange'></text>
       <text>录像</text>
     </item>
     <item>
-      <icon class='icon-picfill text-yellow'/>
+      <text class='icon-picfill text-yellow'></text>
       <text>图像</text>
     </item>
     <item>
-      <icon class='icon-noticefill text-olive'>
-      </icon>
+      <text class='icon-noticefill text-olive'>
+      </text>
       <text>通知</text>
     </item>
     <item>
-      <icon class='icon-upstagefill text-cyan'/>
+      <text class='icon-upstagefill text-cyan'></text>
       <text>排行榜</text>
     </item>
     <item>
-      <icon class='icon-clothesfill text-blue'>
+      <text class='icon-clothesfill text-blue'>
         <tag class="badge"></tag>
-      </icon>
+      </text>
       <text>皮肤</text>
     </item>
     <item>
-      <icon class='icon-discoverfill text-purple'/>
+      <text class='icon-discoverfill text-purple'></text>
       <text>发现</text>
     </item>
     <item>
-      <icon class='icon-questionfill text-mauve'/>
+      <text class='icon-questionfill text-mauve'></text>
       <text>帮助</text>
     </item>
     <item>
-      <icon class='icon-commandfill text-purple'/>
+      <text class='icon-commandfill text-purple'></text>
       <text>问答</text>
     </item>
     <item>
-      <icon class='icon-brandfill text-mauve'/>
+      <text class='icon-brandfill text-mauve'></text>
       <text>版权</text>
     </item>
   </list>
@@ -175,23 +175,23 @@
     <item>
       <view class='content'>
         <view>
-          <icon class='icon-clothesfill text-blue'/> 皮肤设置</view>
+          <text class='icon-clothesfill text-blue'></text> 皮肤设置</view>
         <view class='text-gray text-sm'>
-          <icon class='icon-infofill'/> 皮肤需要付费购买</view>
+          <text class='icon-infofill'></text> 皮肤需要付费购买</view>
       </view>
       <view class='action'>
-        <switch class='switch-sex sm' bindchange="switchSex" />
+        <switch class='switch-sex sm' bindchange="switchSex"></switch>
       </view>
     </item>
     <item>
       <view class='content'>
         <view>
-          <icon class='icon-musicfill text-red'/> 声音控制</view>
+          <text class='icon-musicfill text-red'></text> 声音控制</view>
         <view class='text-gray text-sm'>
-          <icon class='icon-infofill'/> 需要获得系统权限</view>
+          <text class='icon-infofill'></text> 需要获得系统权限</view>
       </view>
       <view class='action'>
-        <switch class='switch-music' />
+        <switch class='switch-music'></switch>
       </view>
     </item>
   </list>
@@ -201,7 +201,7 @@
       <view class='content'>
         <view class='text-grey'>文晓港</view>
         <view class='text-gray text-sm'>
-          <icon class='icon-infofill text-red'/> 消息未送达</view>
+          <text class='icon-infofill text-red'></text> 消息未送达</view>
       </view>
       <view class='action'>
         <view class='text-grey text-xs'>22:20</view>
@@ -217,11 +217,11 @@
           <tag class="round bg-orange sm">SVIP</tag>
         </view>
         <view class='text-gray text-sm'>
-          <icon class='icon-redpacket_fill text-red'/> 收到红包</view>
+          <text class='icon-redpacket_fill text-red'></text> 收到红包</view>
       </view>
       <view class='action'>
         <view class='text-grey text-xs'>22:20</view>
-        <icon class='icon-notice_forbid_fill text-gray'/>
+        <text class='icon-notice_forbid_fill text-gray'></text>
       </view>
     </item>
   </list>
@@ -260,35 +260,53 @@
         </view>
         <view class='text-gray text-sm'>
           喵星酱：
-          <icon class='icon-picfill text-orange'/> 图片传输中...</view>
+          <text class='icon-picfill text-orange'></text> 图片传输中...</view>
       </view>
       <view class='action'>
         <view class='text-grey text-xs'>22:20</view>
-        <icon class='icon-notice_forbid_fill text-gray'/>
+        <text class='icon-notice_forbid_fill text-gray'></text>
       </view>
     </item>
   </list>
   <list class="menu">
     <item>
       <view class='content'>
-        <icon class='icon-circlefill text-grey'/>
-        <text class='text-grey'>默认</text>
+        <text class='icon-circlefill text-grey'></text>
+        <text class='text-grey'>图标 + 标题</text>
       </view>
     </item>
     <item>
       <view class='content'>
-        <icon class='icon-emojifill text-red'/>
+        <image src='/images/logo.png' class='png' mode='aspectFit'></image>
+        <text class='text-grey'>图片 + 标题</text>
+      </view>
+    </item>
+    <item>
+      <button class='content' open-type='contact'>
+        <text class='icon-btn text-olive'></text>
+        <text class='text-grey'>Open-type 按钮</text>
+      </button>
+    </item>
+    <item>
+      <navigator class='content' hover-class='none' url='../list/list' open-type="redirect">
+        <text class='icon-discoverfill text-orange'></text>
+        <text class='text-grey'>Navigator 跳转</text>
+      </navigator>
+    </item>
+    <item>
+      <view class='content'>
+        <text class='icon-emojifill text-red'></text>
         <text class='text-grey'>头像</text>
       </view>
       <view class='action'>
         <avatar class="sm round">
-          <icon class='icon-people'/>
+          <text class='icon-people'></text>
         </avatar>
       </view>
     </item>
     <item>
       <view class='content'>
-        <icon class='icon-emojiflashfill text-pink'/>
+        <text class='icon-emojiflashfill text-pink'></text>
         <text class='text-grey'>头像组</text>
       </view>
       <view class='action'>
@@ -303,35 +321,35 @@
     </item>
     <item>
       <view class='content'>
-        <icon class='icon-crown text-green'/>
+        <text class='icon-crown text-green'></text>
         <text class='text-grey'>按钮</text>
       </view>
       <view class='action'>
         <button class='round bg-green sm'>
-          <icon class='icon-upload'/> 上传</button>
+          <text class='icon-upload'></text> 上传</button>
       </view>
     </item>
     <item>
       <view class='content'>
-        <icon class='icon-crownfill text-green'/>
+        <text class='icon-crownfill text-green'></text>
         <text class='text-grey'>按钮</text>
       </view>
       <view class='action'>
         <button class='round bg-blue'>
-          <icon class='icon-down'/> 下载</button>
+          <text class='icon-down'></text> 下载</button>
       </view>
     </item>
   </list>
   <list class="menu">
     <item class="arrow">
       <view class='content'>
-        <icon class='icon-roundrightfill text-grey'/>
+        <text class='icon-roundrightfill text-grey'></text>
         <text class='text-grey'>箭头</text>
       </view>
     </item>
     <item class="arrow">
       <view class='content'>
-        <icon class='icon-tagfill text-red'/>
+        <text class='icon-tagfill text-red'></text>
         <text class='text-grey'>标签</text>
       </view>
       <view class='action'>
@@ -342,7 +360,7 @@
     </item>
     <item class="arrow">
       <view class='content'>
-        <icon class='icon-warn text-green'/>
+        <text class='icon-warn text-green'></text>
         <text class='text-grey'>文本</text>
       </view>
       <view class='action'>
@@ -351,7 +369,7 @@
     </item>
     <item class="arrow">
       <view class='content'>
-        <icon class='icon-warnfill text-green'/>
+        <text class='icon-warnfill text-green'></text>
         <text class='text-grey'>文本</text>
         <text class='text-grey text-sm margin-left-sm'>小目标还没有实现！</text>
       </view>
@@ -360,7 +378,7 @@
   <list class="menu no-padding">
     <item>
       <view class='content'>
-        <icon class='icon-radiobox text-orange'/>
+        <text class='icon-radiobox text-orange'></text>
         <text class='text-grey'>徽章</text>
       </view>
       <view class='action'>
@@ -369,7 +387,7 @@
     </item>
     <item>
       <view class='content'>
-        <icon class='icon-tagfill text-olive'/>
+        <text class='icon-tagfill text-olive'></text>
         <text class='text-grey'>标签</text>
       </view>
       <view class='action'>
@@ -378,13 +396,13 @@
     </item>
     <item class="arrow">
       <view class='content'>
-        <icon class='icon-radioboxfill text-blue'/>
+        <text class='icon-radioboxfill text-blue'></text>
         <text class='text-grey'>胶囊</text>
       </view>
       <view class='action'>
         <capsule class="round">
           <tag class='bg-blue'>
-            <icon class='icon-locationfill'/>
+            <text class='icon-locationfill'></text>
           </tag>
           <tag class="line-blue">
             广州
@@ -396,7 +414,7 @@
   <list class="menu no-padding card-menu margin-bottom-xl">
     <item>
       <view class='content'>
-        <icon class='icon-radiobox text-orange'/>
+        <text class='icon-radiobox text-orange'></text>
         <text class='text-grey'>徽章</text>
       </view>
       <view class='action'>
@@ -405,7 +423,7 @@
     </item>
     <item>
       <view class='content'>
-        <icon class='icon-tagfill text-olive'/>
+        <text class='icon-tagfill text-olive'></text>
         <text class='text-grey'>标签</text>
       </view>
       <view class='action'>
@@ -414,13 +432,13 @@
     </item>
     <item class="arrow">
       <view class='content'>
-        <icon class='icon-radioboxfill text-blue'/>
+        <text class='icon-radioboxfill text-blue'></text>
         <text class='text-grey'>胶囊</text>
       </view>
       <view class='action'>
         <capsule class="round">
           <tag class='bg-blue'>
-            <icon class='icon-locationfill'/>
+            <text class='icon-locationfill'></text>
           </tag>
           <tag class="line-blue">
             广州

demo/pages/component/modal/modal.wxml

@@ -1,14 +1,14 @@
 <custom style="height:{{CustomBar}}px;">
   <bar class="fixed gradual-pink" style="height:{{CustomBar}}px;padding-top:{{StatusBar}}px;">
     <navigator class='action' open-type="navigateBack" delta="1" hover-class="none">
-      <icon class='icon-back' /> 模态窗口
+      <text class='icon-back'></text> 模态窗口
     </navigator>
   </bar>
 </custom>
 
 <bar class="">
   <view class='action'>
-    <icon class='icon-titles text-orange ' /> 模态窗口
+    <text class='icon-titles text-orange '></text> 模态窗口
   </view>
   <view class='action'>
     <button class='bg-green shadow' bindtap="showModal" data-target="Modal">Modal</button>
@@ -19,7 +19,7 @@
     <bar class="justify-end">
       <view class='content'>Modal标题</view>
       <view class='action' bindtap='hideModal'>
-        <icon class='icon-close text-red'></icon>
+        <text class='icon-close text-red'></text>
       </view>
     </bar>
     <view class='padding-xl'>
@@ -30,7 +30,7 @@
 
 <bar class=" margin-top">
   <view class='action'>
-    <icon class='icon-titles text-orange ' /> 底部窗口
+    <text class='icon-titles text-orange '></text> 底部窗口
   </view>
   <view class='action'>
     <button class='bg-green shadow' bindtap="showModal" data-target="bottomModal">Bottom</button>
@@ -50,7 +50,7 @@
 
 <bar class=" margin-top">
   <view class='action'>
-    <icon class='icon-titles text-orange ' /> 对话窗口
+    <text class='icon-titles text-orange '></text> 对话窗口
   </view>
   <view class='action'>
     <button class='bg-green shadow' bindtap="showModal" data-target="DialogModal1">Dialog</button>
@@ -62,7 +62,7 @@
     <bar class="justify-end">
       <view class='content'>Modal标题</view>
       <view class='action' bindtap='hideModal'>
-        <icon class='icon-close text-red'></icon>
+        <text class='icon-close text-red'></text>
       </view>
     </bar>
     <view class='padding-xl'>
@@ -83,7 +83,7 @@
     <bar class="justify-end">
       <view class='content'>Modal标题</view>
       <view class='action' bindtap='hideModal'>
-        <icon class='icon-close text-red'></icon>
+        <text class='icon-close text-red'></text>
       </view>
     </bar>
     <view class='padding-xl'>
@@ -91,7 +91,7 @@
     </view>
     <bar>
       <view class='action margin-0 flex-sub text-green ' bindtap='hideModal'>
-        <icon class='icon-moneybag'></icon>微信支付</view>
+        <text class='icon-moneybag'></text>微信支付</view>
       <view class='action margin-0 flex-sub text-green solid-left' bindtap='hideModal'>取消</view>
       <view class='action margin-0 flex-sub  solid-left' bindtap='hideModal'>确定</view>
     </bar>
@@ -100,7 +100,7 @@
 
 <bar class=" margin-top">
   <view class='action'>
-    <icon class='icon-titles text-orange ' /> 图片窗口
+    <text class='icon-titles text-orange '></text> 图片窗口
   </view>
   <view class='action'>
     <button class='bg-green shadow' bindtap="showModal" data-target="Image">Image</button>
@@ -112,7 +112,7 @@
     <view class="bg-img" style="background-image: url('https://albedo-theme.com/wp-content/uploads/2016/08/pexels-photo-26180.jpg');height:200px;">
       <bar class="justify-end none-bg text-white">
         <view class='action' bindtap='hideModal'>
-          <icon class='icon-close '></icon>
+          <text class='icon-close '></text>
         </view>
       </bar>
     </view>

demo/pages/component/nav/nav.wxml

@@ -1,7 +1,7 @@
 <custom style="height:{{CustomBar}}px;">
   <bar class="fixed gradual-pink" style="height:{{CustomBar}}px;padding-top:{{StatusBar}}px;">
     <navigator class='action' open-type="navigateBack" delta="1" hover-class="none">
-      <icon class='icon-back' /> 导航栏
+      <text class='icon-back'></text> 导航栏
     </navigator>
   </bar>
 </custom>
@@ -10,7 +10,7 @@
 </view>
 <bar class="solid-bottom">
   <view class='action'>
-    <icon class='icon-titles text-orange ' /> 默认
+    <text class='icon-titles text-orange '></text> 默认
   </view>
 </bar>
 <scroll-view scroll-x class="bg-white nav" scroll-with-animation scroll-left="{{scrollLeft}}">
@@ -21,7 +21,7 @@
 
 <bar class="margin-top solid-bottom">
   <view class='action'>
-    <icon class='icon-title text-orange' /> 居中
+    <text class='icon-title text-orange'></text> 居中
   </view>
 </bar>
 <scroll-view scroll-x class="bg-white nav text-center">
@@ -32,7 +32,7 @@
 
 <bar class="margin-top solid-bottom">
   <view class='action'>
-    <icon class='icon-title text-orange' /> 平分
+    <text class='icon-title text-orange'></text> 平分
   </view>
 </bar>
 <scroll-view scroll-x class="bg-white nav">
@@ -44,7 +44,7 @@
 </scroll-view>
 <bar class="margin-top solid-bottom">
   <view class='action'>
-    <icon class='icon-title text-orange' /> 背景
+    <text class='icon-title text-orange'></text> 背景
   </view>
 </bar>
 <scroll-view scroll-x class="bg-red nav text-center">
@@ -54,34 +54,34 @@
 </scroll-view>
 <bar class="margin-top solid-bottom">
   <view class='action'>
-    <icon class='icon-title text-orange' /> 图标
+    <text class='icon-title text-orange'></text> 图标
   </view>
 </bar>
 <scroll-view scroll-x class="bg-green nav text-center">
   <item class="{{0==TabCur?'text-white cur':''}}" bindtap='tabSelect' data-id="0">
-    <icon class='icon-camerafill'></icon> 数码
+    <text class='icon-camerafill'></text> 数码
   </item>
   <item class="{{1==TabCur?'text-white cur':''}}" bindtap='tabSelect' data-id="1">
-    <icon class='icon-upstagefill'></icon> 排行榜
+    <text class='icon-upstagefill'></text> 排行榜
   </item>
   <item class="{{2==TabCur?'text-white cur':''}}" bindtap='tabSelect' data-id="2">
-    <icon class='icon-clothesfill'></icon> 皮肤
+    <text class='icon-clothesfill'></text> 皮肤
   </item>
 </scroll-view>
 
 <bar class="margin-top solid-bottom">
   <view class='action'>
-    <icon class='icon-title text-orange' /> 定位
+    <text class='icon-title text-orange'></text> 定位
   </view>
 </bar>
 <scroll-view scroll-x class="bg-green nav text-center">
   <item class="{{0==TabCur?'text-white cur':''}}" bindtap='tabSelect' data-id="0">
-    <icon class='icon-camerafill'></icon> 数码
+    <text class='icon-camerafill'></text> 数码
   </item>
   <item class="{{1==TabCur?'text-white cur':''}}" bindtap='tabSelect' data-id="1">
-    <icon class='icon-upstagefill'></icon> 排行榜
+    <text class='icon-upstagefill'></text> 排行榜
   </item>
   <item class="{{2==TabCur?'text-white cur':''}}" bindtap='tabSelect' data-id="2">
-    <icon class='icon-clothesfill'></icon> 皮肤
+    <text class='icon-clothesfill'></text> 皮肤
   </item>
 </scroll-view>

demo/pages/component/swiper/swiper.wxml

@@ -1,13 +1,13 @@
 <custom style="height:{{CustomBar}}px;">
   <bar class="fixed gradual-pink" style="height:{{CustomBar}}px;padding-top:{{StatusBar}}px;">
     <navigator class='action' open-type="navigateBack" delta="1" hover-class="none">
-      <icon class='icon-back' /> 轮播图
+      <text class='icon-back'></text> 轮播图
     </navigator>
   </bar>
 </custom>
 <bar>
   <view class='action'>
-    <icon class='icon-title text-pink' /> 全屏限高轮播
+    <text class='icon-title text-pink'></text> 全屏限高轮播
   </view>
   <view class='action'>
     <switch class='sm' bindchange='DotStyle'></switch>
@@ -15,12 +15,12 @@
 </bar>
 <swiper class="screen-swiper {{DotStyle?'square-dot':'round-dot'}}" indicator-dots="true" circular="true" autoplay="true" interval="5000" duration="500">
   <swiper-item wx:for="{{4}}" wx:key>
-    <image src="https://image.weilanwl.com/img/4x3-{{index+1}}.jpg" mode='aspectFill' />
+    <image src="https://image.weilanwl.com/img/4x3-{{index+1}}.jpg" mode='aspectFill'></image>
   </swiper-item>
 </swiper>
 <bar class="margin-top">
   <view class='action'>
-    <icon class='icon-title text-pink' /> 卡片式轮播
+    <text class='icon-title text-pink'></text> 卡片式轮播
   </view>
 </bar>
 <swiper class="card-swiper {{DotStyle?'square-dot':'round-dot'}}" indicator-dots="true" circular="true" autoplay="true" interval="5000" duration="500" bindchange="cardSwiper" indicator-color="#8799a3" indicator-active-color="#0081ff">
@@ -31,7 +31,7 @@
 
 <bar class="margin-top">
   <view class='action'>
-    <icon class='icon-title text-pink' /> 堆叠式轮播
+    <text class='icon-title text-pink'></text> 堆叠式轮播
   </view>
 </bar>
 <view class="tower-swiper" bindtouchmove="towerMove" bindtouchstart="towerStart" bindtouchend="towerEnd">

demo/pages/component/timeline/timeline.wxml

@@ -1,7 +1,7 @@
 <custom style="height:{{CustomBar}}px;">
   <bar class="fixed gradual-pink" style="height:{{CustomBar}}px;padding-top:{{StatusBar}}px;">
     <navigator class='action' open-type="navigateBack" delta="1" hover-class="none">
-      <icon class='icon-back'/>
+      <text class='icon-back'></text>
       时间轴
     </navigator>
   </bar>
@@ -61,7 +61,7 @@
           <view class='content'>
             <view class='text-grey'>文晓港</view>
             <view class='text-gray text-sm'>
-              <icon class='icon-infofill text-red'/> 消息未送达</view>
+              <text class='icon-infofill text-red'></text> 消息未送达</view>
           </view>
           <view class='action'>
             <view class='text-grey text-xs'>22:20</view>
@@ -77,11 +77,11 @@
               <tag class="round orange sm">SVIP</tag>
             </view>
             <view class='text-gray text-sm'>
-              <icon class='icon-redpacket_fill text-red'/> 收到红包</view>
+              <text class='icon-redpacket_fill text-red'></text> 收到红包</view>
           </view>
           <view class='action'>
             <view class='text-grey text-xs'>22:20</view>
-            <icon class='icon-notice_forbid_fill text-gray'/>
+            <text class='icon-notice_forbid_fill text-gray'></text>
           </view>
         </item>
       </list>