yyzone/src/components/base/loading/loading.js

yyzone vue components and utils

import Vue from 'vue'
import Loading from './loading.vue'

Loading.newInstance = properties => {
    const _props = properties || {}

    const Instance = new Vue({
        data: _props,
        render (h) {
            return h(Loading, {
                props: _props
            })
        },
        methods: {
            hide () {
                setTimeout(() => {
                    this.onRemove()
                    this.$el && this.$el.remove()
                }, 300)
            }
        }
    })

    const component = Instance.$mount()
    if(_props.target) {
        const _target = _props.target
        if (_target.nodeName) { // 如果传的是一个真实的dom节点
            _target.append(component.$el)
        } else {
            const _targetDom = document.querySelector(_target)
            _targetDom && _targetDom.appendChild(component.$el)
        }
    } else {
        document.body.appendChild(component.$el)
    }
    const loading = Instance.$children[0]
    return {
        component: loading,
        show (options) {
            loading.visible = true
            loading.instanceTheme = options && options.theme || 'dark'
        },
        hide () {
            loading.visible = false
            loading.$parent.hide()
        }
    }
}
export default Loading