The terminal is showing error "hooks are not used according to rules", please help

Question

import React,{useState,useEffect} from 'react'
import emailjs from 'emailjs-com';

export const Feedback = () => {

const [feedback,setFeedBack] = useState('');
const [submitted,setSubmitted] = useState(false);
const[email,setEmail] = useState(false);

useEffect(() => {
emailjs.init('[e-mail]')

}, []);

const handleSubmit = (e) => {
e.preventDefault();

const templateParams ={
feedback:feedback,
to_email:'[e-mail]',
};
emailjs
.send('service_c8wox7q', 'template_y4ulw9o', templateParams)
.then((response) => {
console.log('Feedback sent!', response.status, response.text);
setSubmitted(true);
setFeedBack('');
setEmail(true)
})
.catch((error) => {
console.error('Error sending feedback:', error);
});

};
return (

<div>
<form onSubmit={handleSubmit}>
<textarea placeholder="enter your feedback"

Answer 1

Hi Harshita Kumari , it looks like your code has been cut off. The best way to display your code is described here:

https://code.sololearn.com/Wek0V1MyIR2r/?ref=app

Answer 2

The error message "hooks are not used according to rules" typically occurs when there is a violation of the rules of using React hooks. In your code, there are a few issues that might be causing this error:

1. Make sure you are importing `useState` and `useEffect` from the correct package, which is `react`, not `react-native`.

2. Check if you have installed the required dependencies (`react` and `react-dom`) in your project.

3. Ensure that you are using hooks inside a functional component and not inside a regular JavaScript function or outside of a component.

4. Check if you have any conditional rendering or loop structures that might be causing the hooks to be used inconsistently.

If you have addressed these issues and the error still persists, please provide more details about the specific error message or the surrounding code so that I can assist you further.

Answer 3

This error is simply because you forgot to add a spacing to the code below:
const[email,setEmail] = useState(false);

It should be
const [email,setEmail] = useState(false);

I just tested your code, nothing wrong about the code except that error and the incomplete pasted code without the submit button.

Answer 4

Harshita Kumari
1. I think the problem is with the way your using email.js, if you want to send email from multiple users to a single admin person, you don't need to use to_email [receiver email] here in react code, instead statistically define it in your email.js template
[template > right side bar > to_email ].
But still you have to get sender email throw an input and pass it as a property in your template params.

2. Remove the useeffect and email init code .

[emailjs dcs]: https://www.emailjs.com/docs/examples/reactjs/

[youTube]:https://youtu.be/bMq2riFCF90
I hope it would be helpful

Answer 5

Jared Ramon Elizan Is it an AI-generated answer? Because it looks very like that.