Каков правильный способ инициализации данных (асинхронно) с помощью RefluxJS? Есть ли что-то похожее на решения AngularJS, или реализация Flux не имеет к этому никакого отношения (маршрутизатор должен нести эту ответственность)?
Правильный способ инициализации данных
Ответы (2)
В компоненте верхнего уровня приложения используйте метод comoponentWillMount
(документы), чтобы инициировать действие, которое извлекает данные. Этот метод будет вызываться при первоначальном отображении компонента.
Например:
// Create an async action, that will request data using a promise
// Using the recently released (v0.2.2) helpers for async actions
var actions = Reflux.createActions({
init: {asyncResult: true}
});
actions.init.listenAndPromise(promiseToGetData);
// Update the store when the init action's promise is completed
var store = Reflux.createStore({
listenables: actions,
onInitCompleted: function (data) {
// do stuff
this.trigger(data)
}
});
var App = React.createClass({
mixins: [Reflux.connect(store)],
componentWillMount: function () {
// When this component is loaded, fetch initial data
actions.init()
}
});
person
Matti John
schedule
23.01.2015
Просто вопрос: если я использую refluxjs с реактивным маршрутизатором, что произойдет, если обещание будет отклонено; Монтаж остановлен (технически ничего не происходит) или выполняется вручную?
- person srph; 23.01.2015
Компонент по-прежнему будет монтироваться, призыв к действию — выстрелить и забыть. Если обещание отклонено, хранилище все равно получит результат, и вы можете добавить обработчик
onInitFailed
. Подробнее об асинхронных действиях см. на странице github.com/spoike/refluxjs#asynchronous-actions. .
- person Matti John; 23.01.2015
Спасибо. Кстати, вы имеете в виду
componentWillMount
, а не onComponentWillMount
?
- person srph; 23.01.2015
ой, извините, это
componentWillMount
, я исправлю ответ
- person Matti John; 23.01.2015
В этом фрагменте кода есть как минимум пара проблем, которые на некоторое время сбили меня с толку. Во-первых,
componentWillMount
ожидает функцию. Кроме того, должно ли actions.load.listen...
быть actions.init
?
- person Alex York; 12.03.2015
@AlexYork, ты прав, я написал это довольно поспешно.
- person Matti John; 12.03.2015
Это неправильно. Он не использует API, который есть у Reflux из коробки. Смотрите мой ответ ниже.
- person wle8300; 01.08.2015
Нет, это не неправильно. Это способ, рекомендованный документацией React. Вы не должны делать асинхронные запросы в
getInitialState
.
- person Matti John; 03.08.2015
На самом деле у Reflux есть API для этого.
Документы плохо описывают это, но Spoike (автор Reflux) дал ответ вместе с примером кода:
https://stackoverflow.com/a/28984512/1775026
person
wle8300
schedule
01.08.2015
Этот вопрос касался асинхронной выборки данных. Reflux устанавливает метод хранилища
getInitialState
для компонентов React и не должен использоваться для асинхронной выборки данных. Пример в ответе, на который вы ссылаетесь, предназначен для статических значений. См. официальную документацию по React и stackoverflow.com/questions/26615307
- person Matti John; 03.08.2015