Skip to content

Commit 9adac84

Browse files
authored
Merge pull request umicro#170 from YanxinNet/beiqiao
部分组件的doc编写
2 parents 4ed03bb + 23f256c commit 9adac84

File tree

5 files changed

+105
-0
lines changed

5 files changed

+105
-0
lines changed

uview-ui/components/u-calendar/u-calendar.vue

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -58,6 +58,37 @@
5858
</u-popup>
5959
</template>
6060
<script>
61+
/**
62+
* calendar 日历
63+
* @description 此组件用于单个选择日期,范围选择日期等,日历被包裹在底部弹起的容器中。
64+
* @tutorial http://uviewui.com/components/calendar.html
65+
* @property {String} mode 选择日期的模式,date-为单个日期,range-为选择日期范围
66+
* @property {Boolean} v-model 布尔值变量,用于控制日历的弹出与收起
67+
* @property {Boolean} safe-area-inset-bottom 是否开启底部安全区适配(默认false)
68+
* @property {Boolean} change-year 是否显示顶部的切换年份方向的按钮(默认true)
69+
* @property {Boolean} change-month 是否显示顶部的切换月份方向的按钮(默认true)
70+
* @property {String Number} max-year 可切换的最大年份(默认2050)
71+
* @property {String Number} min-year 最小可选日期(默认1950)
72+
* @property {String Number} min-date 可切换的最小年份(默认1950-01-01)
73+
* @property {String Number} max-date 最大可选日期(默认当前日期)
74+
* @property {String Number} 弹窗顶部左右两边的圆角值,单位rpx(默认20)
75+
* @property {Boolean} mask-close-able 是否允许通过点击遮罩关闭日历(默认true)
76+
* @property {String} month-arrow-color 月份切换按钮箭头颜色(默认#606266)
77+
* @property {String} year-arrow-color 年份切换按钮箭头颜色(默认#909399)
78+
* @property {String} color 日期字体的默认颜色(默认#303133)
79+
* @property {String} active-bg-color 起始/结束日期按钮的背景色(默认#2979ff)
80+
* @property {String Number} z-index 弹出时的z-index值(默认10075)
81+
* @property {String} active-color 起始/结束日期按钮的字体颜色(默认#ffffff)
82+
* @property {String} range-bg-color 起始/结束日期之间的区域的背景颜色(默认rgba(41,121,255,0.13))
83+
* @property {String} range-color 选择范围内字体颜色(默认#2979ff)
84+
* @property {String} start-text 起始日期底部的提示文字(默认 '开始')
85+
* @property {String} end-text 结束日期底部的提示文字(默认 '结束')
86+
* @property {String} btn-type 底部确定按钮的主题(默认 'primary')
87+
* @property {String} toolTip 顶部提示文字,如设置名为tooltip的slot,此参数将失效(默认 '选择日期')
88+
* @property {Boolean} closeable 是否显示右上角的关闭图标(默认true)
89+
* @example <u-calendar v-model="show" :mode="mode"></u-calendar>
90+
*/
91+
6192
export default {
6293
name: 'u-calendar',
6394
props: {

uview-ui/components/u-form-item/u-form-item.vue

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -46,6 +46,26 @@ import Emitter from '../../libs/util/emitter.js';
4646
import schema from '../../libs/util/async-validator';
4747
// 去除警告信息
4848
schema.warning = function(){};
49+
50+
/**
51+
* form-item 表单item
52+
* @description 此组件一般用于表单场景,可以配置Input输入框,Select弹出框,进行表单验证等。
53+
* @tutorial http://uviewui.com/components/form.html
54+
* @property {String} label 左侧提示文字
55+
* @property {Object} prop 表单域model对象的属性名,在使用 validate、resetFields 方法的情况下,该属性是必填的
56+
* @property {Boolean} border-bottom 是否显示表单域的下划线边框(默认true)
57+
* @property {String} label-position 表单域提示文字的位置,left-左侧,top-上方(默认left)
58+
* @property {String Number} label-width 提示文字的宽度,单位rpx(默认90)
59+
* @property {Object} label-style lable的样式,对象形式
60+
* @property {String} label-align lable的对齐方式(默认left)
61+
* @property {String} right-icon 右侧自定义字体图标(限uView内置图标)或图片地址
62+
* @property {String} left-icon 左侧自定义字体图标(限uView内置图标)或图片地址
63+
* @property {Object} left-icon-style 左侧图标的样式,对象形式
64+
* @property {Object} right-icon-style 右侧图标的样式,对象形式
65+
* @property {Boolean} required 是否显示左边的"*"号,这里仅起展示作用,如需校验必填,请通过rules配置必填规则(默认false)
66+
* @example <u-form-item label="姓名"><u-input v-model="form.name" /></u-form-item>
67+
*/
68+
4969
export default {
5070
name: 'u-form-item',
5171
mixins: [Emitter],

uview-ui/components/u-form/u-form.vue

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,16 @@
33
</template>
44

55
<script>
6+
7+
/**
8+
* form 表单
9+
* @description 此组件一般用于表单场景,可以配置Input输入框,Select弹出框,进行表单验证等。
10+
* @tutorial http://uviewui.com/components/form.html
11+
* @property {Object} model 表单数据对象
12+
* @property {Object} rules 通过ref设置,见官网说明
13+
* @property {Array} errorType 错误的提示方式,数组形式,见上方说明(默认['message'])
14+
* @example <u-form :model="form" ref="uForm"></u-form>
15+
*/
616
export default {
717
name: 'u-form',
818
props: {

uview-ui/components/u-input/u-input.vue

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -65,6 +65,30 @@
6565

6666
<script>
6767
import Emitter from '../../libs/util/emitter.js';
68+
69+
/**
70+
* input 输入框
71+
* @description 此组件为一个输入框,默认没有边框和样式,是专门为配合表单组件u-form而设计的,利用它可以快速实现表单验证,输入内容,下拉选择等功能。
72+
* @tutorial http://uviewui.com/components/input.html
73+
* @property {String} type 模式选择,见官网说明
74+
* @property {Boolean} clearable 是否显示右侧的清除图标(默认true)
75+
* @property {} v-model 用于双向绑定输入框的值
76+
* @property {String} input-align 输入框文字的对齐方式(默认left)
77+
* @property {String} placeholder placeholder显示值(默认 '请输入内容')
78+
* @property {Boolean} disabled 是否禁用输入框(默认false)
79+
* @property {String Number} maxlength 输入框的最大可输入长度(默认140)
80+
* @property {String} placeholderStyle placeholder的样式,字符串形式,如"color: red;"(默认 "color: #c0c4cc;")
81+
* @property {String} confirm-type 设置键盘右下角按钮的文字,仅在type为text时生效(默认done)
82+
* @property {Object} custom-style 自定义输入框的样式,对象形式
83+
* @property {Boolean} focus 是否自动获得焦点(默认false)
84+
* @property {Boolean} fixed 如果type为textarea,且在一个"position:fixed"的区域,需要指明为true(默认false)
85+
* @property {Boolean} password-icon type为password时,是否显示右侧的密码查看图标(默认true)
86+
* @property {Boolean} border 是否显示边框(默认false)
87+
* @property {String} border-color 输入框的边框颜色(默认#dcdfe6)
88+
* @property {Boolean} auto-height 是否自动增高输入区域,type为textarea时有效(默认true)
89+
* @property {String Number} height 高度,单位rpx(text类型时为70,textarea时为100)
90+
* @example <u-input v-model="value" :type="type" :border="border" />
91+
*/
6892
export default {
6993
name: 'u-input',
7094
mixins: [Emitter],

uview-ui/components/u-select/u-select.vue

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -50,6 +50,26 @@
5050
</template>
5151

5252
<script>
53+
/**
54+
* select 列选择器
55+
* @description 此选择器用于单列,多列,多列联动的选择场景。(从1.3.0版本起,不建议使用Picker组件的单列和多列模式,Select组件是专门为列选择而构造的组件,更简单易用。)
56+
* @tutorial http://uviewui.com/components/select.html
57+
* @property {String} mode 模式选择,"single-column"-单列模式,"mutil-column"-多列模式,"single-column-auto"-多列联动模式
58+
* @property {Array} list 列数据,数组形式,见官网说明
59+
* @property {Boolean} v-model 布尔值变量,用于控制选择器的弹出与收起
60+
* @property {Boolean} safe-area-inset-bottom 是否开启底部安全区适配(默认false)
61+
* @property {String} cancel-color 取消按钮的颜色(默认#606266)
62+
* @property {String} confirm-color 确认按钮的颜色(默认#2979ff)
63+
* @property {String} default-value 提供的默认选中的下标,见官网说明
64+
* @property {Boolean} mask-close-able 是否允许通过点击遮罩关闭Picker(默认true)
65+
* @property {String Number} z-index 弹出时的z-index值(默认10075)
66+
* @property {String} value-name 自定义list数据的value属性名 1.3.6
67+
* @property {String} label-name 自定义list数据的label属性名 1.3.6
68+
* @property {String} child-name 自定义list数据的children属性名,只对多列联动模式有效 1.3.7
69+
* @event {Function} confirm 点击确定按钮,返回当前选择的值
70+
* @example <u-select v-model="show" :list="list"></u-select>
71+
*/
72+
5373
export default {
5474
props: {
5575
// 列数据

0 commit comments

Comments
 (0)