The use of uni-ui component library in uni-app

introduce

uni-ui is a cross-end ui library provided by DCloud. It is a cross-full-end ui framework based on vue components, flex layout, and no dom.

uni-ui does not include basic components, it is a supplement to basic components

features

1. High performance (automatic differential update data, optimize logic layer and view layer communication loss, background stop)

2. full end

3. style extension

4. Collaborate with uniCloud

5. Automatic integration with uni statistics to achieve no-management

6. uni-ui complies with the full set of DCloud component specifications

use

In the template of the new uni-app project in HBuilderX, select the uni-ui template

Install components individually via uni_modules

If you have not created a uni-ui project template, you can also install a required component separately through uni_modules in your project. The following table is a list of uni-ui extension components. Click each component to import the component to the project on the details page. After importing, you can use it directly without import and registration

component name	Component description
uni-badge	Digital corner mark
uni-calendar	calendar
uni-card	card
uni-collapse	accordion panel
uni-combox	Combo Box
uni-countdown	countdown
uni-data-checkbox	data selector
uni-data-picker	Data-driven picker selector
uni-dateformat	date formatting
uni-datetime-picker	date picker
uni-drawer	drawer
uni-easyinput	Enhanced input box
uni-fab	floating button
uni-fav	favorite button
uni-file-picker	file selection upload
uni-forms	form
uni-goods-nav	Product Navigation
uni-grid	Grid
uni-group	group
uni-icons	icon
uni-indexed-list	index list
uni-link	Hyperlink
uni-list	the list
uni-load-more	load more
uni-nav-bar	custom navigation bar
uni-notice-bar	notice board
uni-number-box	number input box
uni-pagination	Pager
uni-popup	Pop-up layer
uni-rate	score
uni-row	布局-行
uni-search-bar	搜索栏
uni-segmented-control	分段器
uni-steps	步骤条
uni-swipe-action	滑动操作
uni-swiper-dot	轮播图指示点
uni-table	表格
uni-tag	标签
uni-title	章节标题
uni-transition	过渡动画

注意：下载最新的组件目前仅支持 uni_modules ,非 uni_modules 版本最高支持到组件的1.2.10版本

通过 uni_modules 导入全部组件

如果想一次把所有uni-ui组件导入到项目中，只需要导入一个 uni-ui 组件即可 点击去导入。

如果没有自动导入其他组件，可以在 uni-ui 组件目录上右键选择 安装三方插件依赖 即可。

以上是常用使用uni-ui的三种方式