ох та хде их взять то?
Контейнер также является компонентом React и также находится на этапе первого render. Причем, вложенные компоненты формируются примерно так:
{/*--- все вложенные компоненты -----------------------------*/ }
{ Object.keys(this.state.component).map((index)=>{
return(
<React.Fragment key={index}>
{ this.state.component[index].feature(
{ ...this.state.component[index].props },
{ frameDisable : this.state.frameDisable,
indexName : index,
dispatchEvent : this.componentHandler.bind(this,index)
}
)}
</React.Fragment>
Если очень кратко, то конечная страница из всех компонентов, классов и их производных, вообще чего бы то ни было формируется при помощи массива.
Вот где то в этом map и есть компонента с графиком.
Но не суть - на момент render нету параметров width и height родителя. даже если поставлю id и отладчиком посмотрю что то типа
getBoundingClientRect().
т.е. на момент первого рендера приходится уходить создавая холст с нулевым width и height и без прорисовки чего бы то ни было. Т.е. просто холст
Затем componentDidMount. Смотрите что получается...
<div style={{width:'100%',height:'100%'}} ref={this.refContainer}>
<Stage width={'0'} height={'0'} ref={this.REF}>
вставил дополнительно div 100%
первый рендер идет с 0 width и height
componentDidMount. В нем смотрим
this.refContainer.current.getBoundingClientRect()
т.е. этот тот вот первый DIV
а там НУЛИ. ну и как дальше?
