Рефлюкс-соединение / изменение поведения после обновления

Question

Я недавно обновил Reflux с v0.3.0 до v0.4.1

Когда я впервые проверил свой код после обновления, единственное изменение, которое я должен был сделать, это добавить ключ к компоненту Reflux.connect вызов.

Тем не менее, я испытываю странное поведение:

var SomeActions = Reflux.createActions([
  'updateName'
]);

var SomeStore = Reflux.createStore({
  listenables: [SomeActions],
  init () {
    this.name = '';
    this.time = new Date();
  },
  getInitialState () {
    return {
      time: this.time
    }
  },
  onUpdateName (newName) {
    this.name = newName;
    this.trigger({
      name: this.name
    });
  }
});

var SomeComponent = React.createClass({
  mixins: [React.connect(SomeStore, 'someState')],
  componentDidMount () {
    SomeActions.updateName(this.props.name);
  },
  render () {
    console.log(this.state.someState);
    ...
  }
});

Когда компонент впервые монтирует состояние корректно, содержит только time, Тем не менее, после запуска действия, состояние в настоящее время неправильное, содержащее только name, Поведение до обновления было для trigger просто добавить / обновить новые ключи в состояние. Таким образом, после запуска действия я бы ожидал, что состояние будет содержать оба time а также name,

Я что-то пропустил во время обновления?

Answer 1

Хорошо, я не использовал рефлюкс раньше, поэтому мне пришлось читать их документацию. Вы используете неправильный метод для этого.

var SomeComponent = React.createClass({
  mixins: [React.connect(SomeStore, 'someState')],
  ----------------^----------------
  componentDidMount () {
    SomeActions.updateName(this.props.name);
  },
  render () {
    console.log(this.state.someState);
    ...
  }
});

из документов

Если все, что вы хотите сделать, это обновить состояние вашего компонента до того, что передает хранилище данных, вы можете использовать Reflux.connect(listener,stateKey)

Таким образом, данные из магазина изменяют состояние всех ваших компонентов.

Вы можете указать, что обновлять, как этот пример, из их документов.

var Status = React.createClass({
    mixins: [Reflux.listenTo(statusStore,"onStatusChange")],
    onStatusChange: function(status) {
        this.setState({
            currentStatus: status
        });
    },
    render: function() {
        // render using `this.state.currentStatus`
    }
});

Или вы можете вернуть все состояние магазина компоненту в вашем триггере

DOCS