介绍
本文档描述了 ShadcnSlider 组件的特性和使用方法。
用法
查看代码
vue
<template>
<ShadcnSlider v-model="value" />
</template>最小值 (min)
查看代码
vue
<template>
<ShadcnSlider v-model="value" :min="0" />
</template>最大值 (max)
查看代码
vue
<template>
<ShadcnSlider v-model="value" :max="10" />
</template>间隔 (step)
查看代码
vue
<template>
<ShadcnSlider v-model="value" :step="10" />
</template>显示提示 (show-tip)
查看代码
vue
<template>
<ShadcnSlider v-model="value" showTip />
<ShadcnSlider v-model="value" :showTip="false" />
</template>显示间隔 (show-step)
查看代码
vue
<template>
<ShadcnSlider v-model="value" showStep />
<ShadcnSlider v-model="value" :showStep="false" />
</template>禁用 (disabled)
查看代码
vue
<template>
<ShadcnSlider v-model="value" disabled />
<ShadcnSlider v-model="value" :disabled="false" />
</template>类型 (type)
查看代码
vue
<template>
<ShadcnSlider v-model="value" type="primary" />
<ShadcnSlider v-model="value" type="warning" />
<ShadcnSlider v-model="value" type="success" />
<ShadcnSlider v-model="value" type="error" />
</template>