当前位置: 首页 > news >正文

uni-app学习笔记三十五--扩展组件的安装和使用

由于内置组件不能满足日常开发需要,uniapp官方也提供了众多的扩展组件供我们使用。由于不是内置组件,需要安装才能使用。

一、安装扩展插件

安装方法:

1.访问uniapp官方文档组件部分:组件使用的入门教程 | uni-app官网

点击左侧菜单栏中的扩展组件,就可以看到各个组件了。点击需要的组件,在右侧点击下载安装:

在打开的页面右侧点击下载插件并导入,需要本地安装HBuilder X和登录。

点击会打开本地安装的HBuilder X,在弹出的窗口中选择需要导入组件的项目:

等待安装完成即可。 

二、使用扩展插件

复制文档中基本方法中的代码到本地项目中:

主要属性有:

LoadMore Props

属性名类型可选值默认值说明
iconSizeNumber-24指定图标大小
statusStringmore/loading/noMoremoreloading 的状态
showIconBoolean-true是否显示 loading 图标
showTextBoolean-true**[1.3.3新增]**是否显示文本
iconTypeStringsnow/circle/autoauto指定图标样式
colorString-#777777图标和文字颜色
contentTextObject-{contentdown: "上拉显示更多",contentrefresh: "正在加载...",contentnomore: "没有更多数据了"}各状态文字说明

Status Options

参数名称说明
more加载前
loading加载中
no-more没有更多数据

将上面代码复制到项目中

<view class="loadMore"><uni-load-more status="loading"></uni-load-more>
</view>

更多扩展组件的使用:

<view class="item" @click="onRefresh"><uni-icons type="refreshempty" size="25" color="#888"></uni-icons>
</view>
<view class="item" @click="toTop"><uni-icons type="arrow-up" size="25" color="#888"></uni-icons>
</view>

 size:可以设置图标的大小,color:#888让颜色淡一些。

 效果:

三、小tips:调整网络加载速度

在使用谷歌浏览器调试,有时页面一闪而过不方便查看,可以通过Network中调整加载速度。

 

 

相关文章:

  • VRFF: Video Registration and FusionFramework 论文详解
  • 年度峰会上,抖音依靠人工智能和搜索功能吸引广告主
  • 【JavaAPI搜索引擎】自动化测试报告
  • React---day11
  • llama-factory微调大模型环境配置避坑总结
  • Html实现图片上传/裁剪/马赛克/压缩/旋转/缩放
  • 【Dv3Admin】系统视图菜单管理API文件解析
  • 阿里云服务器 篇十七:网站悬浮球
  • centos开启samba服务
  • 超低成本U型光电开关红外对射管检测电路
  • RLHF vs RLVR:对齐学习中的两种强化方式详解
  • Python 如何在Python 3.6上安装PIP
  • 【Proteus仿真】【32单片机-A011】HX711电子秤系统设计
  • 解决网页导出PDF部分内容被遮挡问题
  • Ubuntu 20.04 联网设置指南
  • wifi改ip地址有什么用?wifi改ip地址怎么改
  • 【MySQL基础】MySQL表操作全面指南:从创建到管理的深度解析
  • Linux系统:进程间通信-匿名与命名管道
  • ZYNQ学习记录FPGA(二)Verilog语言
  • MCU ADC硬件设计注意事项
  • 手机网站开发有前途/烟台seo快速排名
  • wordpress ip改域名/连云港网站seo
  • 代码源/什么是优化师
  • 机票网站建设/营销培训心得体会
  • 安庆做网站赌博代理/百度网页入口官网
  • 免费建造公司网站/baidu百度网盘