Блог

Я пытаюсь ПУБЛИКОВАТЬ новых пользователей с помощью useEffect (). Я смог это сделать с помощью componentDidMount. Мои хуки работают нормально (вне useEffect), но когда дело доходит до api.post. Код ничего не публикует. Я попытался вставить хук внутри useEffect(), но выдает («Недопустимый вызов хука»). Я использовал несколько перехватов для обработки входных данных, и когда я нажимаю кнопку, обычно изменяется состояние моего перехвата, но api не отправляет сообщения в мою базу данных. Код вводится в useEffect(), но не выполняет api.post . Кто-нибудь может мне помочь в этом? Я ищу эту ошибку в течение 2 дней. Вот мой код:

     //Hooks
    const [name, setUserName] = useState('');
    const [userEmail, setEmail] = useState('');
    const [userPassword, setPassword] = useState('');
    const [avatar, setAvatar] = useState('');

    const [enteredUserName, setEnteredUserName] = useState('');
    const [enteredEmail, setEnteredEmail] = useState('');
    const [enteredPassword, setEnteredPassword] = useState('')

    useEffect((userName, email, password) => {
        api.post('users/signup', {userName: name , email: userEmail, password: userPassword}).then(data => {
            navigation.navigate('Home');
        }).catch(err => {
            if (err === true) {
                Alert.alert('Invalid Credentials')
            }
        }, []);
    })
    const userNameInputHandler = (enteredText) => {
        setEnteredUserName(enteredText)
    };
    
    const userEmailInputHandler = (enteredText) => {
        setEnteredEmail(enteredText);
    };

    const userPasswordHandler = (enteredText) => {
        setEnteredPassword(enteredText);
    };

    const handler = () => {
        setUserName(currentUserNames => [...currentUserNames, enteredUserName]);
        setEmail(currentEmails => [...currentEmails, enteredEmail]);
        setPassword(currentPasswords => [...currentPasswords, enteredPassword]); 
    };
 

Обработчик — это моя кнопка регистрации. При нажатии вызывается обработчик ().

 useEffect is calling once because you passes [] at the end. i.e

useEffect(()=>{},[]);

if you want to execute useEffect on change of something then pass that as dependency i.e []
 

если вы вызываете эту функцию при нажатии кнопки, то она должна быть вне useEffect. также, когда вы хотите использовать перехваты с асинхронной функцией, вы должны объявить ее вне перехвата, а затем вызвать ее внутри перехвата; например:

` const login = async () => {};

useEffect(login(),[]);

`

Вы можете создать перехват жизненного цикла useComponentDidMount.js

 export const useComponentDidMount = (cb) => {
  useEffect(() => {
    cb();
  }, []);
};
 

и используйте его как

 useComponentDidMount(() => {
  axios.fetch(...)
})
 

У useEffect есть какие-либо аргументы, пожалуйста, удалите имя пользователя, адрес электронной почты, пароль и используйте like

useEffect(() => { api.post(‘пользователи / регистрация’, {Имя пользователя: имя пользователя , адрес электронной почты: userEmail, пароль: userPassword}).затем(data => {navigation.navigate(‘Home’); }).catch(ошибка => { if (ошибка === true) { Alert.alert(‘Недопустимые учетные данные’) } }, []); })