React Rails:如何获取 API 调用的结果

问题描述

我需要一个 api 调用一个服务器的响应组件的结果:假设现在我只需要将 true 或 false 显示为文本

我有以下组件:

// some_random_thing.coffee

    { div,h5 } = DOM
    actions = require '../../actions'
    
    class MfaQRCode extends React.Component
      @propTypes: {}
    
    
      constructor: ->
        super arguments...
        @validationTimeout = null
  shouldComponentUpdate: -> true

  render:->
    div {},@renderStatus()

  renderStatus: ->
    h5 {className: 'column-header'},"BOOLEAN::"
        @props.resource.boolean_record

哪个是别的东西的子组件; 然后填充我在我的 actions.coffee 文件中的这个 boolean_record

    api = require('./api')
    AddUserPopupActions = ReactUtils.actions.creators.popup
      somethingExists: { asyncResult: true }

AddUserPopupActions.somethingExists.listen ->
  @promise(api.somethingExists(arguments...))

在 api.coffee 中

    api = ReactUtils.api
    
    class Api
    
    somethingExists: ->
      api.get "/servers/users/something/exists"

这个 get 请求是在 rails 控制器中处理的,我认为这很好。我的问题是,如何填充变量以便我可以使用从另一台服务器返回 true 或 false 的请求结果。

在名为 store.coffee 的文件中有一个方法,其中填充了 props 的资源组件我需要用 api 请求的结果填充它:已经尝试过:

  onSomethingExists: (response) ->   
    @resource.boolean_record = response.responseJSON.result   
    @_update()          

但是这个方法在调试时似乎根本没有被触发。我对反应很陌生,并没有完全理解它是如何工作的,而且鉴于 coffeescript 和 rails 混合使用的事实,关于如何做到这一点的信息很少。

解决方法

看起来你正在使用reflowjs 如果是这种情况,您的商店应该倾听您的行动。

onSomethingExists: (response) ->   

这是在调用 somethingExists 方法时调用的,但参数是您传递给 somethingExists 函数的参数。

您需要在商店中再添加两个函数来处理请求的成功/错误结果:

onSomethingExistsCompleted: (response) ->   
  console.log "onSomethingExistsCompleted",response

onSomethingExistsFailed: (response) ->   
  console.log "onSomethingExistsCompleted",response

要从中获取值到您的反应视图中,您需要在商店中使用 setState,然后它应该在 @state 到达视图,因为该视图已连接到商店