Как срендерить готовый класс?

Question

[Ильдар Гизетдинов]

есть класс:

class ExtraClassName extends React.Component {
    render() {
        return <div />;
    }
}

Далее я его инициализирую:
var ecn = new ExtraClassName ({});

И соответственно пытаюсь срендерить:

render() {
	return (
		<div>{ecn}</div>
	);
}

В ответ получаю:

Objects are not valid as a React child (found: object with keys {props, context, refs, updater, state})

Что я упускаю? Объявляю заранее я для того чтобы сохранить ссылку на него, для дальнейших операций

UPDATE:

на закромах (совсем где то далеко) нашёл что надо писать {enc.render()}

Но тогда возникает другой вопрос, как мне ему в этом случае передать key? React выдаёт warning на это

Answer 1

[Pavel Shvedov]

в реакте рендер компонента делается примерно так:

render() {
  return (
    <div>
        <ExtraClassName key={somedata} />
    </div>
  );
}

не нужно создавать его инстанс руками

Comments

[Ильдар Гизетдинов]

Этих компонентов может быть много, они по сути динамические (то есть там список компонентов которые добавляются по клику), как предлагаете с этим быть? К примеру если просто добавлять в массив, то при любом апдейте (рендере) компонент же будет снова дублироваться, даже если не был в итоге создан (допустим не менялся), или я чего то не учитываю?