登录  /  注册
首页 > web前端 > uni-app > 正文

uni-app组件使用详解

coldplay.xixi
发布: 2020-12-04 16:16:30
转载
8818人浏览过

uni-app开发教程栏目介绍组件使用情况

uni-app组件使用详解

推荐(免费):uni-app开发教程

1、picker 列表数据不显示

<!-- 选择分类 -->
        <view>
            <view>文章分类</view>
            <view>
                <picker>
                    <view>{{caties[currentCateIndex]}}</view>
                </picker>
            </view>
        </view>
登录后复制
登录后复制

range格式错误

<!-- 选择分类 -->
        <view>
            <view>文章分类</view>
            <view>
                <picker>
                    <view>{{caties[currentCateIndex]}}</view>
                </picker>
            </view>
        </view>
登录后复制
登录后复制

2.icon图标h5端不支持

<!-- 单独使用icon组件 -->
<icon></icon>
登录后复制

<!-- icon组件和字体图标配合使用 -->
<icon></icon>
登录后复制

4bbf1a6d7f150979f8fdb1a43257502.png

e3ffa99e510e3366885cdd9cd6d82f8.png

备注:不管是单独使用icon组件或者和字体图标配合使用,只要有icon组件h5都报错,可使用以下方式来解决icon组件在各端的差异

  • 适配方案一:uni-app也支持字体图标
<text></text>
登录后复制
登录后复制

<text></text>
登录后复制

注意:若使用网络路径字体图标,网络路径必须加协议头https
备注:icon组件换成text后,字体图标的大小边距和颜色可能与预期不一致,可自行适当调整。如:

<icon></icon> &gt;
登录后复制

改为:


    <text></text>
登录后复制
  • 适配方案二:使用uni-app的拓展组件icon
  • 适配方案三:使用ColorUI-UniApp中的图标
    (1)下载源码解压
    备注:也可通过新建uni-app中的ColorUI模板项目来获取ColorUI-UniApp项目源码

fb88e74b990b5d9dba9d806a68754a5.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)使用ColorUI的图标

<text></text>
登录后复制
登录后复制

想了解更多编程学习,敬请关注php培训栏目!

以上就是uni-app组件使用详解的详细内容,更多请关注php中文网其它相关文章!

智能AI问答
PHP中文网智能助手能迅速回答你的编程问题,提供实时的代码和解决方案,帮助你解决各种难题。不仅如此,它还能提供编程资源和学习指导,帮助你快速提升编程技能。无论你是初学者还是专业人士,AI智能助手都能成为你的可靠助手,助力你在编程领域取得更大的成就。
相关标签:
来源:简书网
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
最新问题
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2024 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号