1

最近我一直在研究 React 和 Reflux。我被卡住的部分是我无法在 Reflux 的商店中使用 AJAX 获得初始状态。我尝试的只是调用 Store.js 中的ajax($.getJSON)ingetInitialState函数，使用 AJAX 响应（JSON）设置初始状态，并弄清楚状态是什么。我预计从 AJAX 调用获得的输出将是 JSON 数组列表，但实际输出将是undefined

那么如何在使用 Reflux 的商店中使用 AJAX 获取初始状态？

代码是这样的......

// in store.js
getInitialState: function() {
  $.getJSON('/sample').done(function(result){
    this.list = result;
  });
  return this.list;
}

// in sampleApp.jsx
mixins: [Reflux.connect(Store, "list")],

  render() {
    console.log(this.state.list);
    // I expected this output would be JSON lists, but the actual output will be undefined.

    return ();
  }
4

1 回答 1

4

这段代码有很多问题：

getInitialState: function() {
  $.getJSON('/sample').done(function(result){
    this.list = result;
  });
  return this.list;
}

首先，您this.list在 Ajax 请求返回数据之前返回。这实际上意味着您正在undefined从该功能返回。第二个问题是您this在 Ajax 回调中使用，它不会指向 Reflux 存储。为此，您需要使用箭头函数和 ES6 转译器。

getInitialState但是无论如何你都不应该做一个 Ajax 请求。你正在寻找的是这样的：

var MyStore = Reflux.createStore({
  getInitialState: function () {
    return {
      list: []
    }
  },
  init: function () {
    var self = this;
    $.getJSON('/sample').done(function (result) {
      self.trigger({list: result});
    });
  }
});
于 2015-05-13T11:22:33.283 回答