Question

我是React的新手，所以这可能是一个简单的问题，但是经过4天的尝试，我似乎无法使我的代码正常工作。我有一个简单的应用程序，该应用程序对我的后端进行一次restCall，然后它将调用结果呈现给我的UI。 restCall正在工作，并且我得到了预期的结果，但是当我将结果设置为我的状态时，UI永远不会更新，在调用setState之后也没有代码。 setStates的callbackFunction也没有被调用。我已经研究过这个answer，但这并不能帮助我。我的代码基于生成的示例启动器应用程序。

import React, { Component } from 'react';
import logo from './logo.svg';
import Greeting from './components/greeting';
import './App.css';

const axios = require('axios');

class App extends Component {
  constructor(props) {
    super(props);
    this.state = {name: "World"};
  }

  componentDidMount() {
    axios({
      method:'get',
      url:'http://localhost:8080/hello?name=Marcus'
    }).then(function (response) {
      console.log(response.data.name);
      console.log("test");
      this.setState({ name : "kotlin"});
      console.log("danach");
    });
  }

  render() {
    return (
      <div className="App">
        <header className="App-header">
          <img src={logo} className="App-logo" alt="logo" />
          <p>
            Edit <code>src/App.js</code> and save to reload.
          </p>
            <Greeting data={this.state}/>
          <a
            className="App-link"
            href="https://reactjs.org"
            target="_blank"
            rel="noopener noreferrer"
          >
            Learn React
          </a>
        </header>
      </div>
    );
  }

}

export default App;


import React, { Component } from 'react';

export default class Greeting extends Component {

    render(){
        let data = this.props.data
        //console.log({data})
        return(<h1>Hello {data.name}</h1>)
    }
}

我们非常感谢您的帮助。

React.js的setState是否未更新UI？

0 个答案: