使用 axios 在本机反应中出现错误 404 - 请求失败，状态码为 404

Question

我正在尝试从巴西的 API 中提取一些数据，但它返回以下错误：

Object {
  "_link": "/v1/campeonatos/2/fases/56",
  "decisivo": false,
  "eliminatorio": true,
  "fase_id": 56,
  "ida_e_volta": false,
  "nome": "Segunda Fase",
  "status": "finalizado",
}

Request failed with status code 404
- node_modules/axios/lib/core/createError.js:15:17 in createError
- node_modules/axios/lib/core/settle.js:16:9 in settle
- node_modules/axios/lib/adapters/xhr.js:52:6 in handleLoad
- node_modules/event-target-shim/dist/event-target-shim.js:818:39 in EventTarget.prototype.dispatchEvent
- node_modules/react-native/Libraries/Network/XMLHttpRequest.js:566:23 in setReadyState
- node_modules/react-native/Libraries/Network/XMLHttpRequest.js:388:25 in __didCompleteResponse
- node_modules/react-native/Libraries/vendor/emitter/EventEmitter.js:190:12 in emit
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:436:47 in __callFunction
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:111:26 in __guard$argument_0
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:384:10 in __guard
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:110:17 in __guard$argument_0
* [native code]:null in callFunctionReturnFlushedQueue

这是我的代码：

const Fase = (props) => {
  const { navigation } = props
  const { route } = props
  const { item: fase } = route.params
  const { campeonato_id } = route.params
  const { campeonato } = route.params
  const { fase_id } = fase.fase_id
  const [dados, setDados] = useState([])
  const getDados = () => {
    console.log(fase)
    axios.get('https://api.api-futebol.com.br/v1/campeonatos/2/fases/55' + campeonato_id + '/fases/' + fase_id, { 'headers': { 'Authorization': 'Bearer live_f681927263cdc6a0e5ac9774c0a4b0' } })
      .then((retorno) => {
        var arr = [];
        Object.keys(retorno.data.chaves).forEach((chave, index) => {
          Object.keys(retorno.data.chaves[chave].ida).forEach((i, index) => {
            arr.push(retorno.data.chaves[chave].ida[i])
          })
        })
        Object.keys(retorno.data.chaves).forEach((chave, index) => {
          Object.keys(retorno.data.chaves[chave].volta).forEach((i, index) => {
            arr.push(retorno.data.chaves[chave].volta[i])
          })
        })

我该如何解决这个问题？ 我不明白为什么会出现这个错误，因为在其他屏幕上我也在做同样的事情并且数据被正确地带入。 我正在使用本机反应

Answer 1

您将变量附加到路线中的错误路径。

您使用的链接是： 'https://api.api-futebol.com.br/v1/campeonatos/2/fases/55' + campeonato_id + '/fases/' + fase_id

也许你想要的是：

'https://api.api-futebol.com.br/v1/campeonatos/'+campeonato_id+'/fases/' + fase_id

如果您想将代码中的 sintax 更改为现代 javascript 版本，您可以使用模板字符串模式。

const endpoint = `https://api.api-futebol.com.br/v1/campeonatos/${campeonato_id}/fases/${fase_id}`