为什么这段代码没有运行，而是向我发送了这个错误：(未处理的拒绝(类型错误)：this.state 不是一个函数)

Question

我是初学者A正在尝试将React应用程序编码为练习

我希望看到这样的东西：https：//github.com/aneagoie/robofriends但是它给我这个错误 Unhandled Rejection (TypeError): this.state is not a function (anonymous function)

import React, {Component} from 'react';
import SearchBox from './SearchBox'; 
import CardList from './CardList';
import './App.css'
import { robot } from './robot';

class App extends  Component {
constructor(){
    super()
    this.state = {
        robot: [],
        searchField: ''
    }
}

componentDidMount(){
    fetch('https://jsonplaceholder.typicode.com/users')
    .then(response => response.json())
    .then(users => {this.state({robot:robot})})
}
onSearchChange = (event) => { 
    this.setState({ searchfield: event.target.value})
}
render(){
    const filteredrobots = this.state.robot.filter(
        robot =>{
        return robot.name.includes(this.state.searchfeild)})
    return(<div className ='tc'>
        <h1>robot friends</h1>
        <SearchBox searchChange = {this.onSearchChange}/>
        <CardList robot = {filteredrobots}/></div>)
}
}

export default App;

不明白出了什么问题，谢谢

Answer 1

似乎问题在于componentDidMount的函数。

您尝试设置该函数中的设置，但不是这样做。

这就是应该的方式：

componentDidMount(){
    fetch('https://jsonplaceholder.typicode.com/users')
    .then(response => response.json())
    .then(users => {this.setState({robot:robot})})
}

另外，当您尝试设置状态时，在此componentdidmount函数中，我看不到robot已定义的任何地方。...因此机器人的值将不确定。

让我知道您是否需要澄清。