Cannot read property ‘preventDefault’ of undefined

I really need help here;
I am trying to submit a get request using data from select and input to fill in to the axios get request. Whenever i put event.preventDefault() on the submit function this error occurs
enter image description here

Onsubmit function

  const trackItem = (event) => {
      event.preventDefault()
        axios.get(`http://localhost:8080/api/?${tracktype}/${trackno}`)
        .then(res => setShipment(res.data))
        .catch(err => console.log(err))
  }

  useEffect(() => {
    trackItem()
  }, ());

the form

<form onSubmit={trackItem} >
            <select type="text"  name="tracktype" 
                    onChange={handleSelect}  value={tracktype} required>
                        <option value="" disabled label="Please select tracking options"/>
                        <option value="logisticsrecords" label="Track Shipment" />
                        <option value="storageshipment" label="Truck Storage"/>
                    </select>
                    <br/>
            <input type="text" placeholder="Insert Track number" name="tracknumber" 
                    onChange={handleTrackno} value={trackno} required/>
            <button type="submit"> Search </button>
        </form>

What could be the issue here?