滑块 Slider

示例

基本形式

<div class="g-row">
    <div class="g-col g-col-6"><slider /></div>
    <div class="g-col g-col-6"><slider value=20 /></div>
</div>

只读和禁用

<div class="g-row">
    <div class="g-col g-col-6"><slider value=20 readonly /></div>
    <div class="g-col g-col-6"><slider value=20 disabled /></div>
</div>

最大值和最小值

<slider value={value} min=10 max=50 />
<p>{value}</p>

连续和间隔

<div class="g-row">
    <div class="g-col g-col-6"><slider /></div>
    <div class="g-col g-col-6"><slider step=20 /></div>
</div>

事件

<slider on-change={console.log('on-change', '$event.value', $event.value)} />

API

Class

Slider

继承自。

Options

new Slider()

参数	类型	默认值	数据流向	描述
`data`	Object			绑定属性
`data.value`	number	`0`	outside <=> inside	数值
`data.min`	number	`0`	outside <=> inside	最小值
`data.max`	number	`100`	outside <=> inside	最大值
`data.step`	number	`0`	outside <=> inside	间隔
`data.readonly`	boolean	`false`	outside => inside	是否只读
`data.disabled`	boolean	`false`	outside => inside	是否禁用
`data.visible`	boolean	`true`	outside => inside	是否显示
`data.class`	string	`''`	outside => inside	补充class