小编Sil*_*ERE的帖子

无法让 componentDidUpdate() 停止循环

我正在尝试使用 Axios 从公共 API 获取数据,并显示我通过 React 应用程序获得的数据。但是当用户修改输入时,我无法在我的 componentDidUpdate() 中找到一个条件使其仅呈现一次。有人有想法吗?

这是我的代码:

import React, { Component } from 'react';
import axios from "axios";
import './App.css';

class App extends Component {
  constructor(props) {
    super(props);
    this.state = {
      input: "",
      output: []
    }
  }

  componentDidUpdate() {
    axios.get(`https://geo.api.gouv.fr/communes?nom=${this.state.input}`)
      .then(response => {
        this.setState((prevState) => {
          if (prevState.input !== this.state.input) {
            return { output: response.data };
          }
        });
      })
      .catch(function (error) {
        console.log(error);
      })
  }

  handleInput = (event, input) => {
    this.setState({input: event.target.value});
  }

  render() {
    return …
Run Code Online (Sandbox Code Playgroud)

javascript reactjs axios

6
推荐指数
1
解决办法
5749
查看次数

标签 统计

axios ×1

javascript ×1

reactjs ×1