Question

我有一个非常简单的Fluxible商店：

export default class NoteStore extends BaseStore {
  static storeName = "NoteStore";

  static handlers = {
    [Actions.NEW_NOTES_FETCHED]: 'handleNewNotes'
  };

  constructor(dispatcher) {
    super(dispatcher);
    this.notes = [];
  }

  handleNewNotes(notes) {
    this.notes = [];
    var i;
    for (i = 0; i < notes.length; i++){
      this.notes.push(notes[i].content);
    }
    this.emitChange();
  }

  /* ... */

  dehydrate() {
    return { notes: this.notes };
  }

  rehydrate(state) {
    this.notes = state.notes;
  }

  // Shouldn't be necessary to override?
  shouldDehydrate() {
    return true;
  }
}

NEW_NOTES_FETCHED由从我的后端API获取数据的操作调度，并且存储侦听该事件并从有效负载中提取数据。据我所知，所有这一切都有效，因为在客户端运行时一切都运行良好。

我遇到的问题是，当服务器调用app.dehydrate()时，NoteStore似乎没有脱水。我查看嵌入到页面中的JSON，虽然我确实看到了RouteStore的信息，但我没有在任何地方看到我的商店。

我使用FluxibleContext注册了我的商店，但是我是否需要另外做一些事情才能将它添加到脱水链？

App bootstrapping code（如果相关）：

const app = new Fluxible({ component: Root });

const AppRouteStore = RouteStore.withStaticRoutes(routes);
app.registerStore(AppRouteStore);  // AppRouteStore appears in dehydrated JSON

app.registerStore(HtmlHeadStore); // Neither of these do, though HtmlHeadStore doesn't need to
app.registerStore(NoteStore);

export default app;

Answer 1

好的，我弄清楚出了什么问题。基本上，应该调度NEW_NOTES_FETCHED事件的操作没有返回一个promise，所以处理来自后端服务器的响应的逻辑从未实际运行过，即使请求本身已经完成并且我看到了它出现在后端的日志中。

我的头发长时间困扰着我的头发，所以希望有人可以从我的斗争中学习！

为什么我的Fluxible商店不会脱水？

1 个答案: