# uni-app-vue3

**Repository Path**: xuwenlongl/uni-app-vue3

## Basic Information

- **Project Name**: uni-app-vue3
- **Description**: No description available
- **Primary Language**: JavaScript
- **License**: Apache-2.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2024-06-05
- **Last Updated**: 2024-06-20

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

## 开源项目
[UNI_APP：https://uniapp.dcloud.net.cn](https://uniapp.dcloud.net.cn/)

[UV-UI：https://www.uvui.cn](https://www.uvui.cn/)

## 目录结构
```
├─components
│  ├─libs  
│  │  └─css
│  ├─mixins
│  └─wh-** //组件
│
├─mock     //模拟数据
│  ├─index //默认数据
│  └─modules //模块数据
│      ├─user //用户模块数据
│      └─... //其他模块数据
│
├─pages //主要页面
│  ├─index //首页布局
│  └─... //其他主要页面布局
│
├─pages_demo //分包页面实例
│  └─demo
│     ├─index //分包页面实例首页布局
│     └─form //分包页面实例表单布局
├─static
│  ├─scss //全局样式
│  ├─images //图片
│  ├─icons //自定义图标库
│  └─jsons //默认数据
├─store
│  ├─index //默认数据
│  └─userStore //用户信息
│  
├─uni_modules//uni插件
│ 
│utils//常用js工具
│   ├─wh.utils //工具基类
│   ├─wh.vconsole //调试工具
└─  └─wh.api //接口请求库
```

## 自定义组件
#### 组件名称: wh-icon
#### 组件描述: 
基于 Font Awesome 5
#### 组件使用说明: 
[官网：https://fa5.dashgame.com](https://fa5.dashgame.com/)

#### 属性说明: 

|属性名		|类型			|默认值			|说明																				|
|:-:		|:-:			|:-:			|:-:																				|
|type		|String			|必填			|图标图案，在Font Awesome 5.13.0 版本中的图标都可以，需要带前缀(fas/fab/far fa-*)	|
|size		|String/Number	|默认18px		|图标大小font-size不需要加单位 单位自动设置为rpx									|
|color		|String			|#000000		|颜色																				|
|fw			|Boolean		|false			|(固定宽度)是否需要垂直对齐一系列图标，例如列表或导航菜单中的图标					|
|rotate		|String/Number	|-				|旋转图标,顺时针方向,值为旋转度数180/270/90											|
|flip		|String			|-				|翻转图标,一共有三个值horizontal/vertical/both										|
|spin		|Boolean		|false			|(图标动画)使图标规律转动															|
|pulse		|Boolean		|false			|(图标动画)使图标8方向旋转(定格动画)												|
|border		|Boolean		|false			|给图标加上边框																		|
|pullLeft	|Boolean		|false			|此属性可改变icon位于text流位置(左侧)												|
|pullRight	|Boolean		|false			|此属性可改变icon位于text流位置(右侧)												|
|inverse	|Boolean		|false			|反色																				|
|stack		|Array			|-				|(堆叠)使两个图标堆叠在一起(具体请看下面详细说明)									|
|stackIndex	|String/Number	|stack存在时必填|堆叠大小(1为显示小一点的图标/2为显示大一点的图标)									|
|@click		|Function		|-				|点击事件																			|
|stop		|Boolean		|false			|阻止冒泡事件																		|

#### 组件使用示例: 
```
<wh-icon type="fas fa-angle-right" size="40" color="red" ></wh-icon>
```