magiccube-vue3/package/components/label/index.js

vue3-js版组件库

const Label = {
    name: 'McLabel',
    props: {
        color: String,
        content: [String, Number],
        badge: Boolean
    },
    emits: [],
    setup(props, { emit }){
        return () => (
            <div class={{
                'mc-label': true,
                [`mc-label__color--${props.color}`]: props.color,
            }}>
                <span v-html={props.content}></span>
                {
                    props.badge? <i class="mc-label__badge"></i> : ''
                }
            </div>
        )
    }
}

Label.install = Vue => {
    Vue.component(Label.name, Label)
}

const McLabel = Label

export { McLabel, McLabel as default }