介紹 3.0
項(xiàng)目重寫了~~基于uni-app，colorUI，封裝了《自定義TabBar》《上傳圖片》《全局自定義loading》等功能 主要適配 微信小程序、APP、H5。
新版特點(diǎn)
- 加入了 colorUI 開發(fā)起來更順手更快。
- 融合了七牛云存儲+阿里OSS存儲
- 優(yōu)化了TabBar
GitHub地址：https://github.com/gek6/fr-uni-app 有用的話給個start啊
H5在線示例 H5在線示例
image
第一步當(dāng)然是 npm install 安裝下依賴了。
全局自定義loading
// 已在 main.js 注冊全局組件，在每個頁面中 添加<cu-loading>即可 頁面中添加即可，其他組件無需添加。（頁面就是在pages.json 中注冊了的）
<cu-loading></cu-loading>
// 具體
// 是否顯示 半透明背景
// 是否點(diǎn)擊 半透明背景 關(guān)閉loading
// 在 /components/loading/loading.vue 中自行修改
自定義TabBar
- 這次做成了引入外部配置文件 uni-setting.json 請求在 App.vue 中的 onLaunch 里 H5注意需要服務(wù)端允許跨域
- 幾乎所有配置及數(shù)據(jù) 也在 vuex中統(tǒng)一管理 /store/index.js
- 注意：tabbar 所能切換的頁面 必須以組件的形式 已經(jīng)加載進(jìn) home.vue（根頁面）。
- 詳見 示例代碼
上傳圖片
- 普通上傳文件直接通過 官方的API 上傳到業(yè)務(wù)服務(wù)器 ，我就沒寫。
- 上傳至七牛云存儲 （支持 微信小程序 APP H5 其他未測，未兼容 ），上傳至七牛云均采用base64上傳。
- 上傳至阿里OSS （阿里OSS不支持直接上傳base64）
- H5上傳 是通過服務(wù)端 STS簽名 然后客戶端使用 ali-oss庫 進(jìn)行上傳。
- 其他端 為 客戶端直接自己簽名，通過uni.uploadFile(OBJECT)直接上傳，因?yàn)镠5 客戶端代碼會直接暴露，所以H5采用服務(wù)端簽名。
主題色
- 項(xiàng)目用到顏色的地方全部使用 vuex 中的 配置數(shù)據(jù)。
- 開發(fā)時候就得注意寫法 麻煩是麻煩了一些 不過如果有一鍵切換主題色的需求可以試試
