You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
68 lines
1.4 KiB
68 lines
1.4 KiB
7 years ago
|
function defaultGetContainer () {
|
||
|
const container = document.createElement('div')
|
||
|
document.body.appendChild(container)
|
||
|
return container
|
||
|
}
|
||
|
|
||
|
export default function getContainerRenderMixin (config) {
|
||
|
const {
|
||
|
autoMount = true,
|
||
|
autoDestroy = true,
|
||
|
isVisible,
|
||
|
isForceRender,
|
||
|
getComponent,
|
||
|
getContainer = defaultGetContainer,
|
||
|
} = config
|
||
|
|
||
|
let mixin
|
||
|
if (autoMount) {
|
||
|
mixin = {
|
||
|
...mixin,
|
||
|
mounted () {
|
||
|
this.renderComponent()
|
||
|
},
|
||
|
}
|
||
|
}
|
||
|
|
||
|
if (autoDestroy) {
|
||
|
mixin = {
|
||
|
...mixin,
|
||
|
beforeDestroy () {
|
||
|
this.removeContainer()
|
||
|
},
|
||
|
}
|
||
|
}
|
||
|
mixin = {
|
||
|
...mixin,
|
||
|
methods: {
|
||
|
removeContainer () {
|
||
|
if (this._container) {
|
||
|
const container = this._container
|
||
|
container.parentNode.removeChild(container)
|
||
|
this._container = null
|
||
|
}
|
||
|
},
|
||
|
renderComponent (componentArg) {
|
||
|
if (
|
||
|
!isVisible || isVisible(this) ||
|
||
|
(isForceRender && isForceRender(this))
|
||
|
) {
|
||
|
if (!this._container) {
|
||
|
this._container = getContainer(this)
|
||
|
}
|
||
|
this._container.appendChild(this.$el)
|
||
|
}
|
||
|
let component
|
||
|
if (this.getComponent) {
|
||
|
component = this.getComponent(componentArg)
|
||
|
} else {
|
||
|
component = getComponent(this, componentArg)
|
||
|
}
|
||
|
this._component = component
|
||
|
},
|
||
|
},
|
||
|
}
|
||
|
|
||
|
return mixin
|
||
|
}
|