× TypeError: this.props.onSubmit is not a function

[eebann]

import React from 'react';


class SearchBar extends React.Component{
    state = {term: ''};  
    onFormSubmit= (event)=> {  
        event.preventDefault();
        
        this.props.onSubmit(this.state.term);
    };

    
    render() {
        return (
        <div className="ui segment">
            <form onSubmit={this.onFormSubmit} className="ui form" >
                <div className = "field">
                <label>Image Search</label>
                <input  type ="text"  value ={this.state.term} onChange={e => this.setState({term: e.target.value })} /> 
                </div>
            </form>
        </div>
        );
    }

}
 
export default SearchBar;

[eebann]

[jakeb1050]

Hi I think maybe the problem is with the callback function inside your input tag. The curly brace should be after the arrow function.

Also much wrong with html tags but try replacing with this first:

import React, { useState } from 'react';

class SearchBar extends React.Component{
    const [ term, setTerm ] = useState('');
    onFormSubmit = (event) => {  
        event.preventDefault();
        props.onSubmit(term);
    };