Извлекать данные только при первом переходе на вкладку в TabbedForm
У меня есть форма с вкладками, на которой вторая вкладка будет извлекать список из бэкэнда, аналогично официальной демонстрационной программе activ-admin (например, пост содержит много комментариев). Проблема в том, что когда я переключаю вкладку, всегда есть внутренний вызов для второй вкладки, которая является списком комментариев.
Как мне избежать этого и просто загрузить один раз?
Поскольку у меня есть пагинация на второй вкладке, если я переключаю вкладку, нумерация страниц будет изменена на первую страницу.
Заранее спасибо!
<TabbedForm>
<FormTab label="Post">
<TextInput source="name"/>
</FormTab>
<FormTab label="Comment">
{/* This tab should fetch data only once if I switch tabs */}
<ReferenceManyField
pagination={<Pagination/>}
reference="comments"
target="id"
perPage={5}
addLabel={false}
>
<Datagrid>
<TextField source="name" />
<EditButton />
<DeleteButton undoable={false}/>
</Datagrid>
</ReferenceManyField>
</FormTab>
</TabbedForm>
Ответы
Ответ 1
Если вы используете хуки, вы можете использовать комбинацию useState и useEffect.
useState будет содержать результат вашей выборки данных, который вы будете запускать в useEffect. Чтобы это произошло только один раз, используйте пустой массив как массив зависимостей в useEffect:
const [data, setData] = useState(null)
useEffect(() => {
setData(fetchData())
}, [])