1. 给noticebar组件增加圆角，内边距，为空隐藏等参数

2. 移除divider组件的默认高度，添加上下边距控制参数 3. 移除loadmore组件的默认高度，添加上下边距控制参数 4. 优化navbar自定义导航栏组件在小程序的适配 5. 修复badge组件的size参数无效问题 6. 修复键盘组件在微信小程序上遮罩无效的问题

1. 给noticebar组件增加圆角，内边距，为空隐藏等参数
2. 移除divider组件的默认高度，添加上下边距控制参数 3. 移除loadmore组件的默认高度，添加上下边距控制参数 4. 优化navbar自定义导航栏组件在小程序的适配 5. 修复badge组件的size参数无效问题 6. 修复键盘组件在微信小程序上遮罩无效的问题
d7ed0a52 · PC-20180318CEYD\Administrator · 240accf9 · d7ed0a52 · d7ed0a52 · d7ed0a52
Commit d7ed0a52 authored Apr 25, 2020 by $PC-20180318CEYD\Administrator's avatar$ PC-20180318CEYD\Administrator
81 changed files
--- a/main.js
+++ b/main.js
@@ -26,6 +26,10 @@ import store from '@/store'
 let vuexStore = require('@/store/$u.mixin.js')
 Vue.mixin(vuexStore)
+// 引入uView对小程序分享的mixin封装
+let mpShare = require('@/uview/libs/mixin/mpShare.js');
+Vue.mixin(mpShare)
 const app = new Vue({
  store,
  ...App

--- a/pages.json
+++ b/pages.json
@@ -6,7 +6,7 @@
 	// 	"current": 0, //当前激活的模式(list 的索引项)
 	// 	"list": [{
 	// 		"name": "test", //模式名称
-	// 		"path": "pages/componentsA/navbar/index", //启动页面，必选
+	// 		"path": "pages/componentsA/fullScreen/index", //启动页面，必选
 	// 		"query": "id=1&name=2" //启动参数，在页面的-+onLoad函数里面得到
 	// 	}]
 	// },
@@ -39,6 +39,19 @@
 			"style": {
 				"navigationBarTitleText": "模板"
 			}
+		},
+		// fullScreen-压窗屏
+		{
+			"path": "uview/components/u-full-screen/u-full-screen",
+			"style": {
+				"navigationStyle": "custom",
+				"app-plus": {
+					"animationType": "fade-in",
+					"background": "transparent",
+					"backgroundColor": "rgba(0,0,0,0)",
+					"popGesture": "none"
+				}
+			}
 		}
 	],
 	"subPackages": [{
@@ -430,6 +443,13 @@
 		{
 			"root": "pages/componentsA",
 			"pages": [
+				// fullScreen-压窗屏
+				{
+					"path": "fullScreen/index",
+					"style": {
+						"navigationBarTitleText": "fullScreen-压窗屏"
+					}
+				},
 				// navbar-自定义导航栏
 				{
 					"path": "navbar/index",
@@ -446,6 +466,13 @@
 						"navigationBarTitleText": "field-输入框"
 					}
 				},
+				// modal-模态框
+				{
+					"path": "modal/index",
+					"style": {
+						"navigationBarTitleText": "modal-模态框"
+					}
+				},
 				// indexList索引列表
 				{
 					"path": "indexList/index",

--- a/pages/componentsA/fullScreen/index.vue
+++ b/pages/componentsA/fullScreen/index.vue
+<template>
+	<view class="u-demo">
+		<view class="u-demo-wrap">
+			<view class="u-demo-title">演示效果</view>
+			<view class="u-demo-area">
+				<view class="u-no-demo-here">
+					通过压窗屏打开的模态框，可以遮盖顶部原生的导航栏和底部tabbar栏。
+					注意：压窗屏只对APP有效，其他端无效。
+				</view>
+			</view>
+		</view>
+		<view class="u-config-wrap">
+			<view class="u-config-title u-border-bottom">
+				参数配置
+			</view>
+			<view class="u-config-item">
+				<view class="u-item-title">状态</view>
+				<u-subsection vibrateShort :current="current" :list="['打开', '关闭']" @change="openModal"></u-subsection>
+			</view>
+		</view>
+	</view>
+</template>
+<script>
+	export default {
+		data() {
+			return {
+				current: 1
+			}
+		},
+		onShow() {
+			this.$nextTick(function(){
+				this.current = 1;
+			})
+		},
+		methods: {
+			openModal(index) {
+				// 可以传递参数
+				if(index == 0) {
+					this.$u.route("/uview/components/u-full-screen/u-full-screen?id=1");
+				}
+			}
+		}
+	}
+</script>
+<style lang="scss" scoped>
+	.u-demo {}
+</style>
--- a/pages/componentsA/modal/index.vue
+++ b/pages/componentsA/modal/index.vue
+<template>
+	<view class="u-demo">
+		<view class="u-demo-wrap">
+			<view class="u-demo-title">演示效果</view>
+			<view class="u-demo-area">
+				<u-toast ref="uToast"></u-toast>
+				<view class="u-no-demo-here">请点击弹出弹窗查看效果</view>
+				<u-modal v-model="show" :show-cancel-button="true" :show-title="showTitle">
+					<view class="warp" style="margin: 30rpx;" v-if="content">
+						<image class="logo" src="https://uviewui.com/common/logo.png" style="width: 220rpx;" mode="widthFix"></image>
+					</view>
+				</u-modal>
+			</view>
+		</view>
+		<view class="u-config-wrap">
+			<view class="u-config-title u-border-bottom">参数配置</view>
+			<view class="u-config-item">
+				<view class="u-item-title">状态</view>
+				<u-subsection vibrateShort :current="current" :list="['显示', '隐藏']" @change="showChange"></u-subsection>
+			</view>
+			<view class="u-config-item">
+				<view class="u-item-title">是否显示标题</view>
+				<u-subsection vibrateShort current="0" :list="['是', '否']" @change="titleChange"></u-subsection>
+			</view>
+			<view class="u-config-item">
+				<view class="u-item-title">自定义内容</view>
+				<u-subsection vibrateShort current="1" :list="['是', '否']" @change="contentChange"></u-subsection>
+			</view>
+		</view>
+	</view>
+</template>
+<script>
+	export default {
+		data() {
+			return {
+				show: false,
+				zoom: false,
+				content: false,
+				showTitle: true
+			};
+		},
+		computed: {
+			current() {
+				return this.show ? 0 : 1;
+			}
+		},
+		methods: {
+			showChange(index) {
+				this.show = index == 0 ? true : false;
+			},
+			titleChange(index) {
+				this.showTitle = index == 0 ? true : false;
+				this.show = true;
+			},
+			contentChange(index) {
+				this.content = index == 0 ? true : false;
+				this.show = true;
+			}
+		}
+	};
+</script>
+<style scoped lang="scss">
+	.warp {
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		height: 100%;
+	}
+	.rect {
+		width: 120px;
+		height: 120px;
+		background-color: #fff;
+	}
+	.logo {
+		height: auto;
+	}
+</style>
--- a/pages/componentsC/test/index.vue
+++ b/pages/componentsC/test/index.vue
 <template>
 	<view>
-		<u-tabs :list="list" :is-scroll="false" :current="current" @change="change"></u-tabs>
+		<u-modal v-model="show" :title-style="{color: 'red'}"></u-modal>
+		<u-button @click="open">
+			打开模态框
+		</u-button>
 	</view>
 </template>
 <script>
 	export default {
-		data() {
+		data() {	
 			return {
-				list: [{
+				show: false
-					name: '待收货'
-				}, {
-					name: '待付款'
-				}, {
-					name: '待评价'
-				}],
-				current: 0
 			}
 		},
 		methods: {
-			change(index) {
+			open() {
-				this.current = index;
+				this.show = true;
 			}
 		}
 	}

--- a/pages/example/components.config.js
+++ b/pages/example/components.config.js
@@ -130,6 +130,14 @@ export default [{
 			path: '/pages/componentsC/popup/index',
 			icon: 'popup',
 			title: 'Popup 弹出层',
+		}, {
+			path: '/pages/componentsA/modal/index',
+			icon: 'modal',
+			title: 'Modal 模态框',
+		}, {
+			path: '/pages/componentsA/fullScreen/index',
+			icon: 'pressingScreen',
+			title: 'fullScreen 压窗屏',
 		}]
 	}, {
 		groupName: '布局组件',

--- a/pages/template/mallMenu/index2.vue
+++ b/pages/template/mallMenu/index2.vue
@@ -106,7 +106,7 @@
 					await this.getElRect('menu-scroll-view', 'menuHeight');
 					await this.getElRect('u-tab-item', 'menuItemHeight');
 				}
-				// 将菜单菜单活动item垂直居中
+				// 将菜单活动item垂直居中
 				this.scrollTop = index * this.menuItemHeight + this.menuItemHeight / 2 - this.menuHeight / 2;
 			},
 			// 获取右边菜单每个item到顶部的距离
@@ -131,6 +131,7 @@
 			},
 			// 右边菜单滚动
 			async rightScroll(e) {
+				this.scrollRightTop = e.detail.scrollTop;
 				if(this.arr.length == 0) {
 					await this.getMenuItemTop();
 				}

--- a/static/uview/example/modal.png
+++ b/static/uview/example/modal.png
--- a/static/uview/example/pressingScreen.png
+++ b/static/uview/example/pressingScreen.png
--- a/uview/components/u-action-sheet/u-action-sheet.vue
+++ b/uview/components/u-action-sheet/u-action-sheet.vue
@@ -19,7 +19,7 @@
 <script>
 	/**
-	 * alertTips 提示
+	 * actionSheet 操作菜单
 	 * @description 本组件用于从底部弹出一个操作菜单，供用户选择并返回结果。本组件功能类似于uni的uni.showActionSheetAPI，配置更加灵活，所有平台都表现一致。
 	 * @tutorial https://www.uviewui.com/components/actionSheet.html
 	 * @property {Array<Object>} list 按钮的文字数组，见官方文档示例

--- a/uview/components/u-avatar/u-avatar.vue
+++ b/uview/components/u-avatar/u-avatar.vue
@@ -7,18 +7,23 @@
 </template>
 <script>
+	let base64Avatar = "data:image/png;base64,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";
 	/**
-	 * alertTips 提示
+	 * avatar 头像
-	 * @description 该组件一般的图片裁剪需求场景，尤其适合于头像裁剪方面。
+	 * @description 本组件一般用于展示头像的地方，如个人中心，或者评论列表页的用户头像展示等场所。
-	 * @tutorial https://www.uviewui.com/components/avatarCropper.html
+	 * @tutorial https://www.uviewui.com/components/avatar.html
-	 * @property {String Number} dest-width 输出图片宽度，高等于宽，单位px（默认200）
+	 * @property {String} bg-color 背景颜色，一般显示文字时用（默认#ffffff）
-	 * @property {String Number} rect-width 裁剪框宽度，高等于宽，单位px（默认200）
+	 * @property {String} src 头像路径，如加载失败，将会显示默认头像
-	 * @property {String} file-type 输出的图片类型，如果'png'类型发现裁剪的图片太大，改成"jpg"即可（默认jpg）
+	 * @property {String Number} size 头像尺寸，可以为指定字符串(large, default, mini)，或者数值，单位rpx（默认default）
-	 * @event {Function} uAvatarCropper 裁剪结束后的事件，通过uni.$on监听
+	 * @property {String} mode 显示类型，见上方说明（默认circle）
-	 * @example <image class="u-avatar-demo" :src="avatar" mode="aspectFill"></image>
+	 * @property {String} text 用文字替代图片，级别优先于src
+	 * @property {String} img-mode 头像图片的裁剪类型，与uni的image组件的mode参数一致，如效果达不到需求，可尝试传widthFix值（默认aspectFill）
+	 * @property {String} index 用户传递的标识符值，如果是列表循环，可穿v-for的index值
+	 * @event {Function} click 头像被点击
+	 * @example <u-avatar :src="src"></u-avatar>
 	 */
-	let base64Avatar = "data:image/png;base64,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";
 	export default {
+		name: 'u-avatar',
 		props: {
 			// 背景颜色
 			bgColor: {

--- a/uview/components/u-badge/u-badge.vue
+++ b/uview/components/u-badge/u-badge.vue
@@ -13,8 +13,8 @@
 <script>
 	/**
-	 * alertTips 提示
+	 * badge 角标
-	 * @description 该组件一般用于图标右上角显示未读的消息数量，提示用户点击，有圆点和圆包含文字两种形式。
+	 * @description 本组件一般用于展示头像的地方，如个人中心，或者评论列表页的用户头像展示等场所。
 	 * @tutorial https://www.uviewui.com/components/badge.html
 	 * @property {String Number} count 展示的数字，大于 overflowCount 时显示为 ${overflowCount}+，为0且show-zero为false时隐藏
 	 * @property {Boolean} is-dot 不展示数字，只有一个小点（默认false）
@@ -30,6 +30,7 @@
 	 * @example <u-badge type="error" count="7"></u-badge>
 	 */
 	export default {
+		name: 'u-badge',
 		props: {
 			// primary,warning,success,error,info
 			type: {

--- a/uview/components/u-button/u-button.vue
+++ b/uview/components/u-button/u-button.vue
@@ -25,7 +25,7 @@
 <script>
 	/**
-	 * alertTips 提示
+	 * button 按钮
 	 * @description Button 按钮
 	 * @tutorial https://www.uviewui.com/components/button.html
 	 * @property {String} size 按钮的大小

--- a/uview/components/u-car-keyboard/u-car-keyboard.vue
+++ b/uview/components/u-car-keyboard/u-car-keyboard.vue
@@ -24,7 +24,7 @@
 <script>
 	/**
-	 * alertTips 提示
+	 * carKeyboard 车牌号键盘
 	 * @description 此为uViw自定义的键盘面板，内含了数字键盘，车牌号键，身份证号键盘3中模式，都有可以打乱按键顺序的选项。
 	 * @tutorial https://www.uviewui.com/components/keyboard.html
 	 * @property {String} mode 键盘类型，见官网基本使用的说明（默认number）

--- a/uview/components/u-cell-group/u-cell-group.vue
+++ b/uview/components/u-cell-group/u-cell-group.vue
@@ -11,7 +11,7 @@
 <script>
 	/**
-	 * alertTips 提示
+	 * cellGroup 单元格父组件Group
 	 * @description cell单元格一般用于一组列表的情况，比如个人中心页，设置页等。搭配u-cell-item
 	 * @tutorial https://www.uviewui.com/components/cell.html
 	 * @property {String} title 分组标题

--- a/uview/components/u-cell-item/u-cell-item.vue
+++ b/uview/components/u-cell-item/u-cell-item.vue
@@ -32,8 +32,8 @@
 <script>
 	/**
-	 * alertTips 提示
+	 * cellItem 单元格Item
-	 * @description 警告提示，展现需要关注的信息。
+	 * @description cell单元格一般用于一组列表的情况，比如个人中心页，设置页等。搭配u-cell-group使用
 	 * @tutorial https://www.uviewui.com/components/cell.html
 	 * @property {String} title 左侧标题
 	 * @property {String} icon 左侧图标名，只支持uView内置图标，见Icon 图标

--- a/uview/components/u-checkbox-group/u-checkbox-group.vue
+++ b/uview/components/u-checkbox-group/u-checkbox-group.vue
@@ -6,7 +6,7 @@
 <script>
 	/**
-	 * alertTips 提示
+	 * checkboxGroup 开关选择器父组件Group
 	 * @description 复选框组件一般用于需要多个选择的场景，该组件功能完整，使用方便
 	 * @tutorial https://www.uviewui.com/components/checkbox.html
 	 * @property {String Number} max 最多能选中多少个checkbox（默认999）
@@ -15,7 +15,8 @@
 	 * @event {Function} change 任一个checkbox状态发生变化时触发，回调为一个对象
 	 * @example <u-checkbox-group></u-checkbox-group>
 	 */
 	export default {
+		name: 'u-checkbox-group',
 		props: {
 			// 最多能选中多少个checkbox
 			max: {

--- a/uview/components/u-checkbox/u-checkbox.vue
+++ b/uview/components/u-checkbox/u-checkbox.vue
@@ -11,7 +11,7 @@
 <script>
 	/**
-	 * alertTips 提示
+	 * checkbox 复选框
 	 * @description 该组件需要搭配checkboxGroup组件使用，以便用户进行操作时，获得当前复选框组的选中情况。
 	 * @tutorial https://www.uviewui.com/components/checkbox.html
 	 * @property {String Number} icon-size 图标大小，单位rpx（默认24）

--- a/uview/components/u-circle-progress/u-circle-progress.vue
+++ b/uview/components/u-circle-progress/u-circle-progress.vue
@@ -18,7 +18,7 @@
 <script>
 	/**
-	 * alertTips 提示
+	 * circleProgress 环形进度条
 	 * @description 展示操作或任务的当前进度，比如上传文件，是一个圆形的进度条。注意：此组件的percent值只能动态增加，不能动态减少。
 	 * @tutorial https://www.uviewui.com/components/circleProgress.html
 	 * @property {String Number} percent 圆环进度百分比值，为数值类型，0-100

--- a/uview/components/u-col/u-col.vue
+++ b/uview/components/u-col/u-col.vue
@@ -11,7 +11,16 @@
 </template>
 <script>
+	/**
+	 * col 布局单元格
+	 * @description 通过基础的 12 分栏，迅速简便地创建布局（搭配<u-row>使用）
+	 * @tutorial https://www.uviewui.com/components/layout.html
+	 * @property {String Number} span 栅格占据的列数，总12等分（默认0）
+	 * @property {String Number} offset 分栏左边偏移，计算方式与span相同（默认0）
+	 * @example <u-col span="3"><view class="demo-layout bg-purple"></view></u-col>
+	 */
 	export default {
+		name: "u-col",
 		props: {
 			// 占父容器宽度的多少等分，总分为12份
 			span: {
@@ -34,55 +43,55 @@
 		float: left;
 		/* #endif */
 	}
 	.u-col-0 {
 		width: 0;
 	}
 	.u-col-1 {
 		width: calc(100%/12);
 	}
 	.u-col-2 {
 		width: calc(100%/12 * 2);
 	}
 	.u-col-3 {
 		width: calc(100%/12 * 3);
 	}
 	.u-col-4 {
 		width: calc(100%/12 * 4);
 	}
 	.u-col-5 {
 		width: calc(100%/12 * 5);
 	}
 	.u-col-6 {
 		width: calc(100%/12 * 6);
 	}
 	.u-col-7 {
 		width: calc(100%/12 * 7);
 	}
 	.u-col-8 {
 		width: calc(100%/12 * 8);
 	}
 	.u-col-9 {
 		width: calc(100%/12 * 9);
 	}
 	.u-col-10 {
 		width: calc(100%/12 * 10);
 	}
 	.u-col-11 {
 		width: calc(100%/12 * 11);
 	}
 	.u-col-12 {
 		width: calc(100%/12 * 12);
 	}

--- a/uview/components/u-collapse-item/u-collapse-item.vue
+++ b/uview/components/u-collapse-item/u-collapse-item.vue
@@ -22,7 +22,7 @@
 <script>
 	/**
-	 * alertTips 提示
+	 * collapseItem 手风琴Item
 	 * @description 通过折叠面板收纳内容区域（搭配u-collapse使用）
 	 * @tutorial https://www.uviewui.com/components/collapse.html
 	 * @property {String} title 面板标题

--- a/uview/components/u-collapse/u-collapse.vue
+++ b/uview/components/u-collapse/u-collapse.vue
@@ -6,7 +6,7 @@
 <script>
 	/**
-	 * alertTips 提示
+	 * collapse 手风琴
 	 * @description 通过折叠面板收纳内容区域
 	 * @tutorial https://www.uviewui.com/components/collapse.html
 	 * @property {Boolean} accordion 是否手风琴模式（默认true）

--- a/uview/components/u-count-down/u-count-down.vue
+++ b/uview/components/u-count-down/u-count-down.vue
@@ -53,11 +53,11 @@
 <script>
 /**
- * alertTips 提示
+ * countDown 倒计时
 * @description 该组件一般使用于某个活动的截止时间上，通过数字的变化，给用户明确的时间感受，提示用户进行某一个行为操作。
 * @tutorial https://www.uviewui.com/components/countDown.html
 * @property {String Number} timestamp 倒计时，单位为秒
- * @property {Boolean} autopaly 是否自动开始倒计时，如果为false，需手动调用开始方法。见官网说明（默认true）
+ * @property {Boolean} autoplay 是否自动开始倒计时，如果为false，需手动调用开始方法。见官网说明（默认true）
 * @property {String} separator 分隔符，colon为英文冒号，zh为中文（默认colon）
 * @property {String Number} separator-size 分隔符的字体大小，单位rpx（默认30）
 * @property {String} separator-color 分隔符的颜色（默认#303133）
@@ -75,6 +75,7 @@
 * @example <u-count-down ref="uCountDown" :timestamp="86400" :autoplay="false"></u-count-down>
 */
 export default {
+	name: 'u-count-down',
 	props: {
 		// 倒计时的时间，秒为单位
 		timestamp: {
@@ -219,7 +220,16 @@ export default {
 			seconds <= 0 && this.end();
 			let [day, hour, minute, second] = [0, 0, 0, 0];
 			day = Math.floor(seconds / (60 * 60 * 24));
+			// 判断是否显示“天”参数，如果不显示，将天部分的值，加入到小时中
+			// hour为给后面计算秒和分等用的(基于显示天的前提下计算)
 			hour = Math.floor(seconds / (60 * 60)) - day * 24;
+			// showHour为需要显示的小时
+			let showHour = null;
+			if(this.showDays) {
+				showHour = hour;
+			} else {
+				showHour = Math.floor(seconds / (60 * 60));
+			}
 			minute = Math.floor(seconds / 60) - hour * 60 - day * 24 * 60;
 			second = Math.floor(seconds) - day * 24 * 60 * 60 - hour * 60 * 60 - minute * 60;
 			// 如果小于10，在前面补上一个"0"
@@ -227,7 +237,7 @@ export default {
 			minute = minute < 10 ? '0' + minute : minute;
 			second = second < 10 ? '0' + second : second;
 			this.d = day;
-			this.h = hour;
+			this.h = showHour;
 			this.i = minute;
 			this.s = second;
 		},

--- a/uview/components/u-count-to/u-count-to.vue
+++ b/uview/components/u-count-to/u-count-to.vue
@@ -13,7 +13,7 @@
 <script>
 /**
- * alertTips 提示
+ * countTo 数字滚动
 * @description 该组件一般用于需要滚动数字到某一个值的场景，目标要求是一个递增的值。
 * @tutorial https://www.uviewui.com/components/countTo.html
 * @property {String Number} start-val 开始值
@@ -25,10 +25,12 @@
 * @property {String} separator 千位分隔符，见官网说明
 * @property {String} color 字体颜色（默认#303133）
 * @property {String Number} font-size 字体大小，单位rpx（默认50）
+ * @property {Boolean} bold 字体是否加粗（默认false）
 * @event {Function} end 数值滚动到目标值时触发
 * @example <u-count-to ref="uCountTo" :end-val="endVal" :autoplay="autoplay"></u-count-to>
 */
 export default {
+	name: 'u-count-to',
 	props: {
 		// 开始的数值，默认从0增长到某一个数
 		startVal: {

--- a/uview/components/u-divider/u-divider.vue
+++ b/uview/components/u-divider/u-divider.vue
@@ -16,7 +16,7 @@
 <script>
 /**
- * alertTips 提示
+ * divider 分割线
 * @description 区隔内容的分割线，一般用于页面底部"没有更多"的提示。
 * @tutorial https://www.uviewui.com/components/divider.html
 * @property {String Number} half-width 文字左或右边线条宽度，数值或百分比，数值时单位为rpx
@@ -26,10 +26,13 @@
 * @property {String} bg-color 整个divider的背景颜色（默认呢#ffffff）
 * @property {String Number} height 整个divider的高度，单位rpx（默认40）
 * @property {String} type 将线条设置主题色（默认primary）
+ * @property {String Number} margin-top 与前一个组件的距离，单位rpx（默认0）
+ * @property {String Number} margin-bottom 与后一个组件的距离，单位rpx（0）
 * @event {Function} click divider组件被点击时触发
 * @example <u-divider color="#fa3534">长河落日圆</u-divider>
 */
 export default {
+	name: 'u-divider',
 	props: {
 		// 单一边divider横线的宽度(数值)，单位rpx。或者百分比
 		halfWidth: {
@@ -116,6 +119,7 @@ export default {
 .u-divider-text {
 	white-space: nowrap;
+	padding: 0 16rpx;
 	display: inline-flex;
 }
 </style>
--- a/uview/components/u-empty/u-empty.vue
+++ b/uview/components/u-empty/u-empty.vue
@@ -17,8 +17,9 @@
 </template>
 <script>
+	import icon from "./icon.js";
 	/**
-	 * alertTips 提示
+	 * empty 内容为空
 	 * @description 该组件用于需要加载内容，但是加载的第一页数据就为空，提示一个"没有内容"的场景， 我们精心挑选了十几个场景的图标，方便您使用。
 	 * @tutorial https://www.uviewui.com/components/empty.html
 	 * @property {String} color 文字颜色（默认#c0c4cc）
@@ -33,7 +34,6 @@
 	 * @event {Function} close 点击关闭按钮时触发
 	 * @example <u-empty text="所谓伊人，在水一方" mode="list"></u-empty>
 	 */
-	import icon from "./icon.js";
 	export default {
 		name: "u-empty",
 		props: {

--- a/uview/components/u-field/u-field.vue
+++ b/uview/components/u-field/u-field.vue
 <template>
 	<view class="u-field" :class="{'u-field-border': itemIndex > 0 }">
-		<view class="u-field-inner" :class="[type == 'textarea' ? 'u-textarea-inner' : '', 'u-label-postion-' + labelPostion]">
+		<view class="u-field-inner" :class="[type == 'textarea' ? 'u-textarea-inner' : '', 'u-label-postion-' + labelPosition]">
 			<view class="u-label" :class="[required ? 'u-required' : '']" :style="{
 				justifyContent: justifyContent, 
-				flex: labelPostion == 'left' ? `0 0 ${labelWidth}rpx` : '1'
+				flex: labelPosition == 'left' ? `0 0 ${labelWidth}rpx` : '1'
 			}">
 				<view class="u-icon-wrap" v-if="icon">
 					<u-icon size="32" :name="icon" :color="iconColor" class="u-icon"></u-icon>
@@ -47,38 +47,38 @@
 </template>
 <script>
-	/**
+/**
-	 * alertTips 提示
+ * field 输入框
-	 * @description 借助此组件，可以实现表单的输入， 有"text"和"textarea"类型的，此外，借助uView的picker和actionSheet组件可以快速实现上拉菜单，时间，地区选择等， 为表单解决方案的利器。
+ * @description 借助此组件，可以实现表单的输入， 有"text"和"textarea"类型的，此外，借助uView的picker和actionSheet组件可以快速实现上拉菜单，时间，地区选择等， 为表单解决方案的利器。
-	 * @tutorial https://www.uviewui.com/components/field.html
+ * @tutorial https://www.uviewui.com/components/field.html
-	 * @property {String} type 输入框的类型（默认text）
+ * @property {String} type 输入框的类型（默认text）
-	 * @property {String} icon label左边的图标，限uView的图标名称
+ * @property {String} icon label左边的图标，限uView的图标名称
-	 * @property {Boolean} right-icon 输入框右边的（默认false）
+ * @property {Boolean} right-icon 输入框右边的（默认false）
-	 * @property {Boolean} required 是否必填，左边您显示红色"*"号（默认false）
+ * @property {Boolean} required 是否必填，左边您显示红色"*"号（默认false）
-	 * @property {String} label 输入框左边的文字提示
+ * @property {String} label 输入框左边的文字提示
-	 * @property {Boolean} password 是否密码输入方式(用点替换文字)，type为text时有效（默认false）
+ * @property {Boolean} password 是否密码输入方式(用点替换文字)，type为text时有效（默认false）
-	 * @property {Boolean} clearable 是否显示右侧清空内容的图标控件(输入框有内容，且获得焦点时才显示)，点击可清空输入框内容（默认true）
+ * @property {Boolean} clearable 是否显示右侧清空内容的图标控件(输入框有内容，且获得焦点时才显示)，点击可清空输入框内容（默认true）
-	 * @property {Number String} label-width label的宽度，单位rpx（默认130）
+ * @property {Number String} label-width label的宽度，单位rpx（默认130）
-	 * @property {String} label-align label的文字对齐方式（默认left）
+ * @property {String} label-align label的文字对齐方式（默认left）
-	 * @property {String} input-align 输入框内容对齐方式（默认left）
+ * @property {String} input-align 输入框内容对齐方式（默认left）
-	 * @property {String} icon-color 左边通过icon配置的图标的颜色（默认#606266）
+ * @property {String} icon-color 左边通过icon配置的图标的颜色（默认#606266）
-	 * @property {Boolean} auto-height 是否自动增高输入区域，type为textarea时有效（默认true）
+ * @property {Boolean} auto-height 是否自动增高输入区域，type为textarea时有效（默认true）
-	 * @property {String Boolean} error-message 显示的错误提示内容，如果为空字符串或者false，则不显示错误信息
+ * @property {String Boolean} error-message 显示的错误提示内容，如果为空字符串或者false，则不显示错误信息
-	 * @property {String} placeholder 输入框的提示文字
+ * @property {String} placeholder 输入框的提示文字
-	 * @property {String} placeholder-style placeholder的样式(内联样式，字符串)，如"color: #ddd"
+ * @property {String} placeholder-style placeholder的样式(内联样式，字符串)，如"color: #ddd"
-	 * @property {Boolean} focus 是否自动获得焦点（默认false）
+ * @property {Boolean} focus 是否自动获得焦点（默认false）
-	 * @property {Boolean} fixed 如果type为textarea，且在一个"position:fixed"的区域，需要指明为true（默认false）
+ * @property {Boolean} fixed 如果type为textarea，且在一个"position:fixed"的区域，需要指明为true（默认false）
-	 * @property {Boolean} disabled 是否不可输入（默认false）
+ * @property {Boolean} disabled 是否不可输入（默认false）
-	 * @property {Number String} maxlength 最大输入长度，设置为 -1 的时候不限制最大长度（默认140）
+ * @property {Number String} maxlength 最大输入长度，设置为 -1 的时候不限制最大长度（默认140）
-	 * @property {String} confirm-type 设置键盘右下角按钮的文字，仅在type="text"时生效（默认done）
+ * @property {String} confirm-type 设置键盘右下角按钮的文字，仅在type="text"时生效（默认done）
-	 * @event {Function} input 输入框内容发生变化时触发
+ * @event {Function} input 输入框内容发生变化时触发
-	 * @event {Function} focus 输入框获得焦点时触发
+ * @event {Function} focus 输入框获得焦点时触发
-	 * @event {Function} blur 输入框失去焦点时触发
+ * @event {Function} blur 输入框失去焦点时触发
-	 * @event {Function} confirm 点击完成按钮时触发
+ * @event {Function} confirm 点击完成按钮时触发
-	 * @event {Function} right-icon-click 通过right-icon生成的图标被点击时触发
+ * @event {Function} right-icon-click 通过right-icon生成的图标被点击时触发
-	 * @event {Function} click 输入框被点击或者通过right-icon生成的图标被点击时触发，这样设计是考虑到传递右边的图标，一般都为需要弹出"picker"等操作时的场景，点击倒三角图标，理应发出此事件，见上方说明
+ * @event {Function} click 输入框被点击或者通过right-icon生成的图标被点击时触发，这样设计是考虑到传递右边的图标，一般都为需要弹出"picker"等操作时的场景，点击倒三角图标，理应发出此事件，见上方说明
-	 * @example <u-field v-model="mobile" label="手机号" required :error-message="errorMessage"></u-field>
+ * @example <u-field v-model="mobile" label="手机号" required :error-message="errorMessage"></u-field>
-	 */
+ */
 export default {
 	name:"u-field",
 	props: {
@@ -143,7 +143,7 @@ export default {
 			default: 'done'
 		},
 		// lable的位置，可选为 left-左边，top-上边
-		labelPostion: {
+		labelPosition: {
 			type: String,
 			default: 'left'
 		}
@@ -165,7 +165,7 @@ export default {
 			let style = {};
 			style.textAlign = this.inputAlign;
 			// 判断lable的位置，如果是left的话，让input左边两边有间隙
-			if(this.labelPostion == 'left') {
+			if(this.labelPosition == 'left') {
 				style.margin = `0 8rpx`;
 			} else {
 				// 如果lable是top的，input的左边就没必要有间隙了
@@ -200,7 +200,7 @@ export default {
 		// label的位置
 		fieldInnerStyle() {
 			let style = {};
-			if(this.labelPostion == 'left') {
+			if(this.labelPosition == 'left') {
 				style.flexDirection = 'row';
 			} else {
 				style.flexDirection = 'column';

--- a/uview/components/u-full-screen/u-full-screen.vue
+++ b/uview/components/u-full-screen/u-full-screen.vue
+<template>
+	<u-modal v-model="show" :show-cancel-button="true" confirm-text="升级" title="发现新版本" @cancel="cancel" @confirm="confirm">
+		<view class="u-update-content">
+			<rich-text :nodes="content"></rich-text>
+		</view>
+	</u-modal>
+</template>
+<script>
+	export default {
+		data() {
+			return {
+				show: true,
+				content: `
+					1. 修复badge组件的size参数无效问题<br>
+					2. 新增Modal模态框组件<br>
+					3. 新增压窗屏组件，可以在APP上以弹窗的形式遮盖导航栏和底部tabbar<br>
+					4. 修复键盘组件在微信小程序上遮罩无效的问题
+				`,
+			}
+		},
+		onShow() {
+			this.show = true;
+		},
+		methods: {
+			cancel() {
+				this.closeModal();
+			},
+			confirm() {
+				this.closeModal();
+			},
+			closeModal() {
+				uni.navigateBack();
+			}
+		}
+	}
+</script>
+<style scoped lang="scss">
+	.u-full-content {
+		background-color: #00C777;
+	}
+	.u-update-content {
+		font-size: 26rpx;
+		color: $u-content-color;
+		line-height: 1.7;
+		padding: 30rpx;
+	}
+</style>
--- a/uview/components/u-gap/u-gap.vue
+++ b/uview/components/u-gap/u-gap.vue
@@ -4,14 +4,17 @@
 <script>
 /**
- * alertTips 提示
+ * gap 间隔槽
 * @description 该组件一般用于内容块之间的用一个灰色块隔开的场景，方便用户风格统一，减少工作量
 * @tutorial https://www.uviewui.com/components/gap.html
 * @property {String} bg-color 背景颜色（默认#f3f4f6）
 * @property {String Number} height 分割槽高度，单位rpx（默认30）
+ * @property {String Number} margin-top 与前一个组件的距离，单位rpx（默认0）
+ * @property {String Number} margin-bottom 与后一个组件的距离，单位rpx（0）
 * @example <u-gap height="80" bg-color="#bbb"></u-gap>
 */
 export default {
+	name: "u-gap",
 	props: {
 		bgColor: {
 			type: String,
@@ -22,18 +25,24 @@ export default {
 			type: [String, Number],
 			default: 30
 		},
-		margin: {
+		// 与上一个组件的距离
+		marginTop: {
 			type: [String, Number],
 			default: 0
-		}
+		},
+		// 与下一个组件的距离
+		marginBottom: {
+			type: [String, Number],
+			default: 0
+		},
 	},
 	computed: {
 		gapStyle() {
 			return {
 				backgroundColor: this.bgColor,
 				height: this.height + 'rpx',
-				marginTop: this.margin + 'rpx',
+				marginTop: this.marginTop + 'rpx',
-				marginBttom: this.margin + 'rpx'
+				marginBottom: this.marginBottom + 'rpx'
 			};
 		}
 	}

--- a/uview/components/u-grid-item/u-grid-item.vue
+++ b/uview/components/u-grid-item/u-grid-item.vue
@@ -12,8 +12,8 @@
 <script>
 	/**
-	 * alertTips 提示
+	 * gridItem 提示
-	 * @description 宫格组件一般用于同时展示多个同类项目的场景，可以给宫格的项目设置徽标组件(badge)，或者图标等，也可以扩展为左右滑动的轮播形式。搭配<u-grid>使用
+	 * @description 宫格组件一般用于同时展示多个同类项目的场景，可以给宫格的项目设置徽标组件(badge)，或者图标等，也可以扩展为左右滑动的轮播形式。搭配u-grid使用
 	 * @tutorial https://www.uviewui.com/components/grid.html
 	 * @property {String} bg-color 宫格的背景颜色（默认#ffffff）
 	 * @property {String Number} index 点击宫格时，返回的值

--- a/uview/components/u-grid/u-grid.vue
+++ b/uview/components/u-grid/u-grid.vue
@@ -4,7 +4,7 @@
 <script>
 /**
- * alertTips 提示
+ * grid 宫格布局
 * @description 宫格组件一般用于同时展示多个同类项目的场景，可以给宫格的项目设置徽标组件(badge)，或者图标等，也可以扩展为左右滑动的轮播形式。
 * @tutorial https://www.uviewui.com/components/grid.html
 * @property {String Number} col 宫格的列数（默认3）
@@ -14,6 +14,7 @@
 * @example <u-grid :col="3" @click="click"></u-grid>
 */
 export default {
+	name: 'u-grid',
 	props: {
 		// 分成几列
 		col: {

--- a/uview/components/u-icon/u-icon.vue
+++ b/uview/components/u-icon/u-icon.vue
@@ -11,7 +11,7 @@
 <script>
 	/**
-	 * alertTips 提示
+	 * icon 图标
 	 * @description 基于字体的图标集，包含了大多数常见场景的图标。
 	 * @tutorial https://www.uviewui.com/components/icon.html
 	 * @property {String} name 图标名称，见示例图标集

--- a/uview/components/u-index-anchor/u-index-anchor.vue
+++ b/uview/components/u-index-anchor/u-index-anchor.vue
@@ -11,7 +11,7 @@
 <script>
 	/**
-	 * alertTips 提示
+	 * indexAnchor 索引列表锚点
 	 * @description 通过折叠面板收纳内容区域,搭配<u-index-anchor>使用
 	 * @tutorial https://www.uviewui.com/components/indexList.html#indexanchor-props
 	 * @property {Boolean} use-slot 是否使用自定义内容的插槽（默认false）

--- a/uview/components/u-index-list/u-index-list.vue
+++ b/uview/components/u-index-list/u-index-list.vue
@@ -17,12 +17,21 @@
 </template>
 <script>
+	var indexList = function() {
+		var indexList = [];
+		var charCodeOfA = 'A'.charCodeAt(0);
+		for (var i = 0; i < 26; i++) {
+			indexList.push(String.fromCharCode(charCodeOfA + i));
+		}
+		return indexList;
+	};
 	/**
-	 * alertTips 提示
+	 * indexList 索引列表
 	 * @description 通过折叠面板收纳内容区域,搭配<u-index-anchor>使用
 	 * @tutorial https://www.uviewui.com/components/indexList.html#indexanchor-props
 	 * @property {Number String} scroll-top 当前滚动高度，自定义组件无法获得滚动条事件，所以依赖接入方传入
-	 * @property {Array[string number]} index-list 索引字符列表，数组（默认A-Z）
+	 * @property {Array} index-list 索引字符列表，数组（默认A-Z）
 	 * @property {Number String} z-index 锚点吸顶时的层级（默认965）
 	 * @property {Boolean} sticky 是否开启锚点自动吸顶（默认true）
 	 * @property {Number String} offset-top 锚点自动吸顶时与顶部的距离（默认0）
@@ -30,14 +39,6 @@
 	 * @event {Function} select 选中右边索引字符时触发
 	 * @example <u-index-list :scrollTop="scrollTop"></u-index-list>
 	 */
-	var indexList = function() {
-		var indexList = [];
-		var charCodeOfA = 'A'.charCodeAt(0);
-		for (var i = 0; i < 26; i++) {
-			indexList.push(String.fromCharCode(charCodeOfA + i));
-		}
-		return indexList;
-	};
 	export default {
 		name: "u-index-list",
 		props: {

--- a/uview/components/u-keyboard/u-keyboard.vue
+++ b/uview/components/u-keyboard/u-keyboard.vue
@@ -24,7 +24,7 @@
 <script>
 	/**
-	 * alertTips 提示
+	 * keyboard 键盘
 	 * @description 此为uViw自定义的键盘面板，内含了数字键盘，车牌号键，身份证号键盘3中模式，都有可以打乱按键顺序的选项。
 	 * @tutorial https://www.uviewui.com/components/keyboard.html
 	 * @property {String} mode 键盘类型，见官网基本使用的说明（默认number）

--- a/uview/components/u-lazy-load/u-lazy-load.vue
+++ b/uview/components/u-lazy-load/u-lazy-load.vue
@@ -16,8 +16,10 @@
 </template>
 <script>
+	// observer最终赋值的是个对象，不能放到data中，vue会报错（浏览器），也不能在用到的地方let定义，某些安卓也报错……
+	let observer = {};
 	/**
-	 * alertTips 提示
+	 * lazyLoad 懒加载
 	 * @description 懒加载使用的场景为：页面有很多图片时，APP会同时加载所有的图片，导致页面卡顿，各个位置的图片出现前后不一致等.
 	 * @tutorial https://www.uviewui.com/components/lazyLoad.html
 	 * @property {String Number} index 用户自定义值，在事件触发时回调，用以区分是哪个图片
@@ -36,9 +38,8 @@
 	 * @event {Function} error 图片加载失败时触发
 	 * @example <u-lazy-load :image="image" :loading-img="loadingImg" :error-img="errorImg"></u-lazy-load>
 	 */
-	// observer最终赋值的是个对象，不能放到data中，vue会报错（浏览器），也不能在用到的地方let定义，某些安卓也报错……
-	let observer = {};
 	export default {
+		name: 'u-lazy-load',
 		props: {
 			index: {
 				type: [Number, String]

--- a/uview/components/u-line-progress/u-line-progress.vue
+++ b/uview/components/u-line-progress/u-line-progress.vue
@@ -10,7 +10,7 @@
 <script>
 	/**
-	 * alertTips 提示
+	 * lineProgress 线型进度条
 	 * @description 展示操作或任务的当前进度，比如上传文件，是一个线形的进度条。
 	 * @tutorial https://www.uviewui.com/components/lineProgress.html
 	 * @property {String Number} percent 进度条百分比值，为数值类型，0-100

--- a/uview/components/u-link/u-link.vue
+++ b/uview/components/u-link/u-link.vue
@@ -11,7 +11,7 @@
 <script>
 	/**
-	 * alertTips 提示
+	 * link 超链接
 	 * @description 该组件为超链接组件，在不同平台有不同表现形式：在APP平台会通过plus环境打开内置浏览器，在小程序中把链接复制到粘贴板，同时提示信息，在H5中通过window.open打开链接。
 	 * @tutorial https://www.uviewui.com/components/link.html
 	 * @property {String} color 文字颜色（默认#606266）

--- a/uview/components/u-loading/u-loading.vue
+++ b/uview/components/u-loading/u-loading.vue
@@ -5,7 +5,7 @@
 <script>
 	/**
-	 * alertTips 提示
+	 * loading 加载动画
 	 * @description 警此组件为一个小动画，目前用在uView的loadmore加载更多和switch开关等组件的正在加载状态场景。
 	 * @tutorial https://www.uviewui.com/components/loading.html
 	 * @property {String} mode 模式选择，见官网说明（默认circle）

--- a/uview/components/u-loadmore/u-loadmore.vue
+++ b/uview/components/u-loadmore/u-loadmore.vue
@@ -17,7 +17,7 @@
 <script>
 	/**
-	 * alertTips 提示
+	 * loadmore 加载更多
 	 * @description 此组件一般用于标识页面底部加载数据时的状态。
 	 * @tutorial https://www.uviewui.com/components/loadMore.html
 	 * @property {String} status 组件状态（默认loadmore）
@@ -33,7 +33,7 @@
 	 * @example <u-loadmore :status="status" icon-type="iconType" load-text="loadText" />
 	 */
 	export default {
-		name: "loadMore",
+		name: "u-loadmore",
 		props: {
 			//当前页面背景颜色，如果背景为非白色的时候，需要把此值设置为背景的颜色
 			bgColor: {

--- a/uview/components/u-mask/u-mask.vue
+++ b/uview/components/u-mask/u-mask.vue
@@ -6,7 +6,7 @@
 <script>
 	/**
-	 * alertTips 提示
+	 * mask 遮罩
 	 * @description 创建一个遮罩层，用于强调特定的页面元素，并阻止用户对遮罩下层的内容进行操作，一般用于弹窗场景
 	 * @tutorial https://www.uviewui.com/components/mask.html
 	 * @property {Boolean} show 是否显示遮罩（默认false）

--- a/uview/components/u-message-input/u-message-input.vue
+++ b/uview/components/u-message-input/u-message-input.vue
@@ -34,7 +34,7 @@
 <script>
 	/**
-	 * alertTips 提示
+	 * messageInput 验证码输入框
 	 * @description 该组件一般用于验证用户短信验证码的场景，也可以结合uView的键盘组件使用
 	 * @tutorial https://www.uviewui.com/components/messageInput.html
 	 * @property {String Number} maxlength 输入字符个数（默认4）
@@ -47,11 +47,13 @@
 	 * @property {String Number} font-size 字体大小，单位rpx（默认60）
 	 * @property {String} active-color 当前激活输入框的样式（默认#2979ff）
 	 * @property {String} focus 非激活输入框的样式，文字颜色同此值（默认#606266）
+	 * @property {String | Number} width 输入框宽度，单位rpx，高等于宽（默认80）
 	 * @event {Function} change 输入内容发生改变时触发，具体见官网说明
 	 * @event {Function} finish 输入字符个数达maxlength值时触发，见官网说明
 	 * @example <u-message-input mode="bottomLine"></u-message-input>
 	 */
 	export default {
+		name: "u-message-input",
 		props: {
 			// 最大输入长度
 			maxlength: {

--- a/uview/components/u-modal/u-modal.vue
+++ b/uview/components/u-modal/u-modal.vue
+<template>
+	<view>
+		<u-popup :zoom="zoom" mode="center" :z-index="uZIndex" v-model="value" :length="width" :mask-close-able="false" :border-radius="borderRadius">
+			<view class="u-model">
+				<view v-if="showTitle" class="u-model-title u-line-1" :style="[titleStyle]">{{ title }}</view>
+				<view class="u-model-content">
+					<slot>
+						<view class="u-model-content-meeeage" :style="[contentStyle]">{{ content }}</view>
+					</slot>
+				</view>
+				<view class="u-model-footer u-border-top">
+					<view
+						v-if="showCancelButton"
+						:hover-stay-time="100"
+						hover-class="btn-hover"
+						class="u-model-footer-button"
+						type="default"
+						:style="[cancelBtnStyle]"
+						@click="confirm"
+					>
+						{{cancelText}}
+					</view>
+					<view
+						v-if="showConfirmButton"
+						:hover-stay-time="100"
+						hover-class="btn-hover"
+						class="u-model-footer-button hairline-left"
+						:style="[confirmBtnStyle]"
+						@tap="close"
+					>
+						{{confirmText}}
+					</view>
+				</view>
+			</view>
+		</u-popup>
+	</view>
+</template>
+<script>
+/**
+ * modal 模态框
+ * @description 弹出模态框，常用于消息提示、消息确认、在当前页面内完成特定的交互操作
+ * @tutorial https://www.uviewui.com/components/modal.html
+ * @property {Boolean} value 是否显示模态框
+ * @property {String | Number} z-index 层级
+ * @property {String} title 模态框标题（默认"提示"）
+ * @property {String | Number} width 模态框宽度（默认600）
+ * @property {String} content 模态框内容（默认"内容"）
+ * @property {Boolean} show-title 是否显示标题（默认true）
+ * @property {Boolean} show-confirm-button 是否显示确认按钮（默认true）
+ * @property {Boolean} show-cancel-button 是否显示取消按钮（默认false）
+ * @property {String} confirm-text 确认按钮的文字内容（默认"确认"）
+ * @property {String} cancel-text 取消按钮的文字内容（默认"取消"）
+ * @property {String} cancel-color 取消按钮的颜色（默认"#606266"）
+ * @property {String} confirm-color 确认按钮的文字内容（默认"#2979ff"）
+ * @property {String | Number} border-radius 模态框圆角值，单位rpx（默认16）
+ * @property {Object} title-style 自定义标题样式，对象形式
+ * @property {Object} content-style 自定义内容样式，对象形式
+ * @property {Object} cancel-style 自定义取消按钮样式，对象形式
+ * @property {Object} confirm-style 自定义确认按钮样式，对象形式
+ * @property {Boolean} zoom 是否开启缩放模式（默认true）
+ * @event {Function} confirm 确认按钮被点击
+ * @event {Function} cancel 取消按钮被点击
+ * @example <u-modal :src="title" :content="content"></u-modal>
+ */
+export default {
+	props: {
+		name: 'u-modal',
+		// 是否显示Modal
+		value: {
+			type: Boolean,
+			default: false
+		},
+		// 层级z-index
+		zIndex: {
+			type: [Number, String],
+			default: ''
+		},
+		// 标题
+		title: {
+			type: [String],
+			default: '提示'
+		},
+		// 弹窗宽度，可以是数值(rpx)，百分比，auto等
+		width: {
+			type: [Number, String],
+			default: 600
+		},
+		// 弹窗内容
+		content: {
+			type: String,
+			default: '内容'
+		},
+		// 是否显示标题
+		showTitle: {
+			type: Boolean,
+			default: true
+		},
+		// 是否显示确认按钮
+		showConfirmButton: {
+			type: Boolean,
+			default: true
+		},
+		// 是否显示取消按钮
+		showCancelButton: {
+			type: Boolean,
+			default: false
+		},
+		// 确认文案
+		confirmText: {
+			type: String,
+			default: '确认'
+		},
+		// 取消文案
+		cancelText: {
+			type: String,
+			default: '取消'
+		},
+		// 确认按钮颜色
+		confirmColor: {
+			type: String,
+			default: '#2979ff'
+		},
+		// 取消文字颜色
+		cancelColor: {
+			type: String,
+			default: '#606266'
+		},
+		// 圆角值
+		borderRadius: {
+			type: [Number, String],
+			default: 16
+		},
+		// 标题的样式
+		titleStyle: {
+			type: Object,
+			default() {
+				return {}
+			}
+		},
+		// 内容的样式
+		contentStyle: {
+			type: Object,
+			default() {
+				return {}
+			}
+		},
+		// 取消按钮的样式
+		cancelStyle: {
+			type: Object,
+			default() {
+				return {}
+			}
+		},
+		// 确定按钮的样式
+		confirmStyle: {
+			type: Object,
+			default() {
+				return {}
+			}
+		},
+		// 是否开启缩放效果
+		zoom: {
+			type: Boolean,
+			default: true
+		}
+	},
+	computed: {
+		cancelBtnStyle() {
+			return Object.assign({color: this.cancelColor}, this.cancelStyle);
+		},
+		confirmBtnStyle() {
+			return Object.assign({color: this.confirmColor}, this.confirmStyle);
+		},
+		uZIndex() {
+			return this.zIndex ? this.zIndex : this.$u.zIndex.popup;
+		}
+	},
+	methods: {
+		confirm() {
+			this.$emit('confirm');
+			this.$emit('input', false);
+		},
+		close() {
+			this.$emit('cancel');
+			this.$emit('input', false);
+		}
+	}
+};
+</script>
+<style lang="scss" scoped>
+.u-mask {
+	position: fixed;
+	top: 0;
+	left: 0;
+	right: 0;
+	bottom: 0;
+	opacity: 0;
+	visibility: hidden;
+}
+.btn-hover {
+	background-color: rgb(230, 230, 230);
+}
+.u-mask-show {
+	opacity: 1;
+	visibility: visible;
+}
+.u-model {
+	height: auto;
+	overflow: hidden;
+	font-size: 32rpx;
+	background-color: #fff;
+	&-title {
+		padding-top: 48rpx;
+		font-weight: 500;
+		text-align: center;
+		color: $u-main-color;
+	}
+	&-content {
+		&-meeeage {
+			padding: 48rpx;
+			font-size: 30rpx;
+			text-align: center;
+			color: $u-content-color;
+		}
+	}
+	&-footer {
+		display: flex;
+		&-button {
+			flex: 1;
+			height: 100rpx;
+			line-height: 100rpx;
+			font-size: 32rpx;
+			box-sizing: border-box;
+			cursor: pointer;
+			text-align: center;
+			border-radius: 4rpx;
+		}
+	}
+}
+</style>
--- a/uview/components/u-navbar/u-navbar.vue
+++ b/uview/components/u-navbar/u-navbar.vue
@@ -27,8 +27,15 @@
 </template>
 <script>
+// 获取系统状态栏的高度
+let systemInfo = uni.getSystemInfoSync();
+let menuButtonInfo = {};
+// 如果是小程序，获取右上角胶囊的尺寸信息，避免导航栏右侧内容与胶囊重叠(支付宝小程序非本API，尚未兼容)
+// #ifdef MP
+menuButtonInfo = uni.getMenuButtonBoundingClientRect();
+// #endif
 /**
- * alertTips 提示
+ * navbar 自定义导航栏
 * @description 此组件一般用于在特殊情况下，需要自定义导航栏的时候用到，一般建议使用uniapp自带的导航栏。
 * @tutorial https://www.uviewui.com/components/navbar.html
 * @property {String Number} height 导航栏高度(不包括状态栏高度在内，内部自动加上)，注意这里的单位是px（默认44）
@@ -48,15 +55,8 @@
 * @property {Boolean} border-bottom 导航栏底部是否显示下边框，如定义了较深的背景颜色，可取消此值（默认true）
 * @example <u-navbar back-text="返回" title="剑未配妥，出门已是江湖"></u-navbar> 
 */
-// 获取系统状态栏的高度
-let systemInfo = uni.getSystemInfoSync();
-let menuButtonInfo = {};
-// 如果是小程序，获取右上角胶囊的尺寸信息，避免导航栏右侧内容与胶囊重叠(支付宝小程序非本API，尚未兼容)
-// #ifdef MP
-menuButtonInfo = uni.getMenuButtonBoundingClientRect();
-// #endif
 export default {
+	name: "u-navbar",
 	props: {
 		// 导航栏高度，单位px，非rpx
 		height: {

--- a/uview/components/u-no-network/u-no-network.vue
+++ b/uview/components/u-no-network/u-no-network.vue
@@ -20,7 +20,7 @@
 <script>
 	/**
-	 * alertTips 提示
+	 * noNetwork 无网络提示
 	 * @description 该组件无需任何配置，引入即可，内部自动处理所有功能和事件。
 	 * @tutorial https://www.uviewui.com/components/noNetwork.html
 	 * @property {String} tips 没有网络时的提示语（默认哎呀，网络信号丢失）

--- a/uview/components/u-notice-bar/u-notice-bar.vue
+++ b/uview/components/u-notice-bar/u-notice-bar.vue
@@ -46,7 +46,7 @@
 </template>
 <script>
 /**
- * alertTips 提示
+ * noticeBar 滚动通知
 * @description 该组件用于滚动通告场景，有多种模式可供选择
 * @tutorial https://www.uviewui.com/components/noticeBar.html
 * @property {Array} list 滚动内容，数组形式，见上方说明
@@ -64,7 +64,10 @@
 * @property {String Number} speed 水平滚动时的滚动速度，即每秒移动多少距离，只对水平衔接方式有效，单位rpx（默认160）
 * @property {String Number} font-size 字体大小，单位rpx（默认28）
 * @property {Boolean} is-circular mode为horizontal时，指明是否水平衔接滚动（默认true）
- * @property {String} play-state 播放状态，paly - 播放，paused - 暂停（默认paly）
+ * @property {String} play-state 播放状态，play - 播放，paused - 暂停（默认play）
+ * @property {String Nubmer} border-radius 通知栏圆角（默认为0）
+ * @property {String Nubmer} padding 内边距，字符串，与普通的内边距css写法一直（默认"18rpx 24rpx"）
+ * @property {Boolean} no-list-hidden 列表为空时，是否显示组件（默认false）
 * @property {Boolean} disable-touch 是否禁止通过手动滑动切换通知，只有mode = vertical，或者mode = horizontal且is-circular = false时有效（默认true）
 * @event {Function} click 点击通告文字触发，只有mode = vertical，或者mode = horizontal且is-circular = false时有效
 * @event {Function} close 点击右侧关闭图标触发
@@ -73,6 +76,7 @@
 * @example <u-notice-bar :more-icon="true" :list="list"></u-notice-bar>
 */
 export default {
+	name: "u-notice-bar",
 	props: {
 		// 显示的内容，数组
 		list: {

--- a/uview/components/u-number-box/u-number-box.vue
+++ b/uview/components/u-number-box/u-number-box.vue
@@ -27,7 +27,7 @@
 <script>
 	/**
-	 * alertTips 提示
+	 * numberBox 步进器
 	 * @description 该组件一般用于商城购物选择物品数量的场景。注意：该输入框只能输入大于或等于0的整数，不支持小数输入
 	 * @tutorial https://www.uviewui.com/components/numberBox.html
 	 * @property {Number} value 输入框初始值（默认1）

--- a/uview/components/u-picker/u-picker.vue
+++ b/uview/components/u-picker/u-picker.vue
@@ -70,8 +70,12 @@
 </template>
 <script>
+	import provinces from '@/uview/libs/util/province.js';
+	import citys from '@/uview/libs/util/city.js';
+	import areas from '@/uview/libs/util/area.js';
 	/**
-	 * alertTips 提示
+	 * picker picker弹出选择器
 	 * @description 此选择器有两种弹出模式：一是时间模式，可以配置年，日，月，时，分，秒参数 二是地区模式，可以配置省，市，区参数
 	 * @tutorial https://www.uviewui.com/components/picker.html
 	 * @property {Object} params 需要显示的参数，见官网说明
@@ -90,10 +94,6 @@
 	 * @event {Function} cancel 点击取消按钮，返回当前选择的值
 	 * @example <u-picker v-model="show" mode="time"></u-picker>
 	 */
-	import provinces from '@/uview/libs/util/province.js';
-	import citys from '@/uview/libs/util/city.js';
-	import areas from '@/uview/libs/util/area.js';
 	export default {
 		name: "u-picker",
 		props: {

--- a/uview/components/u-popup/u-popup.vue
+++ b/uview/components/u-popup/u-popup.vue
@@ -20,7 +20,7 @@
 <script>
 	/**
-	 * alertTips 提示
+	 * popup 弹窗
 	 * @description 弹出层容器，用于展示弹窗、信息提示等内容，支持上、下、左、右和中部弹出。组件只提供容器，内部内容由用户自定义
 	 * @tutorial https://www.uviewui.com/components/popup.html
 	 * @property {String} mode 弹出方向（默认left）

--- a/uview/components/u-radio-group/u-radio-group.vue
+++ b/uview/components/u-radio-group/u-radio-group.vue
@@ -6,8 +6,8 @@
 <script>
 	/**
-	 * alertTips 提示
+	 * radioRroup 单选框父组件
-	 * @description 单选框用于有一个选择，用户只能选择其中一个的场景。搭配<u-radio>使用
+	 * @description 单选框用于有一个选择，用户只能选择其中一个的场景。搭配u-radio使用
 	 * @tutorial https://www.uviewui.com/components/radio.html
 	 * @property {Boolean} disabled 是否禁用所有radio（默认false）
 	 * @property {String} active-color 选中时的颜色，应用到所有子Radio组件（默认#2979ff）

--- a/uview/components/u-radio/u-radio.vue
+++ b/uview/components/u-radio/u-radio.vue
@@ -11,8 +11,8 @@
 <script>
 	/**
-	 * alertTips 提示
+	 * radio 单选框
-	 * @description 单选框用于有一个选择，用户只能选择其中一个的场景。搭配<u-radio-group>使用
+	 * @description 单选框用于有一个选择，用户只能选择其中一个的场景。搭配u-radio-group使用
 	 * @tutorial https://www.uviewui.com/components/radio.html
 	 * @property {String Number} icon-size 图标大小，单位rpx（默认24）
 	 * @property {String Number} size 组件整体的大小，单位rpx（默认40）

--- a/uview/components/u-rate/u-rate.vue
+++ b/uview/components/u-rate/u-rate.vue
@@ -12,7 +12,7 @@
 <script>
 	/**
-	 * alertTips 提示
+	 * rate 评分
 	 * @description 该组件一般用于满意度调查，星型评分的场景
 	 * @tutorial https://www.uviewui.com/components/rate.html
 	 * @property {String Number} count 最多可选的星星数量（默认5）

--- a/uview/components/u-read-more/u-read-more.vue
+++ b/uview/components/u-read-more/u-read-more.vue
@@ -17,7 +17,7 @@
 <script>
 	/**
-	 * alertTips 提示
+	 * readMore 阅读更多
 	 * @description 该组件一般用于内容较长，预先收起一部分，点击展开全部内容的场景。
 	 * @tutorial https://www.uviewui.com/components/readMore.html
 	 * @property {String Number} show-height 内容超出此高度才会显示展开全文按钮，单位rpx（默认400）

--- a/uview/components/u-row/u-row.vue
+++ b/uview/components/u-row/u-row.vue
@@ -10,7 +10,17 @@
 </template>
 <script>
+	/**
+	 * row 行布局
+	 * @description 通过基础的 12 分栏，迅速简便地创建布局。
+	 * @tutorial https://www.uviewui.com/components/layout.html#row-props
+	 * @property {String Number} gutter 栅格间隔，左右各为此值的一半，单位rpx（默认0）
+	 * @property {String} justify 水平排列方式(微信小程序暂不支持)默认（start(或flex-start)）
+	 * @property {String} align 垂直排列方式（默认center）
+	 * @example <u-row gutter="16"></u-row>
+	 */
 	export default {
+		name: "u-row",
 		props: {
 			// 给col添加间距，左右边距各占一半
 			gutter: {
@@ -35,13 +45,13 @@
 		},
 		computed: {
 			uJustify() {
-				if(this.justify == 'end' || this.justify == 'start') return 'flex-' + this.justify;
+				if (this.justify == 'end' || this.justify == 'start') return 'flex-' + this.justify;
-				else if(this.justify == 'around' || this.justify == 'between') return 'space-' + this.justify;
+				else if (this.justify == 'around' || this.justify == 'between') return 'space-' + this.justify;
 				else return this.justify;
 			},
 			uAlignItem() {
-				if(this.align == 'top') return 'flex-start';
+				if (this.align == 'top') return 'flex-start';
-				if(this.align == 'bottom') return 'flex-end';
+				if (this.align == 'bottom') return 'flex-end';
 				else return this.align;
 			}
 		}
@@ -55,7 +65,7 @@
 		display: flex;
 		/* #endif */
 	}
 	.u-row:after {
 		/* #ifdef MP-WEIXIN */
 		display: table;

--- a/uview/components/u-search/u-search.vue
+++ b/uview/components/u-search/u-search.vue
@@ -37,7 +37,7 @@
 <script>
 /**
- * alertTips 提示
+ * search 搜索框
 * @description 搜索组件，集成了常见搜索框所需功能，用户可以一键引入，开箱即用。
 * @tutorial https://www.uviewui.com/components/search.html
 * @property {String} shape 搜索框形状，round-圆形，square-方形（默认round）
@@ -60,6 +60,7 @@
 * @example <u-search placeholder="日照香炉生紫烟" v-model="keyword"></u-search>
 */
 export default {
+	name: "u-search",
 	props: {
 		// 搜索框形状，round-圆形，square-方形
 		shape: {

--- a/uview/components/u-section/u-section.vue
+++ b/uview/components/u-section/u-section.vue
@@ -20,7 +20,7 @@
 <script>
 	/**
-	 * alertTips 提示
+	 * section 查看更多
 	 * @description 该组件一般用于分类信息有很多，但是限于篇幅只能列出一部分，让用户通过"查看更多"获得更多信息的场景，实际效果见演示。
 	 * @tutorial https://www.uviewui.com/components/section.html
 	 * @property {String} title 左边主标题
@@ -33,6 +33,7 @@
 	 * @example <u-section title="今日热门" :right="false"></u-section>
 	 */
 	export default {
+		name: "u-section",
 		props: {
 			// 标题信息
 			title: {

--- a/uview/components/u-skeleton/u-skeleton.vue
+++ b/uview/components/u-skeleton/u-skeleton.vue
@@ -40,16 +40,16 @@
 </template>
 <script>
 	/**
-	 * alertTips 提示
+	 * skeleton 骨架屏
 	 * @description 骨架屏一般用于页面在请求远程数据尚未完成时，页面用灰色块预显示本来的页面结构，给用户更好的体验。
 	 * @tutorial https://www.uviewui.com/components/skeleton.html
 	 * @property {String} el-color 骨架块状元素的背景颜色（默认#e5e5e5）
 	 * @property {String} bg-color 骨架组件背景颜色（默认#ffffff）
 	 * @property {Boolean} animation 骨架块是否显示动画效果（默认false）
 	 * @property {String Number} border-radius u-skeleton-fillet类名元素，对应的骨架块的圆角大小，单位rpx（默认10）
 	 * @property {Boolean} loading 是否显示骨架组件，请求完成后，将此值设置为false（默认true）
 	 * @example <u-skeleton :loading="true" :animation="true"></u-skeleton>
 	 */
 	export default {
 		name: "u-skeleton",

--- a/uview/components/u-steps/u-steps.vue
+++ b/uview/components/u-steps/u-steps.vue
@@ -15,7 +15,20 @@
 </template>
 <script>
+	/**
+	 * steps 步骤条
+	 * @description 该组件一般用于完成一个任务要分几个步骤，标识目前处于第几步的场景。
+	 * @tutorial https://www.uviewui.com/components/steps.html
+	 * @property {String} mode 设置模式（默认dot）
+	 * @property {Array} list 数轴条数据，数组。具体见上方示例
+	 * @property {String} type type主题（默认primary）
+	 * @property {Number String} current 设置当前处于第几步
+	 * @property {String} active-color 已完成步骤的激活颜色，如设置，type值会失效
+	 * @property {String} un-active-color 未激活的颜色，用于表示未完成步骤的颜色（默认#606266）
+	 * @example <u-steps :list="numList" active-color="#fa3534"></u-steps>
+	 */
 	export default {
+		name: "u-steps",
 		props: {
 			// 步骤条的类型，dot|number
 			mode: {

--- a/uview/components/u-sticky/u-sticky.vue
+++ b/uview/components/u-sticky/u-sticky.vue
@@ -18,7 +18,21 @@
 </template>
 <script>
+	/**
+	 * sticky 吸顶
+	 * @description 该组件与CSS中position: sticky属性实现的效果一致，当组件达到预设的到顶部距离时， 就会固定在指定位置，组件位置大于预设的顶部距离时，会重新按照正常的布局排列。
+	 * @tutorial https://www.uviewui.com/components/sticky.html
+	 * @property {String Number} offset-top 吸顶时与顶部的距离，单位rpx（默认0）
+	 * @property {String Number} index 自定义标识，用于区分是哪一个组件
+	 * @property {Boolean} enable 是否开启吸顶功能（默认true）
+	 * @property {String} bg-color 组件背景颜色（默认#ffffff）
+	 * @property {String Number} z-index 吸顶时的z-index值（默认970）
+	 * @property {String Number} h5-nav-height 导航栏高度，自定义导航栏时(无导航栏时需设置为0)，需要传入此值，单位px（默认44）
+	 * @event {Function} fixed 组件吸顶时触发
+	 * @example <u-sticky offset-top="200"><view>塞下秋来风景异，衡阳雁去无留意</view></u-sticky>
+	 */
 	export default {
+		name: "u-sticky",
 		props: {
 			// 吸顶容器到顶部某个距离的时候，进行吸顶，在H5平台，NavigationBar为44px
 			offsetTop: {
@@ -66,7 +80,7 @@
 				this.initObserver();
 			},
 			enable(val) {
-				if(val == false) {
+				if (val == false) {
 					this.fixed = false;
 					this.disconnectObserver('contentObserver');
 				} else {
@@ -84,14 +98,14 @@
 		},
 		methods: {
 			initObserver() {
-				if(!this.enable) return ;
+				if (!this.enable) return;
 				// #ifdef H5
 				this.stickyTop = this.offsetTop != 0 ? uni.upx2px(this.offsetTop) + this.h5NavHeight : this.h5NavHeight;
 				// #endif
 				// #ifndef H5
 				this.stickyTop = this.offsetTop != 0 ? uni.upx2px(this.offsetTop) : 0;
 				// #endif
 				this.disconnectObserver('contentObserver');
 				this.$uGetRect('.' + this.elClass).then((res) => {
 					this.height = res.height;
@@ -111,7 +125,7 @@
 					top: -this.stickyTop
 				});
 				contentObserver.observe('.' + this.elClass, res => {
-					if (!this.enable) return ;
+					if (!this.enable) return;
 					this.setFixed(res.boundingClientRect.top);
 				});
 				this.contentObserver = contentObserver;
@@ -119,7 +133,7 @@
 			setFixed(top) {
 				const fixed = top < this.stickyTop;
 				this.fixed = fixed;
-				if(fixed) this.$emit('fixed', this.index);
+				if (fixed) this.$emit('fixed', this.index);
 			},
 			disconnectObserver(observerName) {
 				const observer = this[observerName];
@@ -133,4 +147,4 @@
 	.u-sticky {
 		z-index: 9999999999;
 	}
 </style>
\ No newline at end of file
--- a/uview/components/u-subsection/u-subsection.vue
+++ b/uview/components/u-subsection/u-subsection.vue
 <template>
 	<view class="u-subsection" :style="[subsectionStyle]">
-		<view
+		<view class="u-item u-line-1" :style="[itemStyle(index)]" @tap="click(index)" :class="[noBorderRight(index), 'u-item-' + index]"
-			class="u-item u-line-1"
+		 v-for="(item, index) in listInfo" :key="index">
-			:style="[itemStyle(index)]"
-			@tap="click(index)"
-			:class="[noBorderRight(index), 'u-item-' + index]"
-			v-for="(item, index) in listInfo"
-			:key="index"
-		>
 			<view :style="[textStyle(index)]" class="u-item-text u-line-1">{{ item.name }}</view>
 		</view>
 		<view class="u-item-bg" :style="[itemBarStyle]"></view>
@@ -15,322 +9,340 @@
 </template>
 <script>
-export default {
+	/**
-	props: {
+	 * subsection 分段器
-		// tab的数据
+	 * @description 该分段器一般用于用户从几个选项中选择某一个的场景
-		list: {
+	 * @tutorial https://www.uviewui.com/components/subsection.html
-			type: Array,
+	 * @property {Array} list 选项的数组，形式见上方"基本使用"
-			default() {
+	 * @property {String Number} current 初始化时默认选中的选项索引值（默认0）
-				return [];
+	 * @property {String} active-color 激活时的颜色，mode为subsection时固定为白色（默认#ff9900）
+	 * @property {String} inactive-color 未激活时字体的颜色，mode为subsection时无效（默认#303133）
+	 * @property {String} mode 模式选择，见官网"模式选择"说明（默认button）
+	 * @property {String Number} font-size 字体大小，单位rpx（默认28）
+	 * @property {Boolean} animation 是否开启动画效果，见上方说明（默认true）
+	 * @property {Boolean} bold 激活选项的字体是否加粗（默认true）
+	 * @property {String} bg-color 组件背景颜色，mode为button时有效（默认#eeeeef）
+	 * @property {String} button-color 按钮背景颜色，mode为button时有效（默认#ffffff）
+	 * @event {Function} change 分段器选项发生改变时触发
+	 * @example <u-subsection active-color="#ff9900"></u-subsection>
+	 */
+	export default {
+		name: "u-subsection",
+		props: {
+			// tab的数据
+			list: {
+				type: Array,
+				default () {
+					return [];
+				}
+			},
+			// 当前活动的tab的index
+			current: {
+				type: [Number, String],
+				default: 0
+			},
+			// 激活的颜色
+			activeColor: {
+				type: String,
+				default: '#303133'
+			},
+			// 模式选择，mode=button为按钮形式，mode=subsection时为分段模式
+			mode: {
+				type: String,
+				default: 'button'
+			},
+			// 字体大小，单位rpx
+			fontSize: {
+				type: [Number, String],
+				default: 28
+			},
+			// 是否开启动画效果
+			animation: {
+				type: Boolean,
+				default: true
+			},
+			// 组件的高度，单位rpx
+			height: {
+				type: [Number, String],
+				default: 70
+			},
+			// 激活tab的字体是否加粗
+			bold: {
+				type: Boolean,
+				default: true
+			},
+			// mode=button时，组件背景颜色
+			bgColor: {
+				type: String,
+				default: '#eeeeef'
+			},
+			// mode = button时，滑块背景颜色
+			buttonColor: {
+				type: String,
+				default: '#ffffff'
+			},
+			// 在切换分段器的时候，是否让设备震一下
+			vibrateShort: {
+				type: Boolean,
+				default: false
 			}
 		},
-		// 当前活动的tab的index
+		data() {
-		current: {
+			return {
-			type: [Number, String],
+				listInfo: [],
-			default: 0
+				itemBgStyle: {
-		},
+					width: 0,
-		// 激活的颜色
+					left: 0,
-		activeColor: {
+					backgroundColor: '#ffffff',
-			type: String,
+					height: '100%',
-			default: '#303133'
+					transition: ''
-		},
+				},
-		// 模式选择，mode=button为按钮形式，mode=subsection时为分段模式
+				currentIndex: this.current,
-		mode: {
+				buttonPadding: 3, // mode = button 时，组件的内边距
-			type: String,
+				borderRadius: 5, // 圆角值
-			default: 'button'
+				firstTimeVibrateShort: true // 组件初始化时，会触发current变化，此时不应震动
-		},
+			};
-		// 字体大小，单位rpx
-		fontSize: {
-			type: [Number, String],
-			default: 28
-		},
-		// 是否开启动画效果
-		animation: {
-			type: Boolean,
-			default: true
-		},
-		// 组件的高度，单位rpx
-		height: {
-			type: [Number, String],
-			default: 70
-		},
-		// 激活tab的字体是否加粗
-		bold: {
-			type: Boolean,
-			default: true
 		},
-		// mode=button时，组件背景颜色
+		watch: {
-		bgColor: {
+			current: {
-			type: String,
+				immediate: true,
-			default: '#eeeeef'
+				handler(nVal) {
+					this.currentIndex = nVal;
+					this.changeSectionStatus(nVal);
+				}
+			}
 		},
-		// mode = button时，滑块背景颜色
+		created() {
-		buttonColor: {
+			// 将list的数据，传入listInfo数组，因为不能修改props传递的list值
-			type: String,
+			// 可以接受直接数组形式，或者数组元素为对象的形式，如：['简介', '评论'],或者[{name: '简介'}, {name: '评论'}]
-			default: '#ffffff'
+			this.listInfo = this.list.map((val, index) => {
+				if (typeof val != 'object') {
+					let obj = {
+						width: 0,
+						name: val
+					};
+					return obj;
+				} else {
+					val.width = 0;
+					return val;
+				}
+			});
 		},
-		// 在切换分段器的时候，是否让设备震一下
+		computed: {
-		vibrateShort: {
+			// 设置mode=subsection时，滑块特有的样式
-			type: Boolean,
+			noBorderRight() {
-			default: false
+				return index => {
-		}
+					if (this.mode != 'subsection') return;
-	},
+					let classs = '';
-	data() {
+					// 不显示右边的边框
-		return {
+					if (index < this.list.length - 1) classs += ' u-none-border-right';
-			listInfo: [],
+					// 显示整个组件的左右边圆角
-			itemBgStyle: {
+					if (index == 0) classs += ' u-item-first';
-				width: 0,
+					if (index == this.list.length - 1) classs += ' u-item-last';
-				left: 0,
+					return classs;
-				backgroundColor: '#ffffff',
-				height: '100%',
-				transition: ''
-			},
-			currentIndex: this.current,
-			buttonPadding: 3, // mode = button 时，组件的内边距
-			borderRadius: 5, // 圆角值
-			firstTimeVibrateShort: true // 组件初始化时，会触发current变化，此时不应震动
-		};
-	},
-	watch: {
-		current: {
-			immediate: true,
-			handler(nVal) {
-				this.currentIndex = nVal;
-				this.changeSectionStatus(nVal);
-			}
-		}
-	},
-	created() {
-		// 将list的数据，传入listInfo数组，因为不能修改props传递的list值
-		// 可以接受直接数组形式，或者数组元素为对象的形式，如：['简介', '评论'],或者[{name: '简介'}, {name: '评论'}]
-		this.listInfo = this.list.map((val, index) => {
-			if (typeof val != 'object') {
-				let obj = {
-					width: 0,
-					name: val
 				};
-				return obj;
+			},
-			} else {
+			// 文字的样式
-				val.width = 0;
+			textStyle() {
-				return val;
+				return index => {
-			}
+					let style = {};
-		});
+					// 设置字体颜色
-	},
+					if (this.mode == 'subsection') {
-	computed: {
+						if (index == this.currentIndex) {
-		// 设置mode=subsection时，滑块特有的样式
+							style.color = '#ffffff';
-		noBorderRight() {
+						} else {
-			return index => {
+							style.color = this.activeColor;
-				if (this.mode != 'subsection') return;
+						}
-				let classs = '';
-				// 不显示右边的边框
-				if (index < this.list.length - 1) classs += ' u-none-border-right';
-				// 显示整个组件的左右边圆角
-				if (index == 0) classs += ' u-item-first';
-				if (index == this.list.length - 1) classs += ' u-item-last';
-				return classs;
-			};
-		},
-		// 文字的样式
-		textStyle() {
-			return index => {
-				let style = {};
-				// 设置字体颜色
-				if (this.mode == 'subsection') {
-					if (index == this.currentIndex) {
-						style.color = '#ffffff';
 					} else {
-						style.color = this.activeColor;
+						if (index == this.currentIndex) {
+							style.color = this.activeColor;
+						} else {
+							style.color = this.inactiveColor;
+						}
 					}
-				} else {
+					// 字体加粗
-					if (index == this.currentIndex) {
+					if (index == this.currentIndex && this.bold) style.fontWeight = 'bold';
-						style.color = this.activeColor;
+					// 文字大小
-					} else {
+					style.fontSize = this.fontSize + 'rpx';
-						style.color = this.inactiveColor;
+					return style;
+				};
+			},
+			// 每个分段器item的样式
+			itemStyle() {
+				return index => {
+					let style = {};
+					if (this.mode == 'subsection') {
+						// 设置border的样式
+						style.borderColor = this.activeColor;
+						style.borderWidth = '1px';
+						style.borderStyle = 'solid';
 					}
+					return style;
+				};
+			},
+			// mode=button时，外层view的样式
+			subsectionStyle() {
+				let style = {};
+				style.height = uni.upx2px(this.height) + 'px';
+				if (this.mode == 'button') {
+					style.backgroundColor = this.bgColor;
+					style.padding = `${this.buttonPadding}px`;
+					style.borderRadius = `${this.borderRadius}px`;
 				}
-				// 字体加粗
-				if (index == this.currentIndex && this.bold) style.fontWeight = 'bold';
-				// 文字大小
-				style.fontSize = this.fontSize + 'rpx';
 				return style;
-			};
+			},
-		},
+			// 滑块的样式
-		// 每个分段器item的样式
+			itemBarStyle() {
-		itemStyle() {
-			return index => {
 				let style = {};
-				if (this.mode == 'subsection') {
+				style.backgroundColor = this.activeColor;
-					// 设置border的样式
+				style.zIndex = 1;
-					style.borderColor = this.activeColor;
+				if (this.mode == 'button') {
-					style.borderWidth = '1px';
+					style.backgroundColor = this.buttonColor;
-					style.borderStyle = 'solid';
+					style.borderRadius = `${this.borderRadius}px`;
+					style.bottom = `${this.buttonPadding}px`;
+					style.height = uni.upx2px(this.height) - this.buttonPadding * 2 + 'px';
+					style.zIndex = 0;
 				}
-				return style;
+				return Object.assign(this.itemBgStyle, style);
-			};
-		},
-		// mode=button时，外层view的样式
-		subsectionStyle() {
-			let style = {};
-			style.height = uni.upx2px(this.height) + 'px';
-			if (this.mode == 'button') {
-				style.backgroundColor = this.bgColor;
-				style.padding = `${this.buttonPadding}px`;
-				style.borderRadius = `${this.borderRadius}px`;
 			}
-			return style;
 		},
-		// 滑块的样式
+		mounted() {
-		itemBarStyle() {
-			let style = {};
-			style.backgroundColor = this.activeColor;
-			style.zIndex = 1;
-			if (this.mode == 'button') {
-				style.backgroundColor = this.buttonColor;
-				style.borderRadius = `${this.borderRadius}px`;
-				style.bottom = `${this.buttonPadding}px`;
-				style.height = uni.upx2px(this.height) - this.buttonPadding * 2 + 'px';
-				style.zIndex = 0;
-			}
-			return Object.assign(this.itemBgStyle, style);
-		}
-	},
-	mounted() {
-		setTimeout(() => {
-			this.getTabsInfo();
-		}, 10);
-	},
-	methods: {
-		// 改变滑块的样式
-		changeSectionStatus(nVal) {
-			if (this.mode == 'subsection') {
-				// 根据滑块在最左边和最右边时，显示左边和右边的圆角
-				if (nVal == this.list.length - 1) {
-					this.itemBgStyle.borderRadius = `0 ${this.buttonPadding}px ${this.buttonPadding}px 0`;
-				}
-				if (nVal == 0) {
-					this.itemBgStyle.borderRadius = `${this.buttonPadding}px 0 0 ${this.buttonPadding}px`;
-				}
-				if (nVal > 0 && nVal < this.list.length - 1) {
-					this.itemBgStyle.borderRadius = '0';
-				}
-			}
-			// 更新滑块的位置
 			setTimeout(() => {
-				this.itemBgLeft();
+				this.getTabsInfo();
 			}, 10);
-			if (this.vibrateShort && !this.firstTimeVibrateShort) {
-				// 使手机产生短促震动，微信小程序有效，APP(HX 2.6.8)和H5无效
-				// #ifndef H5
-				uni.vibrateShort();
-				// #endif
-			}
-			// 第一次过后，设置firstTimeVibrateShort为false，让其下一次可以震动(如果允许震动的话)
-			this.firstTimeVibrateShort = false;
 		},
-		click(index) {
+		methods: {
-			// 不允许点击当前激活选项
+			// 改变滑块的样式
-			if (index == this.currentIndex) return;
+			changeSectionStatus(nVal) {
-			this.currentIndex = index;
+				if (this.mode == 'subsection') {
-			this.changeSectionStatus(index);
+					// 根据滑块在最左边和最右边时，显示左边和右边的圆角
-			this.$emit('change', Number(index));
+					if (nVal == this.list.length - 1) {
-		},
+						this.itemBgStyle.borderRadius = `0 ${this.buttonPadding}px ${this.buttonPadding}px 0`;
-		// 获取各个tab的节点信息
+					}
-		getTabsInfo() {
+					if (nVal == 0) {
-			let view = uni.createSelectorQuery().in(this);
+						this.itemBgStyle.borderRadius = `${this.buttonPadding}px 0 0 ${this.buttonPadding}px`;
-			for (let i = 0; i < this.list.length; i++) {
+					}
-				view.select('.u-item-' + i).boundingClientRect();
+					if (nVal > 0 && nVal < this.list.length - 1) {
-			}
+						this.itemBgStyle.borderRadius = '0';
-			view.exec(res => {
+					}
-				if (!res.length) {
+				}
-					setTimeout(() => {
+				// 更新滑块的位置
-						this.getTabsInfo();
+				setTimeout(() => {
-						return;
+					this.itemBgLeft();
-					}, 10);
+				}, 10);
+				if (this.vibrateShort && !this.firstTimeVibrateShort) {
+					// 使手机产生短促震动，微信小程序有效，APP(HX 2.6.8)和H5无效
+					// #ifndef H5
+					uni.vibrateShort();
+					// #endif
 				}
-				// 将分段器每个item的宽度，放入listInfo数组
+				// 第一次过后，设置firstTimeVibrateShort为false，让其下一次可以震动(如果允许震动的话)
-				res.map((val, index) => {
+				this.firstTimeVibrateShort = false;
-					this.listInfo[index].width = val.width;
+			},
+			click(index) {
+				// 不允许点击当前激活选项
+				if (index == this.currentIndex) return;
+				this.currentIndex = index;
+				this.changeSectionStatus(index);
+				this.$emit('change', Number(index));
+			},
+			// 获取各个tab的节点信息
+			getTabsInfo() {
+				let view = uni.createSelectorQuery().in(this);
+				for (let i = 0; i < this.list.length; i++) {
+					view.select('.u-item-' + i).boundingClientRect();
+				}
+				view.exec(res => {
+					if (!res.length) {
+						setTimeout(() => {
+							this.getTabsInfo();
+							return;
+						}, 10);
+					}
+					// 将分段器每个item的宽度，放入listInfo数组
+					res.map((val, index) => {
+						this.listInfo[index].width = val.width;
+					});
+					// 初始化滑块的宽度
+					if (this.mode == 'subsection') {
+						this.itemBgStyle.width = this.listInfo[0].width + 'px';
+					} else if (this.mode == 'button') {
+						this.itemBgStyle.width = this.listInfo[0].width + 'px';
+					}
+					// 初始化滑块的位置
+					this.itemBgLeft();
 				});
-				// 初始化滑块的宽度
+			},
+			itemBgLeft() {
+				// 根据是否开启动画效果，
+				if (this.animation) {
+					this.itemBgStyle.transition = 'all 0.35s';
+				} else {
+					this.itemBgStyle.transition = 'all 0s';
+				}
+				let left = 0;
+				// 计算当前活跃item到组件左边的距离
+				this.listInfo.map((val, index) => {
+					if (index < this.currentIndex) left += val.width;
+				});
+				// 根据mode不同模式，计算滑块需要移动的距离
 				if (this.mode == 'subsection') {
-					this.itemBgStyle.width = this.listInfo[0].width + 'px';
+					this.itemBgStyle.left = left + 'px';
 				} else if (this.mode == 'button') {
-					this.itemBgStyle.width = this.listInfo[0].width + 'px';
+					this.itemBgStyle.left = left + this.buttonPadding + 'px';
 				}
-				// 初始化滑块的位置
-				this.itemBgLeft();
-			});
-		},
-		itemBgLeft() {
-			// 根据是否开启动画效果，
-			if (this.animation) {
-				this.itemBgStyle.transition = 'all 0.35s';
-			} else {
-				this.itemBgStyle.transition = 'all 0s';
-			}
-			let left = 0;
-			// 计算当前活跃item到组件左边的距离
-			this.listInfo.map((val, index) => {
-				if (index < this.currentIndex) left += val.width;
-			});
-			// 根据mode不同模式，计算滑块需要移动的距离
-			if (this.mode == 'subsection') {
-				this.itemBgStyle.left = left + 'px';
-			} else if (this.mode == 'button') {
-				this.itemBgStyle.left = left + this.buttonPadding + 'px';
 			}
 		}
-	}
+	};
-};
 </script>
 <style lang="scss" scoped>
-.u-subsection {
+	.u-subsection {
-	display: flex;
+		display: flex;
-	align-items: center;
+		align-items: center;
-	overflow: hidden;
+		overflow: hidden;
-	position: relative;
+		position: relative;
-}
+	}
-.u-item {
+	.u-item {
-	flex: 1;
+		flex: 1;
-	text-align: center;
+		text-align: center;
-	font-size: 26rpx;
+		font-size: 26rpx;
-	height: 100%;
+		height: 100%;
-	display: flex;
+		display: flex;
-	align-items: center;
+		align-items: center;
-	justify-content: center;
+		justify-content: center;
-	color: $u-main-color;
+		color: $u-main-color;
-	display: inline-flex;
+		display: inline-flex;
-	padding: 0 6rpx;
+		padding: 0 6rpx;
-}
+	}
-.u-item-bg {
+	.u-item-bg {
-	background-color: $u-type-primary;
+		background-color: $u-type-primary;
-	position: absolute;
+		position: absolute;
-	z-index: -1;
+		z-index: -1;
-}
+	}
-.u-none-border-right {
+	.u-none-border-right {
-	border-right: none !important;
+		border-right: none !important;
-}
+	}
-.u-item-first {
+	.u-item-first {
-	border-top-left-radius: 8rpx;
+		border-top-left-radius: 8rpx;
-	border-bottom-left-radius: 8rpx;
+		border-bottom-left-radius: 8rpx;
-}
+	}
-.u-item-last {
+	.u-item-last {
-	border-top-right-radius: 8rpx;
+		border-top-right-radius: 8rpx;
-	border-bottom-right-radius: 8rpx;
+		border-bottom-right-radius: 8rpx;
-}
+	}
-.u-item-text {
+	.u-item-text {
-	transition: all 0.35s;
+		transition: all 0.35s;
-	color: $u-main-color;
+		color: $u-main-color;
-	display: flex;
+		display: flex;
-	align-items: center;
+		align-items: center;
-	position: relative;
+		position: relative;
-	z-index: 99;
+		z-index: 99;
-}
+	}
 </style>
--- a/uview/components/u-swipe-action/u-swipe-action.vue
+++ b/uview/components/u-swipe-action/u-swipe-action.vue
 <template>
 	<movable-area class="u-swipe-action" :style="{backgroundColor: bgColor}">
-		<movable-view
+		<movable-view class="u-swipe-view" @change="change" @touchend="touchend" @touchstart="touchstart" direction="horizontal"
-			class="u-swipe-view"
+		 :disabled="disabled" :x="moveX" :style="{
-			@change="change"
-			@touchend="touchend"
-			@touchstart="touchstart"
-			direction="horizontal"
-			:disabled="disabled"
-			:x="moveX"
-			:style="{
 				width: movableViewWidth
-			}"
+			}">
-		>
+			<view class="u-swipe-content">
-			<view class="u-swipe-content"><slot></slot></view>
+				<slot></slot>
-			<view
+			</view>
-				class="u-swipe-del"
+			<view class="u-swipe-del" @tap.stop="del" :style="{
-				@tap.stop="del"
-				:style="{
 					width: innerBtnWidth + 'px',
 					backgroundColor: btnBgColor
-				}"
+				}">
-			>
 				<view class="u-btn-text">{{ btnText }}</view>
 			</view>
 		</movable-view>
@@ -28,185 +18,202 @@
 </template>
 <script>
-export default {
+	/**
-	props: {
+	 * swipeAction 左滑单元格
-		// 左边滑动出来按钮的文字
+	 * @description 该组件一般用于左滑唤出操作菜单的场景，用的最多的是左滑删除操作。
-		btnText: {
+	 * @tutorial https://www.uviewui.com/components/swipeAction.html
-			type: String,
+	 * @property {String} btn-text 按钮文字（默认“删除”）
-			default: '删除'
+	 * @property {String} btn-bg-color 按钮背景颜色（默认#ff0033）
-		},
+	 * @property {String} bg-color 整个组件背景颜色（默认#ffffff）
-		// 滑动出来的按钮的背景颜色
+	 * @property {String Number} index 标识符，点击时候用于区分点击了哪一个，用v-for循环时的index即可
-		btnBgColor: {
+	 * @property {String Number} btn-width 按钮宽度，单位rpx（默认180）
-			type: String,
+	 * @property {Boolean} disabled 是否禁止某个swipeAction滑动（默认false）
-			default: '#ff0033'
+	 * @event {Function} click 点击组件时触发
-		},
+	 * @event {Function} close 组件触发关闭状态时
-		// index值，用于得知点击删除的是哪个按钮
+	 * @event {Function} open 组件触发打开状态时
-		index: {
+	 * @example <u-swipe-action btn-text="收藏">...</u-swipe-action> 
-			type: [Number, String],
+	 */
-			default: ''
+	export default {
-		},
+		name: "u-swipe-action",
-		// 滑动按钮的宽度，单位为rpx
+		props: {
-		btnWidth: {
+			// 左边滑动出来按钮的文字
-			type: [String, Number],
+			btnText: {
-			default: 180
+				type: String,
-		},
+				default: '删除'
-		// 是否禁止某个action滑动
+			},
-		disabled: {
+			// 滑动出来的按钮的背景颜色
-			type: Boolean,
+			btnBgColor: {
-			default: false
+				type: String,
-		},
+				default: '#ff0033'
-		// 打开或着关闭组件
+			},
-		show: {
+			// index值，用于得知点击删除的是哪个按钮
-			type: Boolean,
+			index: {
-			default: false
+				type: [Number, String],
-		},
+				default: ''
-		// 组件背景颜色
+			},
-		bgColor: {
+			// 滑动按钮的宽度，单位为rpx
-			type: String,
+			btnWidth: {
-			default: '#ffffff'
+				type: [String, Number],
-		}
+				default: 180
-	},
+			},
-	watch: {
+			// 是否禁止某个action滑动
-		show: {
+			disabled: {
-			immediate: true,
+				type: Boolean,
-			handler(nVal, oVal) {
+				default: false
-				if(nVal) {
+			},
-					this.open();
+			// 打开或着关闭组件
-				} else {
+			show: {
-					this.close();
+				type: Boolean,
-				}
+				default: false
+			},
+			// 组件背景颜色
+			bgColor: {
+				type: String,
+				default: '#ffffff'
 			}
-		}
-	},
-	data() {
-		return {
-			moveX: 0, // movable-view元素在x轴上需要移动的目标移动距离，用于展开或收起滑动的按钮
-			scrollX: 0, // movable-view移动过程中产生的change事件中的x轴移动值
-			status: false, // 滑动的状态，表示当前是展开还是关闭按钮的状态
-			movableAreaWidth: 0, // 滑动区域
-			elId: this.$u.guid(), // id，用于通知另外组件关闭时的识别
-		}
-	},
-	computed: {
-		movableViewWidth() {
-			return this.movableAreaWidth + this.innerBtnWidth + 'px';
-		},
-		innerBtnWidth() {
-			return uni.upx2px(this.btnWidth);
-		},
-	},
-	mounted() {
-		this.getActionRect();
-	},
-	methods: {
-		// 点击删除按钮
-		del() {
-			this.status = false
-			this.moveX = 0
-			this.$emit('click', this.index);
-		},
-		// movable-view元素移动事件
-		change(e) {
-			this.scrollX = e.detail.x;
-		},
-		// 关闭按钮状态
-		close() {
-			this.moveX = 0;
-			this.status = false;
-		},
-		// 打开按钮的状态 
-		open() {
-			if(this.disabled) return ;
-			this.moveX = - this.btnWidth;
-			this.status = true;
 		},
-		// 用户手指离开movable-view元素，停止触摸
+		watch: {
-		touchend() {
+			show: {
-			this.moveX = this.scrollX;
+				immediate: true,
-			// 停止触摸时候，判断当前是展开还是关闭状态
+				handler(nVal, oVal) {
-			// 关闭状态
+					if (nVal) {
-			// 这一步很重要，需要先给this.moveX一个变化的随机值，否则因为前后设置的为同一个值
+						this.open();
-			// props单向数据流的原因，导致movable-view元素不会发生变化，切记，详见文档：
-			// https://uniapp.dcloud.io/use?id=%e5%b8%b8%e8%a7%81%e9%97%ae%e9%a2%98
-			this.$nextTick(function(){
-				if(this.status == false) {
-					// 关闭状态左滑，产生的x轴位移为负值，也就是说滑动的距离大于按钮的三分之一宽度，自动展开按钮
-					if(this.scrollX <= -this.innerBtnWidth / 3) {
-						this.moveX = -this.innerBtnWidth; // 按钮宽度的负值，即为展开状态movable-view元素左滑的距离
-						this.status = true; // 标志当前为展开状态
-						this.emitOpenEvent();
-						// 产生震动效果
-						uni.vibrateShort();
 					} else {
-						this.moveX = 0; // 如果距离没有按钮宽度的三分之一，自动收起
+						this.close();
-						this.status = false;
-						this.emitCloseEvent();
-					}
-				} else {
-					// 如果在打开的状态下，右滑动的距离X轴偏移超过按钮的三分之一(负值反过来的三分之二)，自动收起按钮
-					if(this.scrollX > -this.innerBtnWidth * 2 / 3) {
-						this.moveX = 0;
-						this.$nextTick(() => {
-							this.moveX = 101;
-						})
-						this.status = false;
-						this.emitCloseEvent();
-					} else {
-						this.moveX = -this.innerBtnWidth;
-						this.status = true;
-						this.emitOpenEvent();
 					}
 				}
-			})
+			}
-		},
-		emitOpenEvent() {
-			this.$emit('open', this.index);
 		},
-		emitCloseEvent() {
+		data() {
-			this.$emit('close', this.index);
+			return {
+				moveX: 0, // movable-view元素在x轴上需要移动的目标移动距离，用于展开或收起滑动的按钮
+				scrollX: 0, // movable-view移动过程中产生的change事件中的x轴移动值
+				status: false, // 滑动的状态，表示当前是展开还是关闭按钮的状态
+				movableAreaWidth: 0, // 滑动区域
+				elId: this.$u.guid(), // id，用于通知另外组件关闭时的识别
+			}
 		},
-		// 开始触摸
+		computed: {
-		touchstart() {
+			movableViewWidth() {
+				return this.movableAreaWidth + this.innerBtnWidth + 'px';
+			},
+			innerBtnWidth() {
+				return uni.upx2px(this.btnWidth);
+			},
 		},
-		getActionRect() {
+		mounted() {
-			this.$uGetRect('.u-swipe-action').then(res => {
+			this.getActionRect();
-				this.movableAreaWidth = res.width;
+		},
-			})
+		methods: {
+			// 点击删除按钮
+			del() {
+				this.status = false
+				this.moveX = 0
+				this.$emit('click', this.index);
+			},
+			// movable-view元素移动事件
+			change(e) {
+				this.scrollX = e.detail.x;
+			},
+			// 关闭按钮状态
+			close() {
+				this.moveX = 0;
+				this.status = false;
+			},
+			// 打开按钮的状态 
+			open() {
+				if (this.disabled) return;
+				this.moveX = -this.btnWidth;
+				this.status = true;
+			},
+			// 用户手指离开movable-view元素，停止触摸
+			touchend() {
+				this.moveX = this.scrollX;
+				// 停止触摸时候，判断当前是展开还是关闭状态
+				// 关闭状态
+				// 这一步很重要，需要先给this.moveX一个变化的随机值，否则因为前后设置的为同一个值
+				// props单向数据流的原因，导致movable-view元素不会发生变化，切记，详见文档：
+				// https://uniapp.dcloud.io/use?id=%e5%b8%b8%e8%a7%81%e9%97%ae%e9%a2%98
+				this.$nextTick(function() {
+					if (this.status == false) {
+						// 关闭状态左滑，产生的x轴位移为负值，也就是说滑动的距离大于按钮的三分之一宽度，自动展开按钮
+						if (this.scrollX <= -this.innerBtnWidth / 3) {
+							this.moveX = -this.innerBtnWidth; // 按钮宽度的负值，即为展开状态movable-view元素左滑的距离
+							this.status = true; // 标志当前为展开状态
+							this.emitOpenEvent();
+							// 产生震动效果
+							uni.vibrateShort();
+						} else {
+							this.moveX = 0; // 如果距离没有按钮宽度的三分之一，自动收起
+							this.status = false;
+							this.emitCloseEvent();
+						}
+					} else {
+						// 如果在打开的状态下，右滑动的距离X轴偏移超过按钮的三分之一(负值反过来的三分之二)，自动收起按钮
+						if (this.scrollX > -this.innerBtnWidth * 2 / 3) {
+							this.moveX = 0;
+							this.$nextTick(() => {
+								this.moveX = 101;
+							})
+							this.status = false;
+							this.emitCloseEvent();
+						} else {
+							this.moveX = -this.innerBtnWidth;
+							this.status = true;
+							this.emitOpenEvent();
+						}
+					}
+				})
+			},
+			emitOpenEvent() {
+				this.$emit('open', this.index);
+			},
+			emitCloseEvent() {
+				this.$emit('close', this.index);
+			},
+			// 开始触摸
+			touchstart() {
+			},
+			getActionRect() {
+				this.$uGetRect('.u-swipe-action').then(res => {
+					this.movableAreaWidth = res.width;
+				})
+			}
 		}
 	}
-}
 </script>
 <style scoped lang="scss">
-.u-swipe-action {
+	.u-swipe-action {
-	width: auto;
+		width: auto;
-	height: initial;
+		height: initial;
-	position: relative;
+		position: relative;
-	overflow: hidden;
+		overflow: hidden;
-}
+	}
-.u-swipe-view {
+	.u-swipe-view {
-	display: flex;
+		display: flex;
-	height: initial;
+		height: initial;
-	position: relative; /* 这一句很关键，覆盖默认的绝对定位 */
+		position: relative;
-}
+		/* 这一句很关键，覆盖默认的绝对定位 */
+	}
-.u-swipe-content {
+	.u-swipe-content {
-	flex: 1;
+		flex: 1;
-}
+	}
-.u-swipe-del {
+	.u-swipe-del {
-	position: relative;
+		position: relative;
-	font-size: 30rpx;
+		font-size: 30rpx;
-	color: #ffffff;
+		color: #ffffff;
-}
+	}
-.u-btn-text {
+	.u-btn-text {
-	position: absolute;
+		position: absolute;
-	top: 50%;
+		top: 50%;
-	left: 50%;
+		left: 50%;
-	transform: translate(-50%, -50%);
+		transform: translate(-50%, -50%);
-}
+	}
 </style>
--- a/uview/components/u-swiper/u-swiper.vue
+++ b/uview/components/u-swiper/u-swiper.vue
 <template>
-	<view class="u-swiper-wrap"
+	<view class="u-swiper-wrap" :style="{
-	:style="{
 		borderRadius: `${borderRadius}rpx`,
 	}">
-		<swiper
+		<swiper @change="change" :current="current" :interval="interval" :circular="circular" :duration="duration" :autoplay="autoplay"
-			@change="change"
+		 :previous-margin="effect3d ? effect3dPreviousMargin + 'rpx' : '0'" :next-margin="effect3d ? effect3dPreviousMargin + 'rpx' : '0'"
-			:current="current"
+		 :style="{
-			:interval="interval"
-			:circular="circular"
-			:duration="duration"
-			:autoplay="autoplay"
-			:previous-margin="effect3d ? effect3dPreviousMargin + 'rpx' : '0'"
-			:next-margin="effect3d ? effect3dPreviousMargin + 'rpx' : '0'"
-			:style="{
 				height: height + 'rpx'
-			}"
+			}">
-		>
+			<swiper-item class="u-swiper-item" v-for="(item, index) in list" :key="index" @tap="listClick(index)">
-			<swiper-item
+				<view class="u-list-image-wrap" :class="[current != index ? 'u-list-scale' : '']" :style="{
-				class="u-swiper-item"
-				v-for="(item, index) in list"
-				:key="index"
-				@tap="listClick(index)"
-			>
-				<view
-					class="u-list-image-wrap"
-					:class="[current != index ? 'u-list-scale' : '']"
-					:style="{
 						borderRadius: `${borderRadius}rpx`,
 						transform: effect3d && current != index ? 'scaleY(0.9)' : 'scaleY(1)',
 						margin: effect3d && current != index ? '0 20rpx' : 0
-					}"
+					}">
-				>
 					<image class="u-swiper-image" :src="item[name]" :mode="imgMode"></image>
-					<view v-if="title"
+					<view v-if="title" class="u-swiper-title u-line-1" :style="{
-						class="u-swiper-title u-line-1"
-						:style="{
 							'padding-bottom': titlePaddingBottom
-						}"
+						}">
-					>
 						{{ item.title }}
 					</view>
 				</view>
 			</swiper-item>
 		</swiper>
-		<view
+		<view class="u-swiper-indicator" :style="{
-			class="u-swiper-indicator"
-			:style="{
 				top: indicatorPos == 'topLeft' || indicatorPos == 'topCenter' || indicatorPos == 'topRight' ? '12rpx' : 'auto',
 				bottom: indicatorPos == 'bottomLeft' || indicatorPos == 'bottomCenter' || indicatorPos == 'bottomRight' ? '12rpx' : 'auto',
 				justifyContent: justifyContent,
 				padding: `0 ${effect3d ? '74rpx' : '24rpx'}`
-			}"
+			}">
-		>
 			<block v-if="mode == 'rect'">
-				<view class="u-indicator-item-rect" :class="{ 'u-indicator-item-rect-active': index == current }" v-for="(item, index) in list" :key="index"></view>
+				<view class="u-indicator-item-rect" :class="{ 'u-indicator-item-rect-active': index == current }" v-for="(item, index) in list"
+				 :key="index"></view>
 			</block>
 			<block v-if="mode == 'dot'">
-				<view class="u-indicator-item-dot" :class="{ 'u-indicator-item-dot-active': index == current }" v-for="(item, index) in list" :key="index"></view>
+				<view class="u-indicator-item-dot" :class="{ 'u-indicator-item-dot-active': index == current }" v-for="(item, index) in list"
+				 :key="index"></view>
 			</block>
 			<block v-if="mode == 'round'">
-				<view class="u-indicator-item-round" :class="{ 'u-indicator-item-round-active': index == current }" v-for="(item, index) in list" :key="index"></view>
+				<view class="u-indicator-item-round" :class="{ 'u-indicator-item-round-active': index == current }" v-for="(item, index) in list"
+				 :key="index"></view>
 			</block>
 			<block v-if="mode == 'number'">
 				<view class="u-indicator-item-number">{{ current + 1 }}/{{ list.length }}</view>
@@ -69,223 +48,244 @@
 </template>
 <script>
-export default {
+	/**
-	props: {
+	 * swiper 轮播图
-		// 轮播图的数据,格式如：[{image: 'xxxx', title: 'xxxx'}，{image: 'yyyy', title: 'yyyy'}]，其中title字段可选
+	 * @description 该组件一般用于导航轮播，广告展示等场景,可开箱即用
-		list: {
+	 * @tutorial https://www.uviewui.com/components/swiper.html
-			type: Array,
+	 * @property {Array} list 轮播图数据，见官网"基本使用"说明
-			default() {
+	 * @property {Boolean} title 是否显示标题文字，需要配合list参数，见官网说明（默认false）
-				return [];
+	 * @property {String} mode 指示器模式，见官网说明（默认round）
+	 * @property {String Number} height 轮播图组件高度，单位rpx（默认250）
+	 * @property {String} indicator-pos 指示器的位置（默认bottomCenter）
+	 * @property {Boolean} effect3d 是否开启3D效果（默认false）
+	 * @property {Boolean} autoplay 是否自动播放（默认true）
+	 * @property {String Number} interval 自动轮播时间间隔，单位ms（默认2500）
+	 * @property {Boolean} circular 是否衔接播放，见官网说明（默认true）
+	 * @property {String Number} border-radius 轮播图圆角值，单位rpx（默认8）
+	 * @property {Object} title-style 自定义标题样式
+	 * @property {String Number} effect3d-previous-margin mode = true模式的情况下，激活项与前后项之间的距离，单位rpx（默认50）
+	 * @property {String} img-mode 图片的裁剪模式，详见image组件裁剪模式（默认aspectFill）
+	 * @event {Function} click 点击轮播图时触发
+	 * @example <u-swiper :list="list" mode="dot" indicator-pos="bottomRight"></u-swiper>
+	 */
+	export default {
+		name: "u-swiper",
+		props: {
+			// 轮播图的数据,格式如：[{image: 'xxxx', title: 'xxxx'}，{image: 'yyyy', title: 'yyyy'}]，其中title字段可选
+			list: {
+				type: Array,
+				default () {
+					return [];
+				}
+			},
+			// 是否显示title标题
+			title: {
+				type: Boolean,
+				default: false
+			},
+			// 用户自定义的指示器的样式
+			indicator: {
+				type: Object,
+				default () {
+					return {};
+				}
+			},
+			// 圆角值
+			borderRadius: {
+				type: [Number, String],
+				default: 8
+			},
+			// 隔多久自动切换
+			interval: {
+				type: [String, Number],
+				default: 3000
+			},
+			// 指示器的模式，rect|dot|number|round
+			mode: {
+				type: String,
+				default: 'round'
+			},
+			// list的高度，单位rpx
+			height: {
+				type: [Number, String],
+				default: 250
+			},
+			// 指示器的位置，topLeft|topCenter|topRight|bottomLeft|bottomCenter|bottomRight
+			indicatorPos: {
+				type: String,
+				default: 'bottomCenter'
+			},
+			// 是否开启缩放效果
+			effect3d: {
+				type: Boolean,
+				default: false
+			},
+			// 3D模式的情况下，激活item与前后item之间的距离，单位rpx
+			effect3dPreviousMargin: {
+				type: [Number, String],
+				default: 50
+			},
+			// 是否自动播放
+			autoplay: {
+				type: Boolean,
+				default: true
+			},
+			// 自动轮播时间间隔，单位ms
+			duration: {
+				type: [Number, String],
+				default: 500
+			},
+			// 是否衔接滑动，即到最后一张时接着滑动，是佛自动切换到第一张
+			circular: {
+				type: Boolean,
+				default: true
+			},
+			// 图片的形式模式 
+			imgMode: {
+				type: String,
+				default: 'aspectFill'
+			},
+			// 从list数组中读取的图片的属性名
+			name: {
+				type: String,
+				default: 'image'
 			}
 		},
-		// 是否显示title标题
+		data() {
-		title: {
+			return {
-			type: Boolean,
+				current: 0 // 当前活跃的swiper-item的index
-			default: false
+			};
 		},
-		// 用户自定义的指示器的样式
+		computed: {
-		indicator: {
+			justifyContent() {
-			type: Object,
+				if (this.indicatorPos == 'topLeft' || this.indicatorPos == 'bottomLeft') return 'flex-start';
-			default() {
+				if (this.indicatorPos == 'topCenter' || this.indicatorPos == 'bottomCenter') return 'center';
-				return {};
+				if (this.indicatorPos == 'topRight' || this.indicatorPos == 'bottomRight') return 'flex-end';
+			},
+			titlePaddingBottom() {
+				let tmp = 0;
+				if (this.mode == 'none') return '12rpx';
+				if (['bottomLeft', 'bottomCenter', 'bottomRight'].indexOf(this.indicatorPos) >= 0 && this.mode == 'number') {
+					tmp = '60rpx';
+				} else if (['bottomLeft', 'bottomCenter', 'bottomRight'].indexOf(this.indicatorPos) >= 0 && this.mode != 'number') {
+					tmp = '40rpx';
+				} else {
+					tmp = '12rpx';
+				}
+				return tmp;
 			}
 		},
-		// 圆角值
+		methods: {
-		borderRadius: {
+			listClick(index) {
-			type: [Number, String],
+				this.$emit('click', index);
-			default: 8
+			},
-		},
+			change(e) {
-		// 隔多久自动切换
+				this.current = e.detail.current;
-		interval: {
-			type: [String, Number],
-			default: 3000
-		},
-		// 指示器的模式，rect|dot|number|round
-		mode: {
-			type: String,
-			default: 'round'
-		},
-		// list的高度，单位rpx
-		height: {
-			type: [Number, String],
-			default: 250
-		},
-		// 指示器的位置，topLeft|topCenter|topRight|bottomLeft|bottomCenter|bottomRight
-		indicatorPos: {
-			type: String,
-			default: 'bottomCenter'
-		},
-		// 是否开启缩放效果
-		effect3d: {
-			type: Boolean,
-			default: false
-		},
-		// 3D模式的情况下，激活item与前后item之间的距离，单位rpx
-		effect3dPreviousMargin: {
-			type: [Number, String],
-			default: 50
-		},
-		// 是否自动播放
-		autoplay: {
-			type: Boolean,
-			default: true
-		},
-		// 自动轮播时间间隔，单位ms
-		duration: {
-			type: [Number, String],
-			default: 500
-		},
-		// 是否衔接滑动，即到最后一张时接着滑动，是佛自动切换到第一张
-		circular: {
-			type: Boolean,
-			default: true
-		},
-		// 图片的形式模式 
-		imgMode: {
-			type: String,
-			default: 'aspectFill'
-		},
-		// 从list数组中读取的图片的属性名
-		name: {
-			type: String,
-			default: 'image'
-		}
-	},
-	data() {
-		return {
-			current: 0 // 当前活跃的swiper-item的index
-		};
-	},
-	computed: {
-		justifyContent() {
-			if(this.indicatorPos == 'topLeft' || this.indicatorPos == 'bottomLeft') return 'flex-start';
-			if(this.indicatorPos == 'topCenter' || this.indicatorPos == 'bottomCenter') return 'center';
-			if(this.indicatorPos == 'topRight' || this.indicatorPos == 'bottomRight') return 'flex-end';
-		},
-		titlePaddingBottom() {
-			let tmp = 0;
-			if(this.mode == 'none') return '12rpx';
-			if(['bottomLeft', 'bottomCenter', 'bottomRight'].indexOf(this.indicatorPos) >= 0 && this.mode == 'number') {
-				tmp = '60rpx';
-			} else if(['bottomLeft', 'bottomCenter', 'bottomRight'].indexOf(this.indicatorPos) >= 0 && this.mode != 'number') {
-				tmp = '40rpx';
-			} else {
-				tmp = '12rpx';
 			}
-			return tmp;
-		}
-	},
-	methods: {
-		listClick(index) {
-			this.$emit('click', index);
-		},
-		change(e) {
-			this.current = e.detail.current;
 		}
-	}
+	};
-};
 </script>
 <style lang="scss" scoped>
-.u-swiper-wrap {
+	.u-swiper-wrap {
-	position: relative;
+		position: relative;
-	overflow: hidden;
+		overflow: hidden;
-}
+	}
-.u-swiper-image {
+	.u-swiper-image {
-	width: 100%;
+		width: 100%;
-	will-change: transform;
+		will-change: transform;
-	height: 100%;
+		height: 100%;
-	display: block;
+		display: block;
-	/* #ifdef H5 */
+		/* #ifdef H5 */
-	pointer-events: none;
+		pointer-events: none;
-	/* #endif */
+		/* #endif */
-}
+	}
-.u-swiper-indicator {
+	.u-swiper-indicator {
-	padding: 0 24rpx;
+		padding: 0 24rpx;
-	position: absolute;
+		position: absolute;
-	display: flex;
+		display: flex;
-	width: 100%;
+		width: 100%;
-	z-index: 1;
+		z-index: 1;
-}
+	}
-.u-indicator-item-rect {
+	.u-indicator-item-rect {
-	width: 26rpx;
+		width: 26rpx;
-	height: 8rpx;
+		height: 8rpx;
-	margin: 0 6rpx;
+		margin: 0 6rpx;
-	transition: all 0.5s;
+		transition: all 0.5s;
-	background-color: rgba(0, 0, 0, 0.3);
+		background-color: rgba(0, 0, 0, 0.3);
-}
+	}
-.u-indicator-item-rect-active {
+	.u-indicator-item-rect-active {
-	background-color: rgba(255, 255, 255, 0.8);
+		background-color: rgba(255, 255, 255, 0.8);
-}
+	}
-.u-indicator-item-dot {
+	.u-indicator-item-dot {
-	width: 14rpx;
+		width: 14rpx;
-	height: 14rpx;
+		height: 14rpx;
-	margin: 0 6rpx;
+		margin: 0 6rpx;
-	border-radius: 20rpx;
+		border-radius: 20rpx;
-	transition: all 0.5s;
+		transition: all 0.5s;
-	background-color: rgba(0, 0, 0, 0.3);
+		background-color: rgba(0, 0, 0, 0.3);
-}
+	}
-.u-indicator-item-dot-active {
+	.u-indicator-item-dot-active {
-	background-color: rgba(255, 255, 255, 0.8);
+		background-color: rgba(255, 255, 255, 0.8);
-}
+	}
-.u-indicator-item-round {
+	.u-indicator-item-round {
-	width: 14rpx;
+		width: 14rpx;
-	height: 14rpx;
+		height: 14rpx;
-	margin: 0 6rpx;
+		margin: 0 6rpx;
-	border-radius: 20rpx;
+		border-radius: 20rpx;
-	transition: all 0.5s;
+		transition: all 0.5s;
-	background-color: rgba(0, 0, 0, 0.3);
+		background-color: rgba(0, 0, 0, 0.3);
-}
+	}
-.u-indicator-item-round-active {
+	.u-indicator-item-round-active {
-	width: 34rpx;
+		width: 34rpx;
-	background-color: rgba(255, 255, 255, 0.8);
+		background-color: rgba(255, 255, 255, 0.8);
-}
+	}
-.u-indicator-item-number {
+	.u-indicator-item-number {
-	padding: 6rpx 16rpx;
+		padding: 6rpx 16rpx;
-	line-height: 1;
+		line-height: 1;
-	background-color: rgba(0, 0, 0, 0.3);
+		background-color: rgba(0, 0, 0, 0.3);
-	border-radius: 100rpx;
+		border-radius: 100rpx;
-	font-size: 26rpx;
+		font-size: 26rpx;
-	color: rgba(255, 255, 255, 0.8);
+		color: rgba(255, 255, 255, 0.8);
-}
+	}
-.u-list-scale {
+	.u-list-scale {
-	transform-origin: center center;
+		transform-origin: center center;
-}
+	}
-.u-list-image-wrap {
+	.u-list-image-wrap {
-	width: 100%;
+		width: 100%;
-	height: 100%;
+		height: 100%;
-	flex: 1;
+		flex: 1;
-	transition: all 0.5s;
+		transition: all 0.5s;
-	overflow: hidden;
+		overflow: hidden;
-	box-sizing: content-box;
+		box-sizing: content-box;
-	position: relative;
+		position: relative;
-}
+	}
-.u-swiper-title {
+	.u-swiper-title {
-	position: absolute;
+		position: absolute;
-	background-color: rgba(0, 0, 0, 0.3);
+		background-color: rgba(0, 0, 0, 0.3);
-	bottom: 0;
+		bottom: 0;
-	left: 0;
+		left: 0;
-	width: 100%;
+		width: 100%;
-	font-size: 28rpx;
+		font-size: 28rpx;
-	padding: 12rpx 24rpx;
+		padding: 12rpx 24rpx;
-	color: rgba(255, 255, 255, 0.9);
+		color: rgba(255, 255, 255, 0.9);
-}
+	}
-.u-swiper-item {
+	.u-swiper-item {
-	display: flex;
+		display: flex;
-	overflow: hidden;
+		overflow: hidden;
-	align-items: center;
+		align-items: center;
-}
+	}
 </style>
--- a/uview/components/u-switch/u-switch.vue
+++ b/uview/components/u-switch/u-switch.vue
 <template>
-	<view
+	<view class="u-switch" :class="[value == true ? 'u-switch--on' : '', disabled ? 'u-switch--disabled' : '']" @tap="onClick"
-		class="u-switch"
+	 :style="[switchStyle]">
-		:class="[value == true ? 'u-switch--on' : '', disabled ? 'u-switch--disabled' : '']"
-		@tap="onClick"
-		:style="[switchStyle]"
-	>
 		<view class="u-switch__node node-class">
-			<u-loading :show="loading" class="u-switch__loading" :size="size * 0.6" :color="loadingColor"/>
+			<u-loading :show="loading" class="u-switch__loading" :size="size * 0.6" :color="loadingColor" />
 		</view>
 	</view>
 </template>
 <script>
-export default {
+	/**
-	props: {
+	 * switch 开关选择器
-		// 是否为加载中状态
+	 * @description 选择开关一般用于只有两个选择，且只能选其一的场景。
-		loading: {
+	 * @tutorial https://www.uviewui.com/components/switch.html
-			type: Boolean,
+	 * @property {Boolean} loading 是否处于加载中（默认false）
-			default: false
+	 * @property {Boolean} disabled 是否禁用（默认false）
+	 * @property {String Number} size 开关尺寸，单位rpx（默认50）
+	 * @property {String} active-color 打开时的背景色（默认#2979ff）
+	 * @property {Boolean} inactive-color 关闭时的背景色（默认#ffffff）
+	 * @event {Function} change 在switch打开或关闭时触发
+	 * @example <u-switch v-model="checked" active-color="red" inactive-color="#eee"></u-switch>
+	 */
+	export default {
+		name: "u-switch",
+		props: {
+			// 是否为加载中状态
+			loading: {
+				type: Boolean,
+				default: false
+			},
+			// 是否为禁用装填
+			disabled: {
+				type: Boolean,
+				default: false
+			},
+			// 开关尺寸，单位rpx
+			size: {
+				type: [Number, String],
+				default: 50
+			},
+			// 打开时的背景颜色
+			activeColor: {
+				type: String,
+				default: '#2979ff'
+			},
+			// 关闭时的背景颜色
+			unactiveColor: {
+				type: String,
+				default: '#ffffff'
+			},
+			// 通过v-model双向绑定的值
+			value: {
+				type: Boolean,
+				default: false
+			}
 		},
-		// 是否为禁用装填
+		data() {
-		disabled: {
+			return {
-			type: Boolean,
-			default: false
+			}
-		},
-		// 开关尺寸，单位rpx
-		size: {
-			type: [Number, String],
-			default: 50
-		},
-		// 打开时的背景颜色
-		activeColor: {
-			type: String,
-			default: '#2979ff'
 		},
-		// 关闭时的背景颜色
+		computed: {
-		unactiveColor: {
+			switchStyle() {
-			type: String,
+				let style = {};
-			default: '#ffffff'
+				style.fontSize = this.size + 'rpx';
+				style.backgroundColor = this.value ? this.activeColor : this.unactiveColor;
+				return style;
+			},
+			loadingColor() {
+				return this.value ? this.activeColor : null;
+			}
 		},
-		// 通过v-model双向绑定的值
+		methods: {
-		value: {
+			onClick() {
-			type: Boolean,
+				if (!this.disabled && !this.loading) {
-			default: false
+					// 使手机产生短促震动，微信小程序有效，APP(HX 2.6.8)和H5无效
-		}
+					uni.vibrateShort();
-	},
+					this.$emit('input', !this.value);
-	data() {
+					// 放到下一个生命周期，因为双向绑定的value修改父组件状态需要时间，且是异步的
-		return {
+					this.$nextTick(function() {
+						this.$emit('change', this.value);
+					})
+				}
+			}
 		}
-	},
+	};
-	computed: {
-		switchStyle() {
-			let style = {};
-			style.fontSize = this.size + 'rpx';
-			style.backgroundColor = this.value ? this.activeColor : this.unactiveColor;
-			return style;
-		},
-		loadingColor() {
-			return this.value ? this.activeColor : null;
-		}
-	},
-	methods: {
-	    onClick() {
-	        if (!this.disabled && !this.loading) {
-				// 使手机产生短促震动，微信小程序有效，APP(HX 2.6.8)和H5无效
-				uni.vibrateShort();
-	            this.$emit('input', !this.value);
-				// 放到下一个生命周期，因为双向绑定的value修改父组件状态需要时间，且是异步的
-	            this.$nextTick(function(){
-	            	this.$emit('change', this.value);
-	            })
-	        }
-	    }
-	}
-};
 </script>
 <style lang="scss" scoped>
-.u-switch {
+	.u-switch {
-	position: relative;
+		position: relative;
-	display: inline-block;
+		display: inline-block;
-	box-sizing: initial;
+		box-sizing: initial;
-	width: 2em;
+		width: 2em;
-	width: var(--switch-width, 2em);
+		width: var(--switch-width, 2em);
-	height: 1em;
+		height: 1em;
-	height: var(--switch-height, 1em);
+		height: var(--switch-height, 1em);
-	background-color: #fff;
+		background-color: #fff;
-	background-color: var(--switch-background-color, #fff);
+		background-color: var(--switch-background-color, #fff);
-	border: 1px solid rgba(0, 0, 0, 0.1);
+		border: 1px solid rgba(0, 0, 0, 0.1);
-	border: var(--switch-border, 1px solid rgba(0, 0, 0, 0.1));
+		border: var(--switch-border, 1px solid rgba(0, 0, 0, 0.1));
-	border-radius: 1em;
+		border-radius: 1em;
-	border-radius: var(--switch-node-size, 1em);
+		border-radius: var(--switch-node-size, 1em);
-	transition: background-color 0.3s;
+		transition: background-color 0.3s;
-	transition: background-color var(--switch-transition-duration, 0.3s);
+		transition: background-color var(--switch-transition-duration, 0.3s);
-}
+	}
-.u-switch__node {
+	.u-switch__node {
-	display: flex;
+		display: flex;
-	align-items: center;
+		align-items: center;
-	justify-content: center;
+		justify-content: center;
-	position: absolute;
+		position: absolute;
-	top: 0;
+		top: 0;
-	left: 0;
+		left: 0;
-	border-radius: 100%;
+		border-radius: 100%;
-	z-index: 1;
+		z-index: 1;
-	z-index: var(--switch-node-z-index, 1);
+		z-index: var(--switch-node-z-index, 1);
-	width: 1em;
+		width: 1em;
-	width: var(--switch-node-size, 1em);
+		width: var(--switch-node-size, 1em);
-	height: 1em;
+		height: 1em;
-	height: var(--switch-node-size, 1em);
+		height: var(--switch-node-size, 1em);
-	background-color: #fff;
+		background-color: #fff;
-	background-color: var(--switch-node-background-color, #fff);
+		background-color: var(--switch-node-background-color, #fff);
-	box-shadow: 0 3px 1px 0 rgba(0, 0, 0, 0.05), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 3px 3px 0 rgba(0, 0, 0, 0.05);
+		box-shadow: 0 3px 1px 0 rgba(0, 0, 0, 0.05), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 3px 3px 0 rgba(0, 0, 0, 0.05);
-	box-shadow: var(--switch-node-box-shadow, 0 3px 1px 0 rgba(0, 0, 0, 0.05), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 3px 3px 0 rgba(0, 0, 0, 0.05));
+		box-shadow: var(--switch-node-box-shadow, 0 3px 1px 0 rgba(0, 0, 0, 0.05), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 3px 3px 0 rgba(0, 0, 0, 0.05));
-	transition: -webkit-transform 0.3s cubic-bezier(0.3, 1.05, 0.4, 1.05);
+		transition: -webkit-transform 0.3s cubic-bezier(0.3, 1.05, 0.4, 1.05);
-	transition: transform 0.3s cubic-bezier(0.3, 1.05, 0.4, 1.05);
+		transition: transform 0.3s cubic-bezier(0.3, 1.05, 0.4, 1.05);
-	transition: transform 0.3s cubic-bezier(0.3, 1.05, 0.4, 1.05), -webkit-transform 0.3s cubic-bezier(0.3, 1.05, 0.4, 1.05);
+		transition: transform 0.3s cubic-bezier(0.3, 1.05, 0.4, 1.05), -webkit-transform 0.3s cubic-bezier(0.3, 1.05, 0.4, 1.05);
-	transition: -webkit-transform var(--switch-transition-duration, 0.3s) cubic-bezier(0.3, 1.05, 0.4, 1.05);
+		transition: -webkit-transform var(--switch-transition-duration, 0.3s) cubic-bezier(0.3, 1.05, 0.4, 1.05);
-	transition: transform var(--switch-transition-duration, 0.3s) cubic-bezier(0.3, 1.05, 0.4, 1.05);
+		transition: transform var(--switch-transition-duration, 0.3s) cubic-bezier(0.3, 1.05, 0.4, 1.05);
-	transition: transform var(--switch-transition-duration, 0.3s) cubic-bezier(0.3, 1.05, 0.4, 1.05),
+		transition: transform var(--switch-transition-duration, 0.3s) cubic-bezier(0.3, 1.05, 0.4, 1.05),
-		-webkit-transform var(--switch-transition-duration, 0.3s) cubic-bezier(0.3, 1.05, 0.4, 1.05);
+			-webkit-transform var(--switch-transition-duration, 0.3s) cubic-bezier(0.3, 1.05, 0.4, 1.05);
-}
+	}
-.u-switch__loading {
+	.u-switch__loading {
-	display: flex;
+		display: flex;
-	align-items: center;
+		align-items: center;
-	justify-content: center;
+		justify-content: center;
-}
+	}
-.u-switch--on {
+	.u-switch--on {
-	background-color: #1989fa;
+		background-color: #1989fa;
-	background-color: var(--switch-on-background-color, #1989fa);
+		background-color: var(--switch-on-background-color, #1989fa);
-}
+	}
-.u-switch--on .u-switch__node {
+	.u-switch--on .u-switch__node {
-	-webkit-transform: translateX(1em);
+		-webkit-transform: translateX(1em);
-	transform: translateX(1em);
+		transform: translateX(1em);
-	-webkit-transform: translateX(calc(var(--switch-width, 2em) - var(--switch-node-size, 1em)));
+		-webkit-transform: translateX(calc(var(--switch-width, 2em) - var(--switch-node-size, 1em)));
-	transform: translateX(calc(var(--switch-width, 2em) - var(--switch-node-size, 1em)));
+		transform: translateX(calc(var(--switch-width, 2em) - var(--switch-node-size, 1em)));
-}
+	}
-.u-switch--disabled {
+	.u-switch--disabled {
-	opacity: 0.4;
+		opacity: 0.4;
-	opacity: var(--switch-disabled-opacity, 0.4);
+		opacity: var(--switch-disabled-opacity, 0.4);
-}
+	}
 </style>
--- a/uview/components/u-table/u-table.vue
+++ b/uview/components/u-table/u-table.vue
@@ -5,7 +5,23 @@
 </template>
 <script>
+	/**
+	 * table 表格
+	 * @description 表格组件一般用于展示大量结构化数据的场景
+	 * @tutorial https://www.uviewui.com/components/table.html
+	 * @property {String} border-color 表格边框的颜色（默认#e4e7ed）
+	 * @property {String} bg-color 表格的背景颜色（默认#ffffff）
+	 * @property {String} align 单元格的内容对齐方式，作用类似css的text-align（默认center）
+	 * @property {String} padding 单元格的内边距，同css的padding写法（默认10rpx 0）
+	 * @property {String Number} font-size 单元格字体大小，单位rpx（默认28）
+	 * @property {String} color 单元格字体颜色（默认#606266）
+	 * @property {Object} th-style th单元格的样式，对象形式(将th所需参数放在table组件，是为了避免每一个th组件要写一遍）
+	 * @event {Function} click 点击组件时触发
+	 * @event {Function} close 点击关闭按钮时触发
+	 * @example <u-table></u-table>
+	 */
 	export default {
+		name: "u-table",
 		props: {
 			borderColor: {
 				type: String,
@@ -33,7 +49,7 @@
 			// th的自定义样式
 			thStyle: {
 				type: Object,
-				default() {
+				default () {
 					return {}
 				}
 			},
@@ -50,8 +66,7 @@
 			};
 		},
 		data() {
-			return {
+			return {}
-			}
 		},
 		computed: {
 			tableStyle() {

--- a/uview/components/u-tabs-swiper/u-tabs-swiper.vue
+++ b/uview/components/u-tabs-swiper/u-tabs-swiper.vue
 <template>
-	<view
+	<view class="u-tabs" :style="{
-		class="u-tabs"
-		:style="{
 			zIndex: zIndex,
 			background: bgColor
-		}"
+		}">
-	>
 		<scroll-view scroll-x class="u-scroll-view" :scroll-left="scrollLeft" scroll-with-animation :style="{ zIndex: zIndex + 1 }">
 			<view class="u-tabs-scroll-box" :class="{'u-tabs-scorll-flex': !isScroll}">
-				<view
+				<view class="u-tabs-item" :style="[tabItemStyle(index)]"
-					class="u-tabs-item"
+				 v-for="(item, index) in getTabs" :key="index" :class="[preId + index]" @tap="emit(index)">
-					:style="{
-						height: height + 'rpx',
-						lineHeight: height + 'rpx',
-						padding: `0 ${gutter / 2}rpx`,
-						color: tabsInfo.length > 0 ? (tabsInfo[index] ? tabsInfo[index].color : activeColor) : inactiveColor,
-						fontSize: fontSize + 'rpx',
-						zIndex: zIndex + 2,
-						fontWeight: (index == getCurrent && bold) ? 'bold' : 'normal'
-					}"
-					v-for="(item, index) in getTabs"
-					:key="index"
-					:class="[preId + index]"
-					@tap="emit(index)"
-				>
 					{{ item[name] || item['name']}}
 				</view>
-				<view
+				<view v-if="showBar" class="u-scroll-bar" :style="[tabBarStyle]"></view>
-					class="u-scroll-bar"
-					:style="{
-						width: barWidthPx + 'px',
-						height: barHeight + 'rpx',
-						borderRadius: '100px',
-						backgroundColor: activeColor,
-						left: scrollBarLeft + 'px'
-					}"
-				></view>
 			</view>
 		</scroll-view>
 	</view>
 </template>
 <script>
-import colorGradient from '@/uview/libs/function/colorGradient';
+	import colorGradient from '@/uview/libs/function/colorGradient';
-let color = colorGradient;
+	let color = colorGradient;
-const { windowWidth } = uni.getSystemInfoSync();
+	const {
-const preId = 'UEl_';
+		windowWidth
-export default {
+	} = uni.getSystemInfoSync();
-	props: {
+	const preId = 'UEl_';
-		// 导航菜单是否需要滚动，如只有2或者3个的时候，就不需要滚动了，此时使用flex平分tab的宽度
-		isScroll: {
+	/**
-			type: Boolean,
+	 * tabsSwiper 全屏选项卡
-			default: true
+	 * @description 该组件内部实现主要依托于uniapp的scroll-view和swiper组件，主要特色是切换过程中，tabsSwiper文字的颜色可以渐变，底部滑块可以 跟随式滑动，活动tab滚动居中等。应用场景可以用于需要左右切换页面，比如商城的订单中心(待收货-待付款-待评价-已退货)等应用场景。
-		},
+	 * @tutorial https://www.uviewui.com/components/tabsSwiper.html
-		//需循环的标签列表
+	 * @property {Boolean} is-scroll tabs是否可以左右拖动（默认true）
-		list: {
+	 * @property {Array} list 标签数组，元素为对象，如[{name: '推荐'}]
-			type: Array,
+	 * @property {String Number} current 指定哪个tab为激活状态（默认0）
-			default() {
+	 * @property {String Number} height 导航栏的高度，单位rpx（默认80）
-				return [];
+	 * @property {String Number} font-size tab文字大小，单位rpx（默认30）
-			}
+	 * @property {String Number} swiper-width tabs组件外部swiper的宽度，默认为屏幕宽度，单位rpx（默认750）
-		},
+	 * @property {String} active-color 滑块和激活tab文字的颜色（默认#2979ff）
-		// 当前活动tab的索引
+	 * @property {String} inactive-color tabs文字颜色（默认#303133）
-		current: {
+	 * @property {String Number} bar-width 滑块宽度，单位rpx（默认40）
-			type: [Number, String],
+	 * @property {String Number} bar-height 滑块高度，单位rpx（默认6）
-			default: 0
+	 * @property {Object} bar-style 底部滑块的样式，对象形式
-		},
+	 * @property {Object} active-item-style 活动tabs item的样式，对象形式
-		// 导航栏的高度和行高，单位rpx
+	 * @property {Boolean} show-bar 是否显示底部的滑块（默认true）
-		height: {
+	 * @property {String Number} gutter 单个tab标签的左右内边距之和，单位rpx（默认40）
-			type: [Number, String],
+	 * @property {String} bg-color tabs导航栏的背景颜色（默认#ffffff）
-			default: 80
+	 * @property {String} name 组件内部读取的list参数中的属性名，见官网说明（默认name）
-		},
+	 * @property {Boolean} bold 激活选项的字体是否加粗（默认true）
-		// 字体大小，单位rpx
+	 * @event {Function} change 点击标签时触发
-		fontSize: {
+	 * @example <u-tabs-swiper ref="tabs" :list="list" :is-scroll="false"></u-tabs-swiper>
-			type: [Number, String],
+	 */
-			default: 30
+	export default {
-		},
+		name: "u-tabs-swiper",
-		// 过渡动画时长, 单位s
+		props: {
-		// duration: {
+			// 导航菜单是否需要滚动，如只有2或者3个的时候，就不需要滚动了，此时使用flex平分tab的宽度
-		// 	type: [Number, String],
+			isScroll: {
-		// 	default: 0.5
+				type: Boolean,
-		// },
+				default: true
-		swiperWidth: {
+			},
-			//line3生效, 外部swiper的宽度, 单位rpx
+			//需循环的标签列表
-			type: [String, Number],
+			list: {
-			default: 750
+				type: Array,
-		},
+				default () {
-		// 选中项的主题颜色
+					return [];
-		activeColor: {
+				}
-			type: String,
+			},
-			default: '#2979ff'
+			// 当前活动tab的索引
-		},
+			current: {
-		// 未选中项的颜色
+				type: [Number, String],
-		inactiveColor: {
+				default: 0
-			type: String,
+			},
-			default: '#303133'
+			// 导航栏的高度和行高，单位rpx
-		},
+			height: {
-		// 菜单底部移动的bar的宽度，单位rpx
+				type: [Number, String],
-		barWidth: {
+				default: 80
-			type: [Number, String],
+			},
-			default: 40
+			// 字体大小，单位rpx
-		},
+			fontSize: {
-		// 移动bar的高度
+				type: [Number, String],
-		barHeight: {
+				default: 30
-			type: [Number, String],
+			},
-			default: 6
+			// 过渡动画时长, 单位s
-		},
+			// duration: {
-		// 单个tab的左或右内边距（各占一半），单位rpx
+			// 	type: [Number, String],
-		gutter: {
+			// 	default: 0.5
-			type: [Number, String],
+			// },
-			default: 40
+			swiperWidth: {
-		},
+				//line3生效, 外部swiper的宽度, 单位rpx
-		// 如果是绝对定位，添加z-index值
+				type: [String, Number],
-		zIndex: {
+				default: 750
-			type: [Number, String],
+			},
-			default: 1
+			// 选中项的主题颜色
-		},
+			activeColor: {
-		// 导航栏的背景颜色
+				type: String,
-		bgColor: {
+				default: '#2979ff'
-			type: String,
+			},
-			default: '#ffffff'
+			// 未选中项的颜色
-		},
+			inactiveColor: {
-		//滚动至中心目标类型
+				type: String,
-		autoCenterMode: {
+				default: '#303133'
-			type: String,
+			},
-			default: 'window'
+			// 菜单底部移动的bar的宽度，单位rpx
-		},
+			barWidth: {
-		// 读取传入的数组对象的属性
+				type: [Number, String],
-		name: {
+				default: 40
-			type: String,
+			},
-			default: 'name'
+			// 移动bar的高度
-		},
+			barHeight: {
-		// 活动tab字体是否加粗
+				type: [Number, String],
-		bold: {
+				default: 6
-			type: Boolean,
+			},
-			default: true
+			// 单个tab的左或右内边距（各占一半），单位rpx
-		}
+			gutter: {
-	},
+				type: [Number, String],
-	data() {
+				default: 40
-		return {
+			},
-			scrollLeft: 0, // 滚动scroll-view的左边滚动距离
+			// 如果是绝对定位，添加z-index值
-			tabQueryInfo: [], // 存放对tab菜单查询后的节点信息
+			zIndex: {
-			windowWidth: 0, // 屏幕宽度，单位为px
+				type: [Number, String],
-			//scrollBarLeft: 0, // 移动bar需要通过translateX()移动的距离
+				default: 1
-			animationFinishCurrent: this.current,
+			},
-			componentsWidth: 0,
+			// 导航栏的背景颜色
-			line3AddDx: 0,
+			bgColor: {
-			line3Dx: 0,
+				type: String,
-			preId,
+				default: '#ffffff'
-			sW: 0,
+			},
-			tabsInfo: [],
+			//滚动至中心目标类型
-			colorGradientArr: [],
+			autoCenterMode: {
-			colorStep: 100 // 两个颜色之间的渐变等分
+				type: String,
-		};
+				default: 'window'
-	},
+			},
-	computed: {
+			// 读取传入的数组对象的属性
-		// 获取当前活跃的current值
+			name: {
-		getCurrent() {
+				type: String,
-			const current = Number(this.current);
+				default: 'name'
-			// 判断是否超出边界
+			},
-			if (current > this.getTabs.length - 1) {
+			// 活动tab字体是否加粗
-				return this.getTabs.length - 1;
+			bold: {
+				type: Boolean,
+				default: true
+			},
+			// 当前活动tab item的样式
+			activeItemStyle: {
+				type: Object,
+				default() {
+					return {}
+				}
+			},
+			// 是否显示底部的滑块
+			showBar: {
+				type: Boolean,
+				default: true
+			},
+			// 底部滑块的自定义样式
+			barStyle: {
+				type: Object,
+				default() {
+					return {}
+				}
 			}
-			if (current < 0) return 0;
-			return current;
-		},
-		getTabs() {
-			return this.list;
-		},
-		// 滑块需要移动的距离
-		scrollBarLeft() {
-			return Number(this.line3Dx) + Number(this.line3AddDx);
-		},
-		// 滑块的宽度转为px单位
-		barWidthPx() {
-			return uni.upx2px(this.barWidth);
-		}
-	},
-	watch: {
-		current(n, o) {
-			this.change(n);
-			this.setFinishCurrent(n);
 		},
-		list() {
+		data() {
-			this.$nextTick(() => {
+			return {
-				this.init();
+				scrollLeft: 0, // 滚动scroll-view的左边滚动距离
-			})
+				tabQueryInfo: [], // 存放对tab菜单查询后的节点信息
-		}
+				windowWidth: 0, // 屏幕宽度，单位为px
-	},
+				//scrollBarLeft: 0, // 移动bar需要通过translateX()移动的距离
-	mounted() {
+				animationFinishCurrent: this.current,
-		this.init();
+				componentsWidth: 0,
-	},
+				line3AddDx: 0,
-	methods: {
+				line3Dx: 0,
-		async init() {
+				preId,
-			this.countPx();
+				sW: 0,
-			await this.getTabsInfo();
+				tabsInfo: [],
-			this.countLine3Dx();
+				colorGradientArr: [],
-			this.getQuery(() => {
+				colorStep: 100 // 两个颜色之间的渐变等分
-				this.setScrollViewToCenter();
+			};
-			});
-			// 颜色渐变过程数组
-			this.colorGradientArr = color.colorGradient(this.inactiveColor, this.activeColor, this.colorStep);
 		},
-		// 获取各个tab的节点信息 
+		computed: {
-		getTabsInfo() {
+			// 获取当前活跃的current值
-			return new Promise((resolve, reject) => {
+			getCurrent() {
-				let view = uni.createSelectorQuery().in(this);
+				const current = Number(this.current);
-				for (let i = 0; i < this.list.length; i++) {
+				// 判断是否超出边界
-					view.select('.' + preId + i).boundingClientRect();
+				if (current > this.getTabs.length - 1) {
+					return this.getTabs.length - 1;
 				}
-				view.exec(res => {
+				if (current < 0) return 0;
-					const arr = [];
+				return current;
-					for (let i = 0; i < res.length; i++) {
+			},
-						// 给每个tab添加其文字颜色属性
+			getTabs() {
-						res[i].color = this.inactiveColor;
+				return this.list;
-						// 当前tab直接赋予activeColor
+			},
-						if (i == this.getCurrent) res[i].color = this.activeColor;
+			// 滑块需要移动的距离
-						arr.push(res[i]);
+			scrollBarLeft() {
+				return Number(this.line3Dx) + Number(this.line3AddDx);
+			},
+			// 滑块的宽度转为px单位
+			barWidthPx() {
+				return uni.upx2px(this.barWidth);
+			},
+			// tab的样式
+			tabItemStyle() {
+				return (index) => {
+					let style = {
+						height: this.height + 'rpx',
+						lineHeight: this.height + 'rpx',
+						padding: `0 ${this.gutter / 2}rpx`,
+						color: this.tabsInfo.length > 0 ? (this.tabsInfo[index] ? this.tabsInfo[index].color : this.activeColor) : this.inactiveColor,
+						fontSize: this.fontSize + 'rpx',
+						zIndex: this.zIndex + 2,
+						fontWeight: (index == this.getCurrent && this.bold) ? 'bold' : 'normal'
+					};
+					if(index == this.getCurrent) {
+						// 给选中的tab item添加外部自定义的样式
+						style = Object.assign(style, this.activeItemStyle);
 					}
-					this.tabsInfo = arr;
+					return style;
-					resolve();
-				});
-			})
-		},
-		// 当swiper滑动结束，计算滑块最终要停留的位置
-		countLine3Dx() {
-			const tab = this.tabsInfo[this.animationFinishCurrent];
-			// 让滑块中心点和当前tab中心重合
-			if (tab) this.line3Dx = tab.left + tab.width / 2 - this.barWidthPx / 2;
-		},
-		countPx() {
-			// swiper宽度由rpx转为px单位，因为dx等，都是px单位
-			this.sW = uni.upx2px(Number(this.swiperWidth));
-		},
-		emit(index) {
-			this.$emit('change', index);
-		},
-		change() {
-			this.setScrollViewToCenter();
-		},
-		getQuery(cb) {
-			try {
-				let view = uni.createSelectorQuery().in(this).select('.u-tabs');
-				view.fields(
-					{
-						size: true
-					},
-					data => {
-						if (data) {
-							this.componentsWidth = data.width;
-							if (cb && typeof cb === 'function') cb(data);
-						} else {
-							this.getQuery(cb);
-						}
-					}
-				).exec();
-			} catch (e) {
-				this.componentsWidth = windowWidth;
-			}
-		},
-		// 把活动tab移动到屏幕中心点
-		setScrollViewToCenter() {
-			let tab;
-			tab = this.tabsInfo[this.animationFinishCurrent];
-			if (tab) {
-				let tabCenter = tab.left + tab.width / 2;
-				let fatherWidth;
-				// 活动tab移动到中心时，以屏幕还是tab组件为宽度为基准
-				if (this.autoCenterMode === 'window') {
-					fatherWidth = windowWidth;
-				} else {
-					fatherWidth = this.componentsWidth;
 				}
-				this.scrollLeft = tabCenter - fatherWidth / 2;
+			},
+			// 底部滑块的样式
+			tabBarStyle() {
+				let style = {
+					width: this.barWidthPx + 'px',
+					height: this.barHeight + 'rpx',
+					borderRadius: '100px',
+					backgroundColor: this.activeColor,
+					left: this.scrollBarLeft + 'px'
+				};
+				return Object.assign(style, this.barStyle);
 			}
 		},
-		setDx(dx) {
+		watch: {
-			let nextTabIndex = dx > 0 ? this.animationFinishCurrent + 1 : this.animationFinishCurrent - 1;
+			current(n, o) {
-			// 判断索引是否超出边界
+				this.change(n);
-			nextTabIndex = nextTabIndex <= 0 ? 0 : nextTabIndex;
+				this.setFinishCurrent(n);
-			nextTabIndex = nextTabIndex >= this.list.length ? this.list.length - 1 : nextTabIndex;
+			},
-			const tab = this.tabsInfo[nextTabIndex];
+			list() {
-			// 当前tab中心点x轴坐标
+				this.$nextTick(() => {
-			let nowTab = this.tabsInfo[this.animationFinishCurrent];
+					this.init();
-			let nowTabX = nowTab.left + nowTab.width / 2;
+				})
-			// 下一个tab
+			}
-			let nextTab = this.tabsInfo[nextTabIndex];
-			let nextTabX = nextTab.left + nextTab.width / 2;
-			// 两个tab之间的距离，因为下一个tab可能在当前tab的左边或者右边，取绝对值即可
-			let distanceX = Math.abs(nextTabX - nowTabX);
-			this.line3AddDx = (dx / this.sW) * distanceX;
-			this.setTabColor(this.animationFinishCurrent, nextTabIndex, dx);
 		},
-		// 设置tab的颜色
+		mounted() {
-		setTabColor(nowTabIndex, nextTabIndex, dx) {
+			this.init();
-			let colorIndex = Math.abs(Math.ceil((dx / this.sW) * 100));
-			let colorLength = this.colorGradientArr.length;
-			// 处理超出索引边界的情况
-			colorIndex = colorIndex >= colorLength ? colorLength - 1 : colorIndex <= 0 ? 0 : colorIndex;
-			// 设置下一个tab的颜色
-			this.tabsInfo[nextTabIndex].color = this.colorGradientArr[colorIndex];
-			// 设置当前tab的颜色
-			this.tabsInfo[nowTabIndex].color = this.colorGradientArr[colorLength - 1 - colorIndex];
 		},
-		// swiper结束滑动
+		methods: {
-		setFinishCurrent(current) {
+			async init() {
-			// 如果滑动的索引不一致，修改tab颜色变化，因为可能会有直接点击tab的情况
+				this.countPx();
-			if (current != this.animationFinishCurrent) {
+				await this.getTabsInfo();
-				this.tabsInfo.map((val, index) => {
+				this.countLine3Dx();
-					if (current == index) val.color = this.activeColor;
+				this.getQuery(() => {
-					else val.color = this.inactiveColor;
+					this.setScrollViewToCenter();
-					return val;
 				});
+				// 颜色渐变过程数组
+				this.colorGradientArr = color.colorGradient(this.inactiveColor, this.activeColor, this.colorStep);
+			},
+			// 获取各个tab的节点信息 
+			getTabsInfo() {
+				return new Promise((resolve, reject) => {
+					let view = uni.createSelectorQuery().in(this);
+					for (let i = 0; i < this.list.length; i++) {
+						view.select('.' + preId + i).boundingClientRect();
+					}
+					view.exec(res => {
+						const arr = [];
+						for (let i = 0; i < res.length; i++) {
+							// 给每个tab添加其文字颜色属性
+							res[i].color = this.inactiveColor;
+							// 当前tab直接赋予activeColor
+							if (i == this.getCurrent) res[i].color = this.activeColor;
+							arr.push(res[i]);
+						}
+						this.tabsInfo = arr;
+						resolve();
+					});
+				})
+			},
+			// 当swiper滑动结束，计算滑块最终要停留的位置
+			countLine3Dx() {
+				const tab = this.tabsInfo[this.animationFinishCurrent];
+				// 让滑块中心点和当前tab中心重合
+				if (tab) this.line3Dx = tab.left + tab.width / 2 - this.barWidthPx / 2;
+			},
+			countPx() {
+				// swiper宽度由rpx转为px单位，因为dx等，都是px单位
+				this.sW = uni.upx2px(Number(this.swiperWidth));
+			},
+			emit(index) {
+				this.$emit('change', index);
+			},
+			change() {
+				this.setScrollViewToCenter();
+			},
+			getQuery(cb) {
+				try {
+					let view = uni.createSelectorQuery().in(this).select('.u-tabs');
+					view.fields({
+							size: true
+						},
+						data => {
+							if (data) {
+								this.componentsWidth = data.width;
+								if (cb && typeof cb === 'function') cb(data);
+							} else {
+								this.getQuery(cb);
+							}
+						}
+					).exec();
+				} catch (e) {
+					this.componentsWidth = windowWidth;
+				}
+			},
+			// 把活动tab移动到屏幕中心点
+			setScrollViewToCenter() {
+				let tab;
+				tab = this.tabsInfo[this.animationFinishCurrent];
+				if (tab) {
+					let tabCenter = tab.left + tab.width / 2;
+					let fatherWidth;
+					// 活动tab移动到中心时，以屏幕还是tab组件为宽度为基准
+					if (this.autoCenterMode === 'window') {
+						fatherWidth = windowWidth;
+					} else {
+						fatherWidth = this.componentsWidth;
+					}
+					this.scrollLeft = tabCenter - fatherWidth / 2;
+				}
+			},
+			setDx(dx) {
+				let nextTabIndex = dx > 0 ? this.animationFinishCurrent + 1 : this.animationFinishCurrent - 1;
+				// 判断索引是否超出边界
+				nextTabIndex = nextTabIndex <= 0 ? 0 : nextTabIndex;
+				nextTabIndex = nextTabIndex >= this.list.length ? this.list.length - 1 : nextTabIndex;
+				const tab = this.tabsInfo[nextTabIndex];
+				// 当前tab中心点x轴坐标
+				let nowTab = this.tabsInfo[this.animationFinishCurrent];
+				let nowTabX = nowTab.left + nowTab.width / 2;
+				// 下一个tab
+				let nextTab = this.tabsInfo[nextTabIndex];
+				let nextTabX = nextTab.left + nextTab.width / 2;
+				// 两个tab之间的距离，因为下一个tab可能在当前tab的左边或者右边，取绝对值即可
+				let distanceX = Math.abs(nextTabX - nowTabX);
+				this.line3AddDx = (dx / this.sW) * distanceX;
+				this.setTabColor(this.animationFinishCurrent, nextTabIndex, dx);
+			},
+			// 设置tab的颜色
+			setTabColor(nowTabIndex, nextTabIndex, dx) {
+				let colorIndex = Math.abs(Math.ceil((dx / this.sW) * 100));
+				let colorLength = this.colorGradientArr.length;
+				// 处理超出索引边界的情况
+				colorIndex = colorIndex >= colorLength ? colorLength - 1 : colorIndex <= 0 ? 0 : colorIndex;
+				// 设置下一个tab的颜色
+				this.tabsInfo[nextTabIndex].color = this.colorGradientArr[colorIndex];
+				// 设置当前tab的颜色
+				this.tabsInfo[nowTabIndex].color = this.colorGradientArr[colorLength - 1 - colorIndex];
+			},
+			// swiper结束滑动
+			setFinishCurrent(current) {
+				// 如果滑动的索引不一致，修改tab颜色变化，因为可能会有直接点击tab的情况
+				if (current != this.animationFinishCurrent) {
+					this.tabsInfo.map((val, index) => {
+						if (current == index) val.color = this.activeColor;
+						else val.color = this.inactiveColor;
+						return val;
+					});
+				}
+				this.line3AddDx = 0;
+				this.animationFinishCurrent = current;
+				this.countLine3Dx();
 			}
-			this.line3AddDx = 0;
-			this.animationFinishCurrent = current;
-			this.countLine3Dx();
 		}
-	}
+	};
-};
 </script>
 <style scoped lang="scss">
-view,
+	view,
-scroll-view {
+	scroll-view {
-	box-sizing: border-box;
+		box-sizing: border-box;
-}
+	}
-.u-tabs {
+	.u-tabs {
-	width: 100%;
+		width: 100%;
-	transition-property: background-color, color;
+		transition-property: background-color, color;
-}
+	}
-::-webkit-scrollbar,
+	::-webkit-scrollbar,
-::-webkit-scrollbar,
+	::-webkit-scrollbar,
-::-webkit-scrollbar {
+	::-webkit-scrollbar {
-	display: none;
+		display: none;
-	width: 0 !important;
+		width: 0 !important;
-	height: 0 !important;
+		height: 0 !important;
-	-webkit-appearance: none;
+		-webkit-appearance: none;
-	background: transparent;
+		background: transparent;
-}
+	}
-/* #ifdef H5 */
+	/* #ifdef H5 */
-// 通过样式穿透，隐藏H5下，scroll-view下的滚动条
+	// 通过样式穿透，隐藏H5下，scroll-view下的滚动条
-scroll-view /deep/ ::-webkit-scrollbar {
+	scroll-view /deep/ ::-webkit-scrollbar {
-	display: none;
+		display: none;
-	width: 0 !important;
+		width: 0 !important;
-	height: 0 !important;
+		height: 0 !important;
-	-webkit-appearance: none;
+		-webkit-appearance: none;
-	background: transparent;
+		background: transparent;
-}
+	}
-/* #endif */
-.u-scroll-view {
+	/* #endif */
-	width: 100%;
-	white-space: nowrap;
-	position: relative;
-}
-.u-tabs-scroll-box {
+	.u-scroll-view {
-	position: relative;
+		width: 100%;
-}
+		white-space: nowrap;
+		position: relative;
+	}
-.u-tabs-scorll-flex {
+	.u-tabs-scroll-box {
-	display: flex;
+		position: relative;
-	justify-content: space-between;
+	}
-}
-.u-tabs-scorll-flex .u-tabs-item {
+	.u-tabs-scorll-flex {
-	flex: 1;
+		display: flex;
-}
+		justify-content: space-between;
+	}
-.u-tabs-item {
+	.u-tabs-scorll-flex .u-tabs-item {
-	position: relative;
+		flex: 1;
-	display: inline-block;
+	}
-	text-align: center;
-	transition-property: background-color, color, font-weight;
-}
-.content {
+	.u-tabs-item {
-	overflow: hidden;
+		position: relative;
-	white-space: nowrap;
+		display: inline-block;
-	text-overflow: ellipsis;
+		text-align: center;
-}
+		transition-property: background-color, color, font-weight;
+	}
-.boxStyle {
+	.content {
-	pointer-events: none;
+		overflow: hidden;
-	position: absolute;
+		white-space: nowrap;
-	transition-property: all;
+		text-overflow: ellipsis;
-}
+	}
-.boxStyle2 {
+	.boxStyle {
-	pointer-events: none;
+		pointer-events: none;
-	position: absolute;
+		position: absolute;
-	bottom: 0;
+		transition-property: all;
-	transition-property: all;
+	}
-	transform: translateY(-100%);
-}
-.itemBackgroundBox {
+	.boxStyle2 {
-	pointer-events: none;
+		pointer-events: none;
-	position: absolute;
+		position: absolute;
-	top: 0;
+		bottom: 0;
-	transition-property: left, background-color;
+		transition-property: all;
-	display: flex;
+		transform: translateY(-100%);
-	flex-direction: row;
+	}
-	justify-content: center;
-	align-items: center;
-}
-.itemBackground {
+	.itemBackgroundBox {
-	height: 100%;
+		pointer-events: none;
-	width: 100%;
+		position: absolute;
-	transition-property: all;
+		top: 0;
-}
+		transition-property: left, background-color;
+		display: flex;
+		flex-direction: row;
+		justify-content: center;
+		align-items: center;
+	}
-.u-scroll-bar {
+	.itemBackground {
-	position: absolute;
+		height: 100%;
-	bottom: 4rpx;
+		width: 100%;
-}
+		transition-property: all;
+	}
+	.u-scroll-bar {
+		position: absolute;
+		bottom: 4rpx;
+	}
 </style>
--- a/uview/components/u-tabs/u-tabs.vue
+++ b/uview/components/u-tabs/u-tabs.vue
@@ -4,275 +4,318 @@
 	}">
 		<scroll-view scroll-x class="u-scroll-view" :scroll-left="scrollLeft" scroll-with-animation>
 			<view class="u-scroll-box" :class="{'u-tabs-scorll-flex': !isScroll}">
-				<view
+				<view class="u-tab-item" :id="'u-tab-item-' + index" v-for="(item, index) in list" :key="index" @tap="clickTab(index)"
-					class="u-tab-item"
+				 :style="[tabItemStyle(index)]">
-					:id="'u-tab-item-' + index"
-					v-for="(item, index) in list"
-					:key="index"
-					@tap="clickTab(index)"
-					:style="[tabItemStyle(index)]"
-				>
 					{{ item[name] || item['name']}}
 				</view>
-				<view class="u-tab-bar" :style="[tabBarStyle]"></view>
+				<view v-if="showBar" class="u-tab-bar" :style="[tabBarStyle]"></view>
 			</view>
 		</scroll-view>
 	</view>
 </template>
 <script>
-export default {
+	/**
-	props: {
+	 * tabs 标签
-		// 导航菜单是否需要滚动，如只有2或者3个的时候，就不需要滚动了，此时使用flex平分tab的宽度
+	 * @description 该组件，是一个tabs标签组件，在标签多的时候，可以配置为左右滑动，标签少的时候，可以禁止滑动。 该组件的一个特点是配置为滚动模式时，激活的tab会自动移动到组件的中间位置。 
-		isScroll: {
+	 * @tutorial https://www.uviewui.com/components/tabs.html
-			type: Boolean,
+	 * @property {Boolean} is-scroll tabs是否可以左右拖动（默认true）
-			default: true
+	 * @property {Array} list 标签数组，元素为对象，如[{name: '推荐'}]
-		},
+	 * @property {String Number} current 指定哪个tab为激活状态（默认0）
-		//需循环的标签列表
+	 * @property {String Number} height 导航栏的高度，单位rpx（默认80）
-		list: {
+	 * @property {String Number} font-size tab文字大小，单位rpx（默认30）
-			type: Array,
+	 * @property {String Number} duration 滑块移动一次所需的时间，单位秒（默认0.5）
-			default() {
+	 * @property {String} active-color 滑块和激活tab文字的颜色（默认#2979ff）
-				return [];
+	 * @property {String} inactive-color tabs文字颜色（默认#303133）
+	 * @property {String Number} bar-width 滑块宽度，单位rpx（默认40）
+	 * @property {Object} active-item-style 活动tabs item的样式，对象形式
+	 * @property {Object} bar-style 底部滑块的样式，对象形式
+	 * @property {Boolean} show-bar 是否显示底部的滑块（默认true）
+	 * @property {String Number} bar-height 滑块高度，单位rpx（默认6）
+	 * @property {String Number} gutter 单个tab标签的左右内边距之和，单位rpx（默认40）
+	 * @property {String} bg-color tabs导航栏的背景颜色（默认#ffffff）
+	 * @property {String} name 组件内部读取的list参数中的属性名，见官网说明（默认name）
+	 * @property {Boolean} bold 激活选项的字体是否加粗（默认true）
+	 * @event {Function} change 点击标签时触发
+	 * @example <u-tabs ref="tabs" :list="list" :is-scroll="false"></u-tabs>
+	 */
+	export default {
+		name: "u-tabs",
+		props: {
+			// 导航菜单是否需要滚动，如只有2或者3个的时候，就不需要滚动了，此时使用flex平分tab的宽度
+			isScroll: {
+				type: Boolean,
+				default: true
+			},
+			//需循环的标签列表
+			list: {
+				type: Array,
+				default () {
+					return [];
+				}
+			},
+			// 当前活动tab的索引
+			current: {
+				type: Number,
+				default: 0
+			},
+			// 导航栏的高度和行高
+			height: {
+				type: [String, Number],
+				default: 80
+			},
+			// 字体大小
+			fontSize: {
+				type: [String, Number],
+				default: 30
+			},
+			// 过渡动画时长, 单位ms
+			duration: {
+				type: [String, Number],
+				default: 0.5
+			},
+			// 选中项的主题颜色
+			activeColor: {
+				type: String,
+				default: '#2979ff'
+			},
+			// 未选中项的颜色
+			inactiveColor: {
+				type: String,
+				default: '#303133'
+			},
+			// 菜单底部移动的bar的宽度，单位rpx
+			barWidth: {
+				type: [String, Number],
+				default: 40
+			},
+			// 移动bar的高度
+			barHeight: {
+				type: [String, Number],
+				default: 6
+			},
+			// 单个tab的左或有内边距（左右相同）
+			gutter: {
+				type: [String, Number],
+				default: 30
+			},
+			// 导航栏的背景颜色
+			bgColor: {
+				type: String,
+				default: '#ffffff'
+			},
+			// 读取传入的数组对象的属性
+			name: {
+				type: String,
+				default: 'name'
+			},
+			// 活动tab字体是否加粗
+			bold: {
+				type: Boolean,
+				default: true
+			},
+			// 当前活动tab item的样式
+			activeItemStyle: {
+				type: Object,
+				default() {
+					return {}
+				}
+			},
+			// 是否显示底部的滑块
+			showBar: {
+				type: Boolean,
+				default: true
+			},
+			// 底部滑块的自定义样式
+			barStyle: {
+				type: Object,
+				default() {
+					return {}
+				}
 			}
 		},
-		// 当前活动tab的索引
+		data() {
-		current: {
+			return {
-			type: Number,
+				scrollLeft: 0, // 滚动scroll-view的左边滚动距离
-			default: 0
+				tabQueryInfo: [], // 存放对tab菜单查询后的节点信息
-		},
+				componentWidth: 0, // 屏幕宽度，单位为px
-		// 导航栏的高度和行高
+				scrollBarLeft: 0, // 移动bar需要通过translateX()移动的距离
-		height: {
+				parentLeft: 0, // 父元素(tabs组件)到屏幕左边的距离
-			type: [String, Number],
+				id: this.$u.guid(), // id值
-			default: 80
+				currentIndex: this.current,
-		},
+			};
-		// 字体大小
-		fontSize: {
-			type: [String, Number],
-			default: 30
-		},
-		// 过渡动画时长, 单位ms
-		duration: {
-			type: [String, Number],
-			default: 0.5
-		},
-		// 选中项的主题颜色
-		activeColor: {
-			type: String,
-			default: '#2979ff'
-		},
-		// 未选中项的颜色
-		inactiveColor: {
-			type: String,
-			default: '#303133'
-		},
-		// 菜单底部移动的bar的宽度，单位rpx
-		barWidth: {
-			type: [String, Number],
-			default: 40
-		},
-		// 移动bar的高度
-		barHeight: {
-			type: [String, Number],
-			default: 6
-		},
-		// 单个tab的左或有内边距（左右相同）
-		gutter: {
-			type: [String, Number],
-			default: 30
-		},
-		// 导航栏的背景颜色
-		bgColor: {
-			type: String,
-			default: '#ffffff'
-		},
-		// 读取传入的数组对象的属性
-		name: {
-			type: String,
-			default: 'name'
-		},
-		// 活动tab字体是否加粗
-		bold: {
-			type: Boolean,
-			default: true
-		}
-	},
-	data() {
-		return {
-			scrollLeft: 0, // 滚动scroll-view的左边滚动距离
-			tabQueryInfo: [], // 存放对tab菜单查询后的节点信息
-			componentWidth: 0, // 屏幕宽度，单位为px
-			scrollBarLeft: 0 ,// 移动bar需要通过translateX()移动的距离
-			parentLeft: 0, // 父元素(tabs组件)到屏幕左边的距离
-			id: this.$u.guid(), // id值
-			currentIndex: this.current,
-		};
-	},
-	watch: {
-		// 监听tab的变化，重新计算tab菜单的布局信息，因为实际使用中菜单可能是通过
-		// 后台获取的（如新闻app顶部的菜单），获取返回需要一定时间，所以list变化时，重新获取布局信息
-		list(n, o) {
-			// 用$nextTick等待视图更新完毕后再计算tab的局部信息，否则可能因为tab还没生成就获取，就会有问题
-			this.$nextTick(() => {
-				this.init();
-			});
 		},
-		current: {
+		watch: {
-			immediate: true,
+			// 监听tab的变化，重新计算tab菜单的布局信息，因为实际使用中菜单可能是通过
-			handler(nVal) {
+			// 后台获取的（如新闻app顶部的菜单），获取返回需要一定时间，所以list变化时，重新获取布局信息
-				// 视图更新后再执行移动操作
+			list(n, o) {
+				// 用$nextTick等待视图更新完毕后再计算tab的局部信息，否则可能因为tab还没生成就获取，就会有问题
 				this.$nextTick(() => {
-					this.currentIndex = nVal;
+					this.init();
-					this.scrollByIndex();
 				});
-			}
+			},
-		},
+			current: {
-	},
+				immediate: true,
-	computed: {
+				handler(nVal) {
-		// 移动bar的样式
+					// 视图更新后再执行移动操作
-		tabBarStyle() {
+					this.$nextTick(() => {
-			return {
+						this.currentIndex = nVal;
-				width: this.barWidth + 'rpx',
+						this.scrollByIndex();
-				transform: `translate(${this.scrollBarLeft}px, -100%)`,
+					});
-				'transition-duration': `${this.duration}s`,
+				}
-				'background-color': this.activeColor,
+			},
-				height: this.barHeight + 'rpx',
-				// 设置一个很大的值，它会自动取能用的最大值，不用高度的一半，是因为高度可能是单数，会有小数出现
-				'border-radius': `${this.barHeight / 2}px`
-			};
 		},
-		// tab的样式
+		computed: {
-		tabItemStyle() {
+			// 移动bar的样式
-			return (index) => {
+			tabBarStyle() {
 				let style = {
-					height: this.height + 'rpx',
+					width: this.barWidth + 'rpx',
-					'line-height': this.height + 'rpx',
+					transform: `translate(${this.scrollBarLeft}px, -100%)`,
-					'font-size': this.fontSize + 'rpx',
 					'transition-duration': `${this.duration}s`,
-					padding: this.isScroll ? `0 ${this.gutter}rpx` : '',
+					'background-color': this.activeColor,
+					height: this.barHeight + 'rpx',
+					// 设置一个很大的值，它会自动取能用的最大值，不用高度的一半，是因为高度可能是单数，会有小数出现
+					'border-radius': `${this.barHeight / 2}px`
 				};
-				// 字体加粗
+				Object.assign(style, this.barStyle);
-				if (index == this.currentIndex && this.bold) style.fontWeight = 'bold';
-				if(index == this.currentIndex) {
-					style.color = this.activeColor;
-				} else {
-					style.color = this.inactiveColor;
-				}
 				return style;
+			},
+			// tab的样式
+			tabItemStyle() {
+				return (index) => {
+					let style = {
+						height: this.height + 'rpx',
+						'line-height': this.height + 'rpx',
+						'font-size': this.fontSize + 'rpx',
+						'transition-duration': `${this.duration}s`,
+						padding: this.isScroll ? `0 ${this.gutter}rpx` : '',
+					};
+					// 字体加粗
+					if (index == this.currentIndex && this.bold) style.fontWeight = 'bold';
+					if (index == this.currentIndex) {
+						style.color = this.activeColor;
+						// 给选中的tab item添加外部自定义的样式
+						style = Object.assign(style, this.activeItemStyle);
+					} else {
+						style.color = this.inactiveColor;
+					}
+					return style;
+				}
 			}
-		}
-	},
-	methods: {
-		// 设置一个init方法，方便多处调用
-		async init() {
-			// 获取tabs组件的尺寸信息
-			let tabRect = await this.$uGetRect('#' + this.id);
-			// tabs组件距离屏幕左边的宽度
-			this.parentLeft = tabRect.left;
-			// tabs组件的宽度
-			this.componentWidth = tabRect.width;
-			this.getTabRect();
-		},
-		// 点击某一个tab菜单
-		clickTab(index) {
-			// 发送事件给父组件
-			this.$emit('change', index);
 		},
-		// 查询tab的布局信息
+		methods: {
-		getTabRect() {
+			// 设置一个init方法，方便多处调用
-			// 创建节点查询
+			async init() {
-			let query = uni.createSelectorQuery().in(this);
+				// 获取tabs组件的尺寸信息
-			// 历遍所有tab，这里是执行了查询，最终使用exec()会一次性返回查询的数组结果
+				let tabRect = await this.$uGetRect('#' + this.id);
-			for (let i = 0; i < this.list.length; i++) {
+				// tabs组件距离屏幕左边的宽度
-				// 只要size和rect两个参数
+				this.parentLeft = tabRect.left;
-				query.select(`#u-tab-item-${i}`).fields({
+				// tabs组件的宽度
-					size: true,
+				this.componentWidth = tabRect.width;
-					rect: true
+				this.getTabRect();
-				});
+			},
+			// 点击某一个tab菜单
+			clickTab(index) {
+				// 发送事件给父组件
+				this.$emit('change', index);
+			},
+			// 查询tab的布局信息
+			getTabRect() {
+				// 创建节点查询
+				let query = uni.createSelectorQuery().in(this);
+				// 历遍所有tab，这里是执行了查询，最终使用exec()会一次性返回查询的数组结果
+				for (let i = 0; i < this.list.length; i++) {
+					// 只要size和rect两个参数
+					query.select(`#u-tab-item-${i}`).fields({
+						size: true,
+						rect: true
+					});
+				}
+				// 执行查询，一次性获取多个结果
+				query.exec(
+					function(res) {
+						this.tabQueryInfo = res;
+						// 初始化滚动条和移动bar的位置
+						this.scrollByIndex();
+					}.bind(this)
+				);
+			},
+			// 滚动scroll-view，让活动的tab处于屏幕的中间位置
+			scrollByIndex() {
+				// 当前活动tab的布局信息，有tab菜单的width和left(为元素左边界到父元素左边界的距离)等信息
+				let tabInfo = this.tabQueryInfo[this.currentIndex];
+				if (!tabInfo) return;
+				// 活动tab的宽度
+				let tabWidth = tabInfo.width;
+				// 活动item的左边到tabs组件左边的距离，用item的left减去tabs的left
+				let offsetLeft = tabInfo.left - this.parentLeft;
+				// 将活动的tabs-item移动到屏幕正中间，实际上是对scroll-view的移动
+				let scrollLeft = offsetLeft - (this.componentWidth - tabWidth) / 2;
+				this.scrollLeft = scrollLeft < 0 ? 0 : scrollLeft;
+				// 当前活动item的中点点到左边的距离减去滑块宽度的一半，即可得到滑块所需的移动距离
+				let left = tabInfo.left + tabInfo.width / 2 - this.parentLeft;
+				// 计算当前活跃item到组件左边的距离
+				this.scrollBarLeft = left - uni.upx2px(this.barWidth) / 2;
 			}
-			// 执行查询，一次性获取多个结果
-			query.exec(
-				function(res) {
-					this.tabQueryInfo = res;
-					// 初始化滚动条和移动bar的位置
-					this.scrollByIndex();
-				}.bind(this)
-			);
 		},
-		// 滚动scroll-view，让活动的tab处于屏幕的中间位置
+		mounted() {
-		scrollByIndex() {
+			this.init();
-			// 当前活动tab的布局信息，有tab菜单的width和left(为元素左边界到父元素左边界的距离)等信息
-			let tabInfo = this.tabQueryInfo[this.currentIndex];
-			if (!tabInfo) return;
-			// 活动tab的宽度
-			let tabWidth = tabInfo.width;
-			// 活动item的左边到tabs组件左边的距离，用item的left减去tabs的left
-			let offsetLeft = tabInfo.left - this.parentLeft;
-			// 将活动的tabs-item移动到屏幕正中间，实际上是对scroll-view的移动
-			let scrollLeft = offsetLeft - (this.componentWidth - tabWidth) / 2;
-			this.scrollLeft = scrollLeft < 0 ? 0 : scrollLeft;
-			// 当前活动item的中点点到左边的距离减去滑块宽度的一半，即可得到滑块所需的移动距离
-			let left = tabInfo.left + tabInfo.width / 2 - this.parentLeft;
-			// 计算当前活跃item到组件左边的距离
-			this.scrollBarLeft = left - uni.upx2px(this.barWidth) / 2;
 		}
-	},
+	};
-	mounted() {
-		this.init();
-	}
-};
 </script>
 <style lang="scss">
-view,
+	view,
-scroll-view {
+	scroll-view {
-	box-sizing: border-box;
+		box-sizing: border-box;
-}
+	}
-::-webkit-scrollbar,
+	::-webkit-scrollbar,
-::-webkit-scrollbar,
+	::-webkit-scrollbar,
-::-webkit-scrollbar {
+	::-webkit-scrollbar {
-	display: none;
+		display: none;
-	width: 0 !important;
+		width: 0 !important;
-	height: 0 !important;
+		height: 0 !important;
-	-webkit-appearance: none;
+		-webkit-appearance: none;
-	background: transparent;
+		background: transparent;
-}
+	}
-.u-scroll-box {
+	.u-scroll-box {
-	position: relative;
+		position: relative;
-}
+	}
-/* #ifdef H5 */
+	/* #ifdef H5 */
-// 通过样式穿透，隐藏H5下，scroll-view下的滚动条
+	// 通过样式穿透，隐藏H5下，scroll-view下的滚动条
-scroll-view /deep/ ::-webkit-scrollbar {
+	scroll-view /deep/ ::-webkit-scrollbar {
-	display: none;
+		display: none;
-	width: 0 !important;
+		width: 0 !important;
-	height: 0 !important;
+		height: 0 !important;
-	-webkit-appearance: none;
+		-webkit-appearance: none;
-	background: transparent;
+		background: transparent;
-}
+	}
-/* #endif */
-.u-scroll-view {
+	/* #endif */
-	width: 100%;
-	white-space: nowrap;
-	position: relative;
-}
-.u-tab-item {
+	.u-scroll-view {
-	position: relative;
+		width: 100%;
-	display: inline-block;
+		white-space: nowrap;
-	text-align: center;
+		position: relative;
-	transition-property: background-color, color;
+	}
-}
-.u-tab-bar {
+	.u-tab-item {
-	position: absolute;
+		position: relative;
-	bottom: 0;
+		display: inline-block;
-}
+		text-align: center;
+		transition-property: background-color, color;
+	}
+	.u-tab-bar {
+		position: absolute;
+		bottom: 0;
+	}
-.u-tabs-scorll-flex {
+	.u-tabs-scorll-flex {
-	display: flex;
+		display: flex;
-	justify-content: space-between;
+		justify-content: space-between;
-}
+	}
 </style>
--- a/uview/components/u-tag/u-tag.vue
+++ b/uview/components/u-tag/u-tag.vue
@@ -14,7 +14,27 @@
 </template>
 <script>
+	/**
+	 * tag 提示
+	 * @description 该组件一般用于标记和选择
+	 * @tutorial https://www.uviewui.com/components/tag.html
+	 * @property {String} type 主题类型（默认primary）
+	 * @property {String} size 标签大小（默认default）
+	 * @property {String} shape 标签形状（默认square）
+	 * @property {String} text 标签的文字内容
+	 * @property {String} bg-color 自定义标签的背景颜色
+	 * @property {String} border-color 标签的边框颜色
+	 * @property {String} close-color 关闭按钮的颜色
+	 * @property {String Number} index 点击标签时，会通过click事件返回该值
+	 * @property {String} mode 模式选择，见官网说明（默认light）
+	 * @property {Boolean} closeable 是否可关闭，设置为true，文字右边会出现一个关闭图标（默认false）
+	 * @property {Boolean} show 标签显示与否（默认true）
+	 * @event {Function} click 点击标签触发
+	 * @event {Function} close closeable为true时，点击标签关闭按钮触发
+	 * @example <u-tag text="雪月夜" type="success" />
+	 */
 	export default {
+		name: 'u-tag',
 		// 是否禁用这个标签，禁用的话，会屏蔽点击事件
 		props: {
 			// 标签类型info、primary、success、warning、error

--- a/uview/components/u-td/u-td.vue
+++ b/uview/components/u-td/u-td.vue
@@ -5,7 +5,15 @@
 </template>
 <script>
+	/**
+	 * td td单元格
+	 * @description 表格组件一般用于展示大量结构化数据的场景（搭配u-table使用）
+	 * @tutorial https://www.uviewui.com/components/table.html#td-props
+	 * @property {String Number} width 单元格宽度百分比或者具体带单位的值，如30%， 200rpx等，一般使用百分比，单元格宽度默认为均分tr的长度（默认auto）
+	 * @example <u-td>二年级</u-td>
+	 */
 	export default {
+		name: "u-td",
 		props: {
 			// 宽度，百分比或者具体带单位的值，如30%， 200rpx等，一般使用百分比
 			width: {
@@ -25,12 +33,12 @@
 			}
 		},
 		created() {
 		},
 		computed: {
 			tdStyle() {
 				let style = {};
-				if(this.width != "auto") style.flex = `0 0 ${this.width}`;
+				if (this.width != "auto") style.flex = `0 0 ${this.width}`;
 				style.textAlign = this.uTable.align;
 				style.padding = this.tr.length == 0 ? this.uTable.padding : 0;
 				style.borderBottom = this.tr.length == 0 ? `solid 1px ${this.uTable.borderColor}` : 0;
@@ -54,7 +62,7 @@
 		align-self: stretch;
 		box-sizing: border-box;
 	}
 	.u-col-1 {
 		flex: 0 0 calc(100%/12);
 	}

--- a/uview/components/u-th/u-th.vue
+++ b/uview/components/u-th/u-th.vue
@@ -5,7 +5,15 @@
 </template>
 <script>
+	/**
+	 * th th单元格
+	 * @description 表格组件一般用于展示大量结构化数据的场景（搭配u-table使用）
+	 * @tutorial https://www.uviewui.com/components/table.html#td-props
+	 * @property {String Number} width 标题单元格宽度百分比或者具体带单位的值，如30%，200rpx等，一般使用百分比，单元格宽度默认为均分tr的长度
+	 * @example 暂无示例
+	 */
 	export default {
+		name: "u-th",
 		props: {
 			// 宽度，百分比或者具体带单位的值，如30%， 200rpx等，一般使用百分比
 			width: {
@@ -15,14 +23,14 @@
 		},
 		data() {
 			return {
 			};
 		},
 		inject: ['uTable'],
 		computed: {
 			thStyle() {
 				let style = {};
-				if(this.width) style.flex = `0 0 ${this.width}%`;
+				if (this.width) style.flex = `0 0 ${this.width}%`;
 				style.textAlign = this.uTable.align;
 				style.padding = this.uTable.padding;
 				style.borderBottom = `solid 1px ${this.uTable.borderColor}`;

--- a/uview/components/u-time-line-item/u-time-line-item.vue
+++ b/uview/components/u-time-line-item/u-time-line-item.vue
@@ -11,7 +11,16 @@
 </template>
 <script>
+	/**
+	 * timeLineItem 时间轴Item
+	 * @description 时间轴组件一般用于物流信息展示，各种跟时间相关的记录等场景。(搭配u-time-line使用)
+	 * @tutorial https://www.uviewui.com/components/timeLine.html
+	 * @property {String} bg-color 左边节点的背景颜色，一般通过slot内容自定义背景颜色即可（默认#ffffff）
+	 * @property {String Number} node-top 节点左边图标绝对定位的top值，单位rpx
+	 * @example <u-time-line-item node-top="2">...</u-time-line-item>
+	 */
 	export default {
+		name: "u-time-line-item",
 		props: {
 			// 节点的背景颜色
 			bgColor: {
@@ -34,7 +43,7 @@
 				let style = {
 					backgroundColor: this.bgColor,
 				};
-				if(this.nodeTop != "") style.top = this.nodeTop + 'rpx';
+				if (this.nodeTop != "") style.top = this.nodeTop + 'rpx';
 				return style;
 			}
 		}
@@ -49,7 +58,7 @@
 		position: relative;
 		margin-bottom: 32rpx;
 	}
 	.u-time-axis-node {
 		position: absolute;
 		top: 12rpx;
@@ -62,7 +71,7 @@
 		z-index: 100;
 		font-size: 24rpx;
 	}
 	.u-dot {
 		height: 16rpx;
 		width: 16rpx;

--- a/uview/components/u-time-line/u-time-line.vue
+++ b/uview/components/u-time-line/u-time-line.vue
@@ -5,10 +5,17 @@
 </template>
 <script>
+	/**
+	 * timeLine 时间轴
+	 * @description 时间轴组件一般用于物流信息展示，各种跟时间相关的记录等场景。
+	 * @tutorial https://www.uviewui.com/components/timeLine.html
+	 * @example <u-time-line></u-time-line>
+	 */
 	export default {
+		name: "u-time-line",
 		data() {
 			return {
 			}
 		}
 	}
@@ -19,7 +26,7 @@
 		padding-left: 40rpx;
 		position: relative;
 	}
 	.u-time-axis::before {
 		content: " ";
 		position: absolute;

--- a/uview/components/u-toast/u-toast.vue
+++ b/uview/components/u-toast/u-toast.vue
--- a/uview/components/u-top-tips/u-top-tips.vue
+++ b/uview/components/u-top-tips/u-top-tips.vue
--- a/uview/components/u-tr/u-tr.vue
+++ b/uview/components/u-tr/u-tr.vue
--- a/uview/components/u-upload/u-upload.vue
+++ b/uview/components/u-upload/u-upload.vue
--- a/uview/components/u-verification-code/u-verification-code.vue
+++ b/uview/components/u-verification-code/u-verification-code.vue
--- a/uview/components/u-waterfall/u-waterfall.vue
+++ b/uview/components/u-waterfall/u-waterfall.vue
--- a/uview/index.js
+++ b/uview/index.js
--- a/uview/libs/config/config.js
+++ b/uview/libs/config/config.js
--- a/uview/libs/function/test.js
+++ b/uview/libs/function/test.js
--- a/uview/libs/request/index.js
+++ b/uview/libs/request/index.js