@minix-iot/ui/dist/packages/sliderscale/sliderscale.jsx

基于Vue的移动端轻量级UI组件库

import { Namespace } from "../../utils/namespace";

const namespace = Namespace.Create('slider-scale')

export default {
    name: namespace.name,
    props:{
        value:{
            type: Number
        }
    },
    computed:{
        cls(){
            return namespace.derive({
                'first-child':this.value == this.$parent.min,
                'last-child': this.value == this.$parent.max
            })
        },
        style(){
            const style ={}
            const percent = (this.value - this.$parent.min) / this.$parent.scope * 100
            style.left = `${percent}%`
            return style
        }
    },
    render(){
        return <div class={this.cls} style={this.style}>{this.$slots.default}</div>
    }
}