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

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

import Popup from '../popup/popup.jsx';
import { Namespace } from '../../utils/namespace';

const namespace = Namespace.Create('modal');

export default {
    name: namespace.name,
    components: {
        Popup
    },
    props: {
        show: {
            type: Boolean,
            default: false
        },
        overlay: {
            type: Boolean,
            default: true
        },
        zIndex: {
            type: Number,
            default: 1030
        },
        lockScroll: {
            type: Boolean,
            default: false
        },
        duration: {
            type: Number,
            default: 0.36
        },
        overlayStyle: {
            type: Object,
            default: () => { }
        },
        round: {
            type: Boolean,
            default: false
        },
        closeOnClickOveraly: {
            type: Boolean,
            default: true
        }
    },
    computed: {
        cls() {
            const res = [namespace.derive()];
            return res;
        }
    },
    methods: {
        onClose() {
            this.$emit('close');
        }
    },
    render(){
        return (
            <Popup
                show={this.show}
                overlay={this.overlay}
                z-index={this.zIndex}
                lock-scroll={this.lockScroll}
                duration={this.duration}
                overlay-style={this.overlayStyle}
                round={this.round}
                vOn:close-on-click-overlay={this.closeOnClickOveraly}
                onClose={this.onClose}
                position="center"
            >
                <div class={this.cls}>
                    {this.$slots.default}
                </div>
            </Popup>
        )
    }
};