I got something weird when I'm submitting a form. When I'm using ev.preventDefault() as is, everything working as expected but when I'm adding dispatch to the function two lines later I'm getting the error: ev.preventDefault is not a function. here are my code thanks in advance!
const addReview = async ev => {
ev.preventDefault()
if (!email || !message) return alert('All fields are required')
await dispatch(addReview({email,message}))
console.log('Adding review!');
}
<form onSubmit={addReview}>
<input value={email} placeholder="Email" type="email" id="email" name="email" onChange={handleChange}/>
<textarea
name="message"
placeholder="Message"
rows="4"
cols="50"
onChange={handleChange}
value={message}
></textarea>
<button>Submit</button>
</form>
Solved: The problem was caused by using the same name for the function in that component and on the actions page thanks all.
Why are you calling addReview function from inside itself with dispatch?
const addReview = async ev => {
ev.preventDefault()
if (!email || !message) return alert('All fields are required')
await dispatch(?????({email,message})) // This line should be changed
console.log('Adding review!');
}