CategorySelect 类别选择

基础用法

<template>
  <plv-category-select v-model="type">
    <plv-category-select-item label="列表" value="table" />
    <plv-category-select-item label="图标" value="chart" />
  </plv-category-select>
</template>

<script>
export default {
  data() {
    return {
      type: 'table',
    };
  }
};
</script>

显示代码

自定义颜色

<template>
  <plv-category-select
    v-model="type"
    normal-color="red"
    active-color="yellow"
  >
    <plv-category-select-item label="列表" value="table" />
    <plv-category-select-item label="图标" value="chart" />
  </plv-category-select>
</template>

<script>
export default {
  data() {
    return {
      type: 'table',
    };
  }
};
</script>

显示代码

CategorySelect Attributes

参数	说明	类型	可选值	默认值
value / v-model	绑定值	String	-	-
separator	分隔符	String	-	|
separator-color	分割符颜色	String	-	#E5E5E5
normal-color	默认状态颜色	String	-	#1D2129
active-color	选中状态颜色	String	-	#3F76FC
square	方块形状	Boolean	-	false

CategorySelectItem Attributes

参数	说明	类型	可选值	默认值
value	选项值	String	-	-
label	文本内容	String	-	-
disabled	是否禁用	Boolean	-	false

CategorySelectItem Slot

name	说明
—	内容插槽