How to use the @egjs/infinitegrid.DOMRenderer.renderItems function in @egjs/infinitegrid

_fitItems(base, margin = 0) {
		base > 0 && this._watcher.scrollBy(-base);
		this._items.fit(base, this.props.horizontal);
		DOMRenderer.renderItems(this._getVisibleItems());
		this._setContainerSize(false);
		base < 0 && this._watcher.scrollBy(-base);
	}
	// called by visible

items = ItemManager.pluck(groups, "items"),
		isAppend,
		isTrusted,
		fromCache,
		isLayout = false,
	}) {
		!isLayout && this._updateCursor();
		const viewSize = this._renderer.getViewSize();
		const size = this._getEdgeValue("end");
		const { useRecycle } = this.props;
		const watcher = this._watcher;
		const scrollPos = watcher.getScrollPos();

		if (!isAppend) {
			if (!this._fit()) {
				DOMRenderer.renderItems(items);
			}
		} else {
			!isLayout && DOMRenderer.renderItems(items);
			this._setContainerSize();
		}
		this.state.isFirstRender = false;
		if (useRecycle) {
			this._infinite.recycle(scrollPos, isAppend);
		}
		this.props.onLayoutComplete({
			currentTarget: this,
			target: items,
			fromCache,
			isAppend,
			isTrusted,
			isLayout,

fromCache,
		isLayout = false,
	}) {
		!isLayout && this._updateCursor();
		const viewSize = this._renderer.getViewSize();
		const size = this._getEdgeValue("end");
		const { useRecycle } = this.props;
		const watcher = this._watcher;
		const scrollPos = watcher.getScrollPos();

		if (!isAppend) {
			if (!this._fit()) {
				DOMRenderer.renderItems(items);
			}
		} else {
			!isLayout && DOMRenderer.renderItems(items);
			this._setContainerSize();
		}
		this.state.isFirstRender = false;
		if (useRecycle) {
			this._infinite.recycle(scrollPos, isAppend);
		}
		this.props.onLayoutComplete({
			currentTarget: this,
			target: items,
			fromCache,
			isAppend,
			isTrusted,
			isLayout,
			isScroll: viewSize < watcher.getContainerOffset() + size,
			scrollPos,
			orgScrollPos: watcher.getOrgScrollPos(),

newDatas[key] = data ? { ...userDatas[key], el: data.el } :
				userDatas[key];
		}
		state.processing = DONE;
		renderer.setStatus(_renderer);
		this._infinite.setStatus(_infinite);
		this._refreshGroups(Children.toArray(this.props.children));
		const isReLayout = renderer.isNeededResize();


		const visibleItems = this._getVisibleItems();

		visibleItems.filter(item => !item.el).forEach(item => {
			item.isWaitMount = true;
		});
		!isReLayout && DOMRenderer.renderItems(this._getVisibleItems());
		watcher.setStatus(_watcher, applyScrollPos);
		watcher.attachEvent();

		const items = ItemManager.pluck(state.groups, "items");

		items.forEach(item => {
			if (!item.orgSize || item.rect.top < DUMMY_POSITION / 10) {
				item.mount = false;
			}
		});
		if (isReLayout) {
			renderer.resize();
			this._setSize(renderer.getViewportSize());
			if (this.props.isConstantSize) {
				this.layout(true);
			} else {

updateGroups = isUpdate ? updateGroups :
			updateGroups.filter(group => !group.items.every(item => item.mount));
		const items = ItemManager.pluck(updateGroups, "items");
		const newItems = items.filter(item => !item.mount &&
			(!item.orgSize || (!isConstantSize && item.rect.top < DUMMY_POSITION / 10)));
		let isRelayout = false;

		items.forEach(item => {
			!item.orgSize && (isRelayout = true);
			item.mount = true;
		});

		if (updateGroups.length) {
			if (isProcessing || newItems.length) {
				state.processing |= (isAppend ? APPEND : PREPEND) | PROCESS;
				!isFirstRender && DOMRenderer.renderItems(items);
				this._updateSize({ groups: updateGroups, items: newItems, isUpdate: isUpdate || isRelayout });
			} else {
				this.layout(false);
			}
			return;
		}
		if (groups.length) {
			const scrollPos = this._watcher.getScrollPos();

			this._infinite.scroll(scrollPos);
		} else {
			this._requestAppend({});
		}
	}
	_mountContainer(container) {