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.
134 lines
3.9 KiB
134 lines
3.9 KiB
import _toConsumableArray from '@babel/runtime/helpers/esm/toConsumableArray';
|
|
import _objectSpread from '@babel/runtime/helpers/esm/objectSpread';
|
|
import _classCallCheck from '@babel/runtime/helpers/esm/classCallCheck';
|
|
import _createClass from '@babel/runtime/helpers/esm/createClass';
|
|
import _possibleConstructorReturn from '@babel/runtime/helpers/esm/possibleConstructorReturn';
|
|
import _getPrototypeOf from '@babel/runtime/helpers/esm/getPrototypeOf';
|
|
import _inherits from '@babel/runtime/helpers/esm/inherits';
|
|
import React, { Component } from 'react';
|
|
|
|
var cached = {};
|
|
|
|
function registerModel(app, model) {
|
|
model = model.default || model;
|
|
|
|
if (!cached[model.namespace]) {
|
|
app.model(model);
|
|
cached[model.namespace] = 1;
|
|
}
|
|
}
|
|
|
|
var defaultLoadingComponent = function defaultLoadingComponent() {
|
|
return null;
|
|
};
|
|
|
|
function asyncComponent(config) {
|
|
var resolve = config.resolve;
|
|
return (
|
|
/*#__PURE__*/
|
|
function (_Component) {
|
|
_inherits(DynamicComponent, _Component);
|
|
|
|
function DynamicComponent() {
|
|
var _getPrototypeOf2;
|
|
|
|
var _this;
|
|
|
|
_classCallCheck(this, DynamicComponent);
|
|
|
|
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
args[_key] = arguments[_key];
|
|
}
|
|
|
|
_this = _possibleConstructorReturn(this, (_getPrototypeOf2 = _getPrototypeOf(DynamicComponent)).call.apply(_getPrototypeOf2, [this].concat(args)));
|
|
_this.LoadingComponent = config.LoadingComponent || defaultLoadingComponent;
|
|
_this.state = {
|
|
AsyncComponent: null
|
|
};
|
|
|
|
_this.load();
|
|
|
|
return _this;
|
|
}
|
|
|
|
_createClass(DynamicComponent, [{
|
|
key: "componentDidMount",
|
|
value: function componentDidMount() {
|
|
this.mounted = true;
|
|
}
|
|
}, {
|
|
key: "componentWillUnmount",
|
|
value: function componentWillUnmount() {
|
|
this.mounted = false;
|
|
}
|
|
}, {
|
|
key: "load",
|
|
value: function load() {
|
|
var _this2 = this;
|
|
|
|
resolve().then(function (m) {
|
|
var AsyncComponent = m.default || m;
|
|
|
|
if (_this2.mounted) {
|
|
_this2.setState({
|
|
AsyncComponent: AsyncComponent
|
|
});
|
|
} else {
|
|
_this2.state.AsyncComponent = AsyncComponent; // eslint-disable-line
|
|
}
|
|
});
|
|
}
|
|
}, {
|
|
key: "render",
|
|
value: function render() {
|
|
var AsyncComponent = this.state.AsyncComponent;
|
|
var LoadingComponent = this.LoadingComponent;
|
|
if (AsyncComponent) return React.createElement(AsyncComponent, this.props);
|
|
return React.createElement(LoadingComponent, this.props);
|
|
}
|
|
}]);
|
|
|
|
return DynamicComponent;
|
|
}(Component)
|
|
);
|
|
}
|
|
|
|
function dynamic(config) {
|
|
var app = config.app,
|
|
resolveModels = config.models,
|
|
resolveComponent = config.component;
|
|
return asyncComponent(_objectSpread({
|
|
resolve: config.resolve || function () {
|
|
var models = typeof resolveModels === 'function' ? resolveModels() : [];
|
|
var component = resolveComponent();
|
|
return new Promise(function (resolve) {
|
|
Promise.all([].concat(_toConsumableArray(models), [component])).then(function (ret) {
|
|
if (!models || !models.length) {
|
|
return resolve(ret[0]);
|
|
} else {
|
|
var len = models.length;
|
|
ret.slice(0, len).forEach(function (m) {
|
|
m = m.default || m;
|
|
|
|
if (!Array.isArray(m)) {
|
|
m = [m];
|
|
}
|
|
|
|
m.map(function (_) {
|
|
return registerModel(app, _);
|
|
});
|
|
});
|
|
resolve(ret[len]);
|
|
}
|
|
});
|
|
});
|
|
}
|
|
}, config));
|
|
}
|
|
|
|
dynamic.setDefaultLoadingComponent = function (LoadingComponent) {
|
|
defaultLoadingComponent = LoadingComponent;
|
|
};
|
|
|
|
export default dynamic;
|