React + Alt: используйте данные из нескольких магазинов, чтобы сделать запрос к DataSource

Question

Я работаю над приложением с использованием React с реализацией потока Alt. В настоящее время я пытаюсь найти лучший способ использовать данные из нескольких магазинов Alt, чтобы составить запрос к серверу.

Скажем, у меня есть SheetDataStore, FiltersStore и метод fetchFilteredData в моем DataSource файле. Чтобы получить правильные данные из бэкэнд, мне нужно передать fetchFilteredData как данные листа, так и фильтры, но когда вы вызываете метод fetchFilteredData из одного из магазинов, вы можете передать некоторые аргументы и состояние именно этого точного хранилища.

Так я вижу 2 способа обработки этого случая:

1) я делаю 2 действия: prepareFilters и fetchData. prepareFilters вызывается из компонента и обрабатывается FilterStore, который подготавливает все необходимые данные и после этого вызывает действие fetchData, передавая подготовленные данные в качестве аргумента. SheetDataStore обрабатывает действие fetchData и вызывает fetchFilteredData со всеми необходимыми данными.

Что мне не нравится, так это то, что мне кажется, что магазины не должны называть действия, так что это своего рода хакерское решение.

2) импортировать FilterStore в SheetDataStore и использовать FilterStore.getState() внутри одного из SheetDataStore методов, чтобы получить все данные мне нужно. Это кажется легким, но могут быть некоторые подводные камни, связанные с такими магазинами.

Есть ли какие-либо рекомендации для такого случая? Может быть, некоторые из вас столкнулись с подобной проблемой и могут порекомендовать, какой из путей следует извлечь из вашего опыта?

Answer 1

Сделайте привязку в компоненте. Скажем, у вас есть FilterComponent затем передать розыскную деятельность SheetDataAction.search к нему: <FilterComponent search={SheetDataAction.search} />

И в FilterComponent.render() сделать что-то вроде <button onClick={() => this.props.search(this.props.criteria)} />