Question

当前正在尝试创建一个返回一组结果的搜索功能。我正在使用axios尝试在前缀中设置查询。但是，它所做的只是返回所有文章。无论输入什么或查询什么。 api调用中是否缺少某些内容？我应该改为使用内联语句吗？也许我应该放弃axios？我不知道。这是我的代码：

 import React, { Component } from 'react'
import axios from 'axios'
import Suggestions from '../components/Suggestions'

const { API_KEY } = process.env
const API_URL = 'http://djangoandreact.herokuapp.com/api/'

class Search extends Component {
  state = {
    query: '',
    results: []
  }

  getInfo = () => {
    axios.get(`${API_URL}?api_key=${API_KEY}&prefix=${this.state.query}&limit=7`)
      .then(({ data }) => {
          console.log(data)
        this.setState({
          results: data
        })
      })
  }

  handleInputChange = () => {
    this.setState({
      query: this.search.value
    }, () => {
      if (this.state.query && this.state.query.length > 1) {
        if (this.state.query.length % 2 === 0) {
          this.getInfo()
        }
      } else if (!this.state.query) {
      }
    })
  }

  render() {
    return (
      <form>
        <input
          placeholder="Search for..."
          ref={input => this.search = input}
          onChange={this.handleInputChange}
        />
        <Suggestions results={this.state.results} />
      </form>
    )
  }
}

export default Search

Answer 1

我认为“ .then”需要重新配置。意思是“响应”。

axios.get('')
.then(res => console.log(res.data))
.catch(err => console.log(err))

如果您尝试这样做，则可以从API中找到数据

Axios API搜索功能将返回所有内容

1 个答案: