Dmitry Alekseev

Для больших простых списков нужно использовать только FlatList, либо SectionList - для сгруппированных списков с заголовками групп. Думаю, что ваша проблема, все-таки, кроется в неправильном описании самого компонента, который использует FlatLIst.

Ну все логично, state-то общий. Хорошо было бы перенести этот код в песочницу, но я все же подскажу, навскидку. В своей работе я писал независимый компонент, который рисовал, какое-то дерево. Он был с redux и проблема возникла в том момент, когда возникла необходимость использовать несколько этих компонентов на одной странице. Store создается, фактически, при импорте компонента ведь он обернут в Provider и, сколько бы их не было, store для всех будет общий. Решением было в в функцию экспорта компонента добавить генерацию uuid который передавался в метод создания store и данные хранились по конкретному uuid и забирались оттуда же.

Я могу помочь описать это, но перенеси код в песочницу.

Я не против написания собственных велосипедов, это полезно для понимания принципов работы тех или иных решений, но все же посоветую ant.design и ее компонент tree, который отлично подходит для реализации подобных задач.

Сходу можно сказать, что после console.log('then two') стоит ,, а не ;

Не совсем понятна проблема. Вот пример sandbox

Есть компонент Main, в котором есть метод render и есть компонент Second, унаследованный от Main. ComponentDidMount вызывается от Second, а render от Main

Можно задать для каждого квадрата width: '25%'

На самом деле, не вижу проблемы. Build реакт-приложения представляет собой набор статических файлов, а значит и отдавать их можно с любого веб сервера. Используете хоть Apache, хоть Nginx, хоть XAMPP, смотря что больше нравится.

Если я тебя правильно понял, то
onClick={(e) => this.handleTdClick(e, item)}