getContainerRenderMixin.js
3.64 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
import ReactDOM from 'react-dom';
function defaultGetContainer() {
var container = document.createElement('div');
document.body.appendChild(container);
return container;
}
export default function getContainerRenderMixin(config) {
var _config$autoMount = config.autoMount,
autoMount = _config$autoMount === void 0 ? true : _config$autoMount,
_config$autoDestroy = config.autoDestroy,
autoDestroy = _config$autoDestroy === void 0 ? true : _config$autoDestroy,
isVisible = config.isVisible,
isForceRender = config.isForceRender,
getComponent = config.getComponent,
_config$getContainer = config.getContainer,
getContainer = _config$getContainer === void 0 ? defaultGetContainer : _config$getContainer;
var mixin;
function _renderComponent(instance, componentArg, ready) {
if (!isVisible || instance._component || isVisible(instance) || isForceRender && isForceRender(instance)) {
if (!instance._container) {
instance._container = getContainer(instance);
}
var component;
if (instance.getComponent) {
component = instance.getComponent(componentArg);
} else {
component = getComponent(instance, componentArg);
}
ReactDOM.unstable_renderSubtreeIntoContainer(instance, component, instance._container, function callback() {
instance._component = this;
if (ready) {
ready.call(this);
}
});
}
}
if (autoMount) {
mixin = _objectSpread(_objectSpread({}, mixin), {}, {
componentDidMount: function componentDidMount() {
_renderComponent(this);
},
componentDidUpdate: function componentDidUpdate() {
_renderComponent(this);
}
});
}
if (!autoMount || !autoDestroy) {
mixin = _objectSpread(_objectSpread({}, mixin), {}, {
renderComponent: function renderComponent(componentArg, ready) {
_renderComponent(this, componentArg, ready);
}
});
}
function _removeContainer(instance) {
if (instance._container) {
var container = instance._container;
ReactDOM.unmountComponentAtNode(container);
container.parentNode.removeChild(container);
instance._container = null;
}
}
if (autoDestroy) {
mixin = _objectSpread(_objectSpread({}, mixin), {}, {
componentWillUnmount: function componentWillUnmount() {
_removeContainer(this);
}
});
} else {
mixin = _objectSpread(_objectSpread({}, mixin), {}, {
removeContainer: function removeContainer() {
_removeContainer(this);
}
});
}
return mixin;
}