reactjs - 如果初始化没有延迟，回流触发器将无法工作

Question

我使用Reflux，通常我在进行ajax调用后触发，并且效果很好。出于测试目的，我不需要 ajax 调用，并且我注意到除非我给出最小 5 毫秒的超时，否则触发器将无法工作。这是工作和不工作的示例。

不工作示例:

window.threadStore = Reflux.createStore
  初始化:->
    @state = @getInitialState()
    @fetchThreads()
  获取初始状态:->
    已加载:假
    主题:[]
  获取线程:->
    # ajax调用不进行测试，只触发测试
    @state.threads = FakeData.threads(20)
    @state.loaded = true
    @trigger(@state) # 这行不通!

这会起作用:

window.threadStore = Reflux.createStore
  初始化:->
    @state = @getInitialState()
    @fetchThreads()
  获取初始状态:->
    已加载:假
    主题:[]
  获取线程:->
    # ajax调用不进行测试，只触发测试
    @state.threads = FakeData.threads(20)
    @state.loaded = true
    设置超时(=>
      @trigger(@state) # 这会起作用!
    , 500)

你能解释一下为什么它不能毫无延迟地工作吗？应该吗？这是一个错误还是我不明白的东西。

Answer 1

这是因为组件从 getInitialState 获取空数组，并且它是在调用 trigger 之后发生的。

init 在创建存储实例时调用，这意味着在安装组件之前立即调用 fetchThreads 中的触发器。当监听组件稍后被安装时，它会从 getInitialState 上的存储中获取空数组。

我建议进行以下更改:

window.threadStore = Reflux.createStore
  init: ->
    @state =
      loaded: false
      threads: []
    @fetchThreads()
  getInitialState: ->
    @state # TODO: State should be cloned for sake of concurrency
  fetchThreads: ->
    # NOTE: Assign a new state for the sake of concurrency
    @state = 
      loaded: true
      threads: FakeData.threads(20)
    @trigger(@state) # This will SHOULD work now ;-)