Выводится список нескольких групп ВКонтакте. Компонент ListItem представляет собой одну группу. Её id ВКонтакте передаётся в компонент через props. В дереве я держу ветку под ВКонтактовскую инфу:
vkdata: {
oid: { screen_name, photo_50} // ключ целое число, значение объект со свойствами
// например:
-29534144: { screen_name:'oldlentach', photo_50:'https://pp.vk.me/c624928/v624928349/3892f/cSOB14IlXgM.jpg'},
}
На момент создания компонента, данные для него в дереве могут уже быть, а могут пока отсутствовать. В компоненте я динамически создаю курсор на данные именно этого вк-объекта:
export default branch( ListItem, {
cursors( props, context) {
return {
vkinfo: [ 'vkdata', props.oid],
};
},
План такой: проверять, есть ли там данные, и если ключ даже не определён – то ставить в очередь асинхронный запрос за этими данными к ВК, а в ключ пока записать пустышку, с фото-заглушкой. Так при создании ещё одного компонента для этой же группы – такие дубли могут нередко случаться, в разных компонентах попадаться одна и та же группа – не будет инициирован ещё один запрос к ВК за данными – т.к. в дереве уже будет либо пустышка, либо настоящие данные появятся.
Вопрос: где правильно реализовать проверку данных на пустоту, инициацию запроса и запись пустышки?
Пробовал: в конструкторе ListItem (там ещё не определены props); в componentWillMount() (записанная там пустышка, даже с tree.commit(), не успевает до вызова метода render()). Пробовал в ф-ии, где динамически определяется курсор vkinfo:
Warning: setState(...): Cannot update during an existing state transition (such as within `render`). Render methods should be a pure function of props and state.
Можно это делать на уровень выше – в компоненте самого списка, перед созданием компонентов-item'ов. Но хочется изолировать озабоченность своими данными внутри самого компонента-item'а.