# timepicker日期选择器

# 初始化

单独引用时：从入口的js文件引入

import { SsTimePicker } from '@xiaoe/sense'
import { SsTimeSelect } from '@xiaoe/sense'
import '@xiaoe/sense/static/index.css'
Vue.use(SsTimePicker)
Vue.use(SsTimeSelect)

1
2
3
4
5

# 时间选择

<ss-time-picker
    v-model="value">
</ss-time-picker>
<script>
date() {
    return {
        value:''
    }
}
</script>

1
2
3
4
5
6
7
8
9
10

# 可选时间段

<ss-time-picker
    v-model='value'
    :picker-options="{
        selectableRange:'18:30:00 - 20:30:00'
    }"
    placeholder="选择时间"
>
</ss-time-picekr>
<script>
data() {
    return {
        value:''
    }
}
    </script>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

# 时间范围选择

<ss-time-picker
    v-model="value"
    is range
    range-separator="至"
    start-placeholder="开始时间"
    end-placeholder="结束时间"
    placeholder="选择时间范围">
</ss-time-picker>
<script>
date() {
    return {
        value:''
    }
}
</script>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

参数	说明	类型	默认值	可选值
value	绑定值	date(TimePicker), string(TimeSelect)	—	—
disabled	禁用	boolean	false	—
start-placeholder	开始时间的占位内容	string	—	—
end-placeholder	结束时间的占位内容	string	—	—
is-range	范围选择	boolean	false	—
picker-options	参考选项的列表	Object	{}	—

# pickerOption

参数	说明	类型	默认值	可选值
selectableRange	可选择时间段	string/array	—	—

← datePicker日期选择器 Form 表单 →