Возврат обещания из магазина рефлюксов

Я работаю над своим первым приложением для реагирования / рефлюкса, поэтому я могу подходить к этой проблеме совершенно неправильно. Я пытаюсь вернуть обещание из обработчика действий хранилища рефлюкса. Это минимальный код, который представляет, как я пытаюсь это сделать. Если я покажу это в браузере, я получу сообщение об ошибке, говорящее о том, что обещание никогда не перехватывается, потому что результат функции onLogin не передается обратно при инициации действия. Как лучше всего это сделать?

var Reflux = require('reflux');
var React = require('react/addons')

const Action = Reflux.createAction();
const Store = Reflux.createStore({
    init: function() {
        this.listenTo(Action, this.onAction);
    },

    onAction: function(username, password) {
        var p = new Promise((resolve, reject) => {
            reject('Bad password');
        });

        return p;
    }
});

var LoginForm = React.createClass({
    mixins: [Reflux.connect(Store, 'store')],
    login: function() {
        Action('nate', 'password1').catch(function(e) {
            console.log(e); // This line is never executed
        });
    },
    render: function() {
        return (
            <a onClick={this.login} href="#">login</a>
        )
    }
});

React.render(<LoginForm />, document.body);

person Lily Mara    schedule 25.06.2015    source источник
comment
Действия не должны иметь возвращаемых значений. В обработчике действия в магазине (onAction) вы должны проверить учетные данные и на основе результата проверки вы можете вызвать другое действие. Таким образом, у вас может быть еще два действия. Один на успех и один на провал. Альтернативой является отправка вашим магазином триггера после проверки с результатом проверки в качестве полезной нагрузки. Компонент должен прослушивать это событие хранилища.   -  person Björn Boxstart    schedule 26.06.2015


Ответы (1)


Несколько вещей здесь кажутся немного запутанными.

  1. Reflux.connect(Store, 'store') является сокращением для прослушивания предоставленного хранилища и автоматически устанавливает свойство "store" состояния вашего компонента на то, что передается в вызове this.trigger() вашего хранилища. Однако ваш магазин никогда не вызывает this.trigger, поэтому «магазин» в состоянии вашего компонента никогда не будет обновляться. Возврат значения из обработчиков действий вашего магазина не запускает обновление.

  2. Магазины должны прослушивать действия для обновления своего внутреннего состояния, а затем обычно транслировать это обновление состояния, вызывая this.trigger. Ни один компонент не получит возвращенное обещание из хранилища onAction, если только он явно не вызовет Store.onAction (и тогда не имеет значения, было ли вызвано фактическое действие или нет).

  3. Асинхронная работа обычно должна происходить в хуке preEmit действия, а не в хранилище. Затем вы также должны объявить действие асинхронным в createAction, установив для параметра asyncResult значение true, чтобы автоматически создавать дочерние действия «завершено» и «не удалось». Ознакомьтесь с документацией Reflux здесь, чтобы узнать об асинхронных событиях. Асинхронные действия автоматически возвращают промисы, чьи resolve и reject вызываются при вызове поддействий "выполнено" и "не удалось" соответственно. Это немного самоуверенно, но это определенно то, что я считаю предполагаемым методом Reflux.

person Hannes Johansson    schedule 14.07.2015