来自浏览器控制台的错误 this.setState is not a function

Question

我是新手，我对计算机上的 json 文件运行了一个提取请求，然后为了获得响应并更新状态，我得到了 setstate 不是函数的错误。另外，当我尝试映射时，我得到另一个错误，即 this.state.data.map 不是一个函数。请有人帮我解决这个问题

这是我的代码

    import React from "react";

class SearchBar extends React.Component {
    state= {term: []}

  onFormSubmit = (e) => {
    e.preventDefault()
    this.props.onSubmit(this.state.term)
    }

    render() {
        return ( 
          <div className="ui action   input">
                <form onSubmit={this.onFormSubmit}>
              {/* <i class="search icon"></i> */}
              <input
                onChange={e => this.setState({ term: e.target.value })}
                value= {this.state.term }
                type="text"
                placeholder="Search..."
              />
            </form>
          </div>
        );
            
    }
}
export default SearchBar;

class HomePage extends React.Component {
    state = []
    onSerchSubmit(term) {
        fetch('app-data.json', {
            params: {query: term},
            headers: {
                'Content-Type': 'application/json',
                'Accept': 'application/json'
          } 
        })
            .then(response => {
                console.log(response)
                return response.json()
            })
            .then((data) => {
                console.log(data)
               return this.setState({term: this.state}) 
            })
        
        
    }
    render() {
        return (
            <div>
                <SearchBar
                    onSubmit={this.onSerchSubmit}
                />
                <Directory />
            </div>
        )
    }