Я создал оболочку «золотой макет», используя golden-layout-реаги-redux , и я создаю новые макеты и подключаю их к редуктору панелей, поэтому каждый раз, добавляя новую панель, получаюпостроенный внутри GoldenLayoutWraper.Я подключил содержимое конфигурации следующим образом:
componentDidMount() {
const config = {
content: [{
type: "column",
content: this.props.panels//here
}]
};
goldenlayout = new GoldenLayout(config, this.layout);
goldenlayout.registerComponent(
"IncrementButtonContainer",
wrapComponent(IncrementButtonContainer, this.context.store)
);
}
goldenlayout.init();
Но я столкнулся с проблемой, что при добавлении новой панели в редуктор она не обновляется, массив редукторов панелей увеличивается, а contentIems - нет.Поэтому я был вынужден сделать это следующим образом:
render() {
this.props.panels.map(panel =>
setTimeout(() => {
goldenlayout.root.contentItems[0].addChild(panel);
}, 100)
);
return (
<div className="goldenLayout" ref={input => (this.layout = input)} />
);
}
этот код находится внутри компонента renderLraoutWrapper GoldenLayoutWrapper, и проблема здесь в том, что: 1- Каждый раз, когда я добавляю новую панель, она добавляет несколько панелей,потому что он добавляет Panel.length плюс уже существующие элементы в contentItems [0].2 - когда я удаляю все панели, я больше не могу добавить, потому что работает метод golden-layout, который, когда есть только один дочерний элемент, заменяет его и становится корневым дочерним элементом, а не contentItems [0], поэтому этот goldenlayout.root.contentItems[0].addChild(panel)
выдает ошибку.
Я также пытался использовать этот реагировать-золотой макет вместо этого, но я застрял с этим проблема
PS: яначинающий