Rails API没有将JSON返回到React前端

问题描述 投票:1回答:1

我编写了一个Rails API后端。我可以通过在终端中观察我的服务器来看到端点受到攻击。我也可以看到邮递员的回归。但是,我无法在我的React前端返回有效负载。这是我在React中的fetch调用(我在那里有调试器,但它们没有被命中):

  handleSearch(video) {
   fetch(`http://localhost:3000/api/v1/search?q=${video}`)
    .then((response) => {
      debugger
      return response.json()
    })
    .then((data) => {
      debugger
    })
  }

这是我的api控制器:

def index
    videos = VideoService.search_content(params['q'])
    render json: videos
  end

这是我在终端服务器中的输出:

Started GET "/api/v1/search?q=Firefly" for 127.0.0.1 at 2017-12-28 11:40:38 -0700
Processing by Api::V1::SearchController#index as */*
  Parameters: {"q"=>"Firefly"}
Completed 200 OK in 426ms (Views: 7.5ms | ActiveRecord: 0.0ms)

我不确定问题是什么。在提出api请求之前我从未遇到过任何问题。就像我说的那样。我可以看到服务器正在与之交互,并且可以在Postman中看到有效负载返回。谢谢你的帮助!

编辑:这是我在下来的路上调用handleSearch的方式:

<SideBar
        info={this.state.info}
        logout={this.handleLogout.bind(this)}
        search={this.handleSearch.bind(this)}
       />

在这里它被称为SideBar组件:

searchHandler(video) {
    this.props.search(video)
  }

        <SearchBox search={this.searchHandler.bind(this)}/>

最后输入实际进入的地方:

 handleSearch(e){
    let video = e.target.previousSibling.value
    this.props.search(video)
  }

  render() {
    return(
      <form className="search-box" >
      <input type="text" placeholder="Search.." name="search"/>
      <button className="fa fa-search" type="submit" onClick={this.handleSearch.bind(this)}>
      </button>
      </form>
    )
  }
javascript ruby-on-rails ruby reactjs api
1个回答
1
投票

缺少e.preventDefault()我是React的新手,并认为它是由React在幕后处理的。

© www.soinside.com 2019 - 2024. All rights reserved.