為什么此代碼不運行，而是向我發送此錯誤：（未處理的拒絕（類型錯誤）：this.state 不是函數）

Question

我是初學者，我正在嘗試編寫 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的功能上。

您嘗試在該函數中設置 the，但您沒有執行 this.setState，而是執行了 this.state。

應該是這樣：

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

此外，當您嘗試設置狀態時，它在那個 componentDidMount 函數中，我看不到任何地方定義了robot ......所以機器人的值將是未定義的。

如果您需要澄清，請告訴我。