时间轴の插槽

5/23/2022

此部分为单独时间轴timeLine 插槽 的介绍

# 刻度条的插槽 : step

# 参数字段

  • {number | string} label 标签
  • {number} pos 在组件中的位置,按百分比计算
  • {number | string} value 滑块的值
  • {boolean} active 是否处于激活状态

# 用法

<template v-slot:step="{ obj }">
  <div class="custom-step">{{ obj.value }}</div>
</template>
1
2
3

# 数字Label的插槽 : label

# 参数字段

  • {number | string} label 标签
  • {number} pos 在组件中的位置,按百分比计算
  • {number | string} value 滑块的值
  • {boolean} active 是否处于激活状态

# 用法

<template v-slot:label="{ obj }">
  <div class="custom-label">{{ obj.value }}</div>
</template>
1
2
3

# 工具提示条的插槽 : tooltip

# 参数字段

  • {number} pos 在组件中的位置,按百分比计算
  • {number} index 滑块的索引
  • {number | string} value 滑块的值
  • {boolean} focus 是否处于焦点状态
  • {boolean} disabled 是否处于禁用状态

# 用法

<template v-slot:label="{ obj }">
  <div class="custom-tooltip">{{ obj.value }}</div>
</template>
1
2
3

# 当前点的插槽 : dot

# 参数字段

  • {number} pos 在组件中的位置,按百分比计算
  • {number} index 滑块的索引
  • {number | string} value 滑块的值
  • {boolean} focus 是否处于焦点状态
  • {boolean} disabled 是否处于禁用状态

# 用法

<template v-slot:dot="{ obj }">
  <div class="custom-label">{{ obj.value }}</div>
</template>
1
2
3
Last Updated: 5/25/2022, 3:56:30 PM