uni-app组件使用注意

1.picker 列表数据不显示

<!-- 选择分类 -->
        <view class="art-cate">
            <view>文章分类</view>
            <view class="">
                <picker mode="selector" range="caties" @change="cateChange">
                    <view>{{caties[currentCateIndex]}}</view>
                </picker>
            </view>
        </view>

range格式错误

<!-- 选择分类 -->
        <view class="art-cate">
            <view>文章分类</view>
            <view class="">
                <picker mode="selector" :range="caties" @change="cateChange">
                    <view>{{caties[currentCateIndex]}}</view>
                </picker>
            </view>
        </view>

2.icon图标h5端不支持

<icon type="clear" size="14"></icon>

icon图标h5端不支持.png
uni-app图标组件.png

可使用以下方式来解决icon组件在各端的差异

• 字体图标
• uni-app 拓展组件icon
• 使用 ColorUI-UniApp 中的图标（本人采用的方式）
  (1)下载源码解压
  备注：也可通过新建uni-app中的ColorUI模板项目来获取ColorUI-UniApp项目源码
  uni-app中的ColorUI模板项目.png
  (2)复制ColorUI-UniApp项目目录下的 /colorui 文件夹到你的项目根目录
  (3)App.vue 引入关键Css main.css icon.css

<style>
    @import "colorui/main.css";
    @import "colorui/icon.css";
    @import "app.css"; /* 你的项目css */
    ....
</style>

(4)使用图标

<text class="lg text-gray cuIcon-roundclose"></text>