<template>
  <s-any-select v-model="modelValue1"
                :component="ElRate"
                placeholder="请选择"
                :options="options" />
  <s-any-select v-model="modelValue2"
                :component="ElSlider"
                placeholder="请选择"
                :options="optionsSlider" />
</template>

<script lang='ts' setup>
import { ref } from 'vue'
import { ElRate, ElSlider } from 'element-plus'

const modelValue1 = ref(3)
const modelValue2 = ref(50)
const options = [
  {
    props: { disabled: true },
    value: 3
  },
  {
    props: { disabled: true },
    value: 5
  }
]

const optionsSlider = [
  {
    props: { disabled: true },
    value: 50
  },
  {
    props: { disabled: true },
    value: 70
  }
]
</script>
<style scoped lang='scss'>
.sel-any-select {
  margin-bottom: 20px;
}
</style>
