# walle-uniapp-mp

**Repository Path**: goldpankit/walle-uniapp-mp

## Basic Information

- **Project Name**: walle-uniapp-mp
- **Description**: 🇨🇳一套基于Uniapp Vue3、SASS、Pinia的微信小程序开发框架，可与任意Wall-E系后端结合使用来完成C端互联网项目的研发。
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2024-04-26
- **Last Updated**: 2024-12-03

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

## 框架介绍
当前为Uniapp小程序的通用框架，样式预编译采用SASS，状态管理采用Pinia，未使用UI库。后续会陆续上架常用页面的插件。

## 功能总览

- 环境分离：提供开发、测试和生产环境的配置分离
- 常用插件，如dayjs，快速获取字典和系统配置方法等
- 请求工具脚本：可通过core/utils/request.js调用接口
- 整合pinia
- 分包处理
- 主题定义
- 内置图标

## 全局组件

### Icon

用于获取图标，用法如下：
```html
<Icon icon="icon-musicfill"/>
```
icon可在`static/iconfont/demo_index.html`中获取。

## 全局对象/方法

### $consts/常量
可在`core/plugins/consts.js`中定义常量，如下方式获取
```javascript
console.log(this.$consts.NAME);
```

### $storage/本地存储
提供方法如下
|方法名|参数|描述|
|-|-|-|
|get|key|从存储中获取数据|
|set|key, value|存储数据|
|remove|key|根据key删除存储的数据|

用法如下
```javascript
// 写入数据
this.$storage.set('myKey', 1);
// 获取数据
console.log(this.$storage.get('myKey'));
// 删除数据
this.$storage.remove('myKey');
```

### $tip/全局提示
目前提供了apiFailed方法用于做接口调用异常提示，与Eva用法保持一致。
```javascript
fetchList()
  .then(() =>   {})
  .catch(e =>   {
    this.$tip.apiFailed()
  })
```

### $bus/事件总线

事件总线用于处理跨页面的事件。

```javascript
// 绑定confirm事件
this.$bus.on('confirm', () =>   {
  // 删除confirm事件
  this.$bus.delete('confirm')
})
// 触发confirm事件
this.$bus.emit('confirm')
```

### $dayjs/日期处理

详见[dayjs中文网（非官网）](https://dayjs.fenxianglu.cn/category/)

### $c/根据配置编码获取配置值
详见[Eva4获取系统配置值](http://v4.eva.adjustrd.com/front/doc.html#c-%E8%8E%B7%E5%8F%96%E7%B3%BB%E7%BB%9F%E9%85%8D%E7%BD%AE%E5%80%BC)

### $d/根据编码表达式获取字典或数据标签
详见[Eva4获取字典/字典数据标签](http://v4.eva.adjustrd.com/front/doc.html#d-%E8%8E%B7%E5%8F%96%E5%AD%97%E5%85%B8-%E5%AD%97%E5%85%B8%E6%95%B0%E6%8D%AE%E6%A0%87%E7%AD%BE)

### $dc/获取字典数据配置方法
详见[Eva4获取字典数据配置方法](http://v4.eva.adjustrd.com/front/doc.html#dc-%E8%8E%B7%E5%8F%96%E5%AD%97%E5%85%B8%E6%95%B0%E6%8D%AE%E9%85%8D%E7%BD%AE%E6%96%B9%E6%B3%95)

### $defaultStore/默认store
可通过默认store获取默认store中的数据，如
```javascript
// 获取客户端配置
console.log(this.$defaultStore.clientConfig)
```

### navigateTo/跳转
封装uni.navigateTo方法，用法如下
```javascript
this.navigateTo('pages/index/index')
```
注意切换tabBar不能使用该方法。

## 分包处理

注意：分包应该是子页面，而不应该是tabbar对应的页面，这会导致切换tab时页面还在加载中导致闪现的情况。
1. 创建分包目录，与pages同级，如pages-user
2. 修改pages.json文件如下
```json
{
  "pages": [],
  "subPackages": [
    {
      "root": "pages-user",
      "pages": [
        {
          "path": "user/index"
        }
      ]
    }
  ]
}
```