Reactjs React API元素未显示在页面上

我已经花了大约2个小时来研究为什么我没有在页面上显示任何信息。我已经在控制台上记录了一个简单的随机引用api的响应，它显示了，Author:和quote:在控制台中，尽管这些没有出现在我的字段中，但我看到的只是按钮

import React, { Component } from 'react';
import QuoteMachine from './Quotemachine';


const END_POINT = 'https://random-quote- 
generator.herokuapp.com/api/quotes/random';

class App extends Component {

constructor(props) {
    super(props);
    this.state = {
        quote: {
            text: '',
            author: ''
        }
    }
}

getQuote() {
fetch(END_POINT)
    .then(response => response.json())
        .then(response => {
            this.setState = ({
                quote: response
            });
            console.log(response);
        })
    }

componentDidMount() {
    this.getQuote();
    }



render() {
    return (
        <div className="App">
            <div className="container">
                <QuoteMachine quote= {this.state.quote} />
                <button id="new-quote" className="primary-color- 
 background" onClick={() => this.getQuote()}>New quote</button>
            </div>
        </div>
    );
    }
}
export default App;

import React，{Component}来自'React'；
从“./QuoteMachine”导入QuoteMachine；
常数端点https://random-quote- 
generator.herokuapp.com/api/quotes/random'；
类应用程序扩展组件{
建造师（道具）{
超级（道具）；
此.state={
引述：{
文本：“”，
作者：''
}
}
}
getQuote（）{
取回（终点）
.then（response=>response.json（））
。然后（响应=>{
this.setState=({
引述：回应
});
控制台日志（响应）；
})
}
componentDidMount（）{
这个.getQuote（）；
}
render（）{
返回(
this.getQuote（）}>New quote
);
}
}
导出默认应用程序；

这是我的Quotemachine.js

import React from 'react'
import PropTypes from 'prop-types';

const QuoteMachine = (props) => {
    return (
        <div className="quote-box">
            <div className="text">
            <span>{props.quote.text}</span>
            </div>
            <div className="author">
            <span >{props.quote.author}</span>
            </div>
        </div>
    );
};

QuoteMachine.propTypes = {
    quote: PropTypes.object.isRequired
};

export default QuoteMachine;

从“React”导入React
从“道具类型”导入道具类型；
const QuoteMachine=（道具）=>{
返回(
{props.quote.text}
{props.quote.author}
);
};
QuoteMachine.propTypes={
quote:PropTypes.object.isRequired
};
导出默认报价机；

它仅显示按钮，但console.log显示

反对 作者： “托马斯·亨利·赫胥黎（1825-1895）”

引述： “试着了解每件事，了解每件事。” proto :

---

对象

安装

React Developer Tools

插件，检查API调用后您的状态是否发生变化

如果

console.log（props），您会看到什么在
中？您的状态设置是否正确
this.setState=（{quote:response}）
不应该是
this.setState（{quote:{text:response.text，author:response.author}}）
？好的，我更改了this.setState，它对作者有效，现在终于出现了！但是text:response.text仍然不显示任何内容使用React Developer工具或将您正在接收/传递的值记录到console，这样您就知道您拥有什么console。quotemachine中的日志记录道具返回的文本未定义