前言：
对uin-app的资料进行整理，这里说说他支持的框架资料。
官方入口：入口
相关资料：
一、ColorUI-高颜值，高效率的小程序组件库
git源码：点我
相关项目入口 - 一个基于colorui的商城项目：点我
实现步骤：
1、下载项目，找到这个colorui 文件夹，放到项目中
2、App.vue 引入关键Css main.css icon.css
<style>
@import "colorui/main.css";
@import "colorui/icon.css";
....
</style>3、main.js 引入 cu-custom 组件。
import cuCustom from './colorui/components/cu-custom.vue'
Vue.component('cu-custom',cuCustom)
4、page.vue 页面可以直接调用了
<cu-custom bgColor="bg-gradual-blue" :isBack="true">
<block slot="backText">返回</block>
<block slot="content">导航栏</block>
</cu-custom>
| 参数 | 作用 | 类型 | 默认值 |
|---|---|---|---|
| bgColor | 背景颜色类名 | String | '' |
| isBack | 是否开启返回 | Boolean | false |
| bgImage | 背景图片路径 | String | '' |
| slot块 | 作用 |
|---|---|
| backText | 返回时的文字 |
| content | 中间区域 |
| right | 右侧区域(小程序端可使用范围很窄！) |
实现效果：点我查看
二、uView2.0 ，uni-app中的框架，跟vue的ivew/element很像
1、安装
Hbuilder X方式
如果您是使用Hbuilder X开发的用户，您可以在uni-app插件市场通过uni_modules的形式进行安装，
此安装方式可以方便您后续在uni_modules对uView进行一键升级。
在uni-app插件市场右上角选择uni_modules版本下的使用HBuilderX导入插件，导入到对应的项目中即可。
注意： 此安装方式必须要按照下载方式安装的配置中的说明配置了才可用。下载地址：uView2.0重磅发布，利剑出鞘，一统江湖 - DCloud 插件市场
NPM方式
在项目根目录执行如下命令即可：
// 如果您的根目录没有package.json文件的话，请先执行如下命令：
// npm init -y
npm install uview-ui
// 更新
// npm update uview-ui
注意： 此安装方式必须要按照npm方式安装的配置中的说明配置了才可用，且项目名称不能有中文字符
2、配置
（前提）如果没有scss请安装
// 安装node-sass
npm i node-sass -D
// 安装sass-loader，注意需要版本10，否则可能会导致vue与sass的兼容问题而报错
npm i sass-loader@10 -D安装配置
由于uView支持npm和下载的方式安装，二者配置几乎一致，因为某些平台的兼容性，在配置easycom稍有不同，为了不造成混淆，这里将两种 方式分开说明：
#默认单位配置2.0.12
在uView1.x中，组件参数如果为数值的话，默认为rpx单位，但是rpx在平板上会导致尺寸超大，为了更高的可用性，所以uView2.x将单位默认改为px，如果您出于 某些需求，需要将单位改为rpx，可以在main.js中进行如下配置即可：
......
// main.js，注意要在use方法之后执行
import uView from 'uview-ui'
Vue.use(uView)
// 如此配置即可
uni.$u.config.unit = 'rpx'
......3、使用
通过npm和下载方式的配置之后，在某个页面可以直接使用组件，无需通过import引入组件。
<template>
<u-action-sheet :list="list" v-model="show"></u-action-sheet>
</template>
<script>
export default {
data() {
return {
list: [{
text: '点赞',
color: 'blue',
fontSize: 28
}, {
text: '分享'
}, {
text: '评论'
}],
show: true
}
}
}
</script>