Не удается получить доступ к реквизитам внутри функции

Я хочу получить доступ к функции, которая находится в реквизитах после получения данных с помощью axios, но я получаю сообщение об ошибке:

Ожидал присваивания или вызова функции, а вместо этого увидел выражение no-unused-expressions

Я могу получить доступ к той же функции внутри jsx, но она не работает, когда я пытаюсь вызвать ее из function/axios. Вот мой код:

function LoginModal(props) {


let emailInput = React.createRef();
let passwordInput = React.createRef();



const getToken = (props) => {
    axios.post('http://localhost:8000/api/token/', {
        username: emailInput.current.value,
        password: passwordInput.current.value
      })
      .then(function (response) {
        props.closeModalHandler();
      })

}

return (
    <div className={styles.Background} onClick={props.closeModalHandler}>
    <div className={styles.ModalContainer}>
        <h2>Log in.</h2>
        <div className={styles.InputContainer}>
            <input type="text" className={styles.Input} ref={emailInput} />
            <label htmlFor="" className={styles.ActiveLabel}>Email</label>
        </div>
        <div className={styles.InputContainer}>
            <input type="password" className={styles.Input} ref={passwordInput}/>
            <label htmlFor="" className={styles.ActiveLabel}>Password</label>
        </div>
        <button className={styles.LoginButton}
                onClick={getToken}>Log me in</button>
        <p>Forgot password? <br/>
           Reset it <b>here</b>
        </p>

    </div>
</div>
)}

reactjs javascript axios
person Renato Maretić    schedule 08.01.2020    source источник
comment
пожалуйста, добавьте полный компонент   -  person warmachine    schedule 08.01.2020
comment
Если props.closeModalHandler — это функция, вам не хватает скобок props.closeModalHandler()   -  person Ismael Padilla    schedule 08.01.2020
comment
если props.closeModalHandler это функция. Вам нужно вызвать это как функцию props.closeModalHandler()   -  person prasanth    schedule 08.01.2020
comment
Да, пожалуйста, добавьте больше кода - это облегчит понимание. Является ли closeModalHandler функцией? Если да, то вы промахнулись ()   -  person Mario Murrent    schedule 08.01.2020
comment
Можете ли вы поместить console.log(response) в промис, чтобы увидеть, успешно ли промис получает ответ   -  person Oner T.    schedule 08.01.2020
comment
ты имеешь в виду return props.closeModalHandler?   -  person James Whiteley    schedule 08.01.2020
comment
Прочтите справочный центр, в частности Как мне задать хороший вопрос? Я также рекомендую Написание идеального вопроса Нам нужно гораздо более четкое описание проблемы. Этот код определенно может получить доступ к props в единственном месте, где он его использует. Что заставляет вас думать, что это невозможно? (Отдельно: обязательно обрабатывайте ошибки, а не только успехи.)   -  person T.J. Crowder    schedule 08.01.2020
comment
то, что сказали Исмаэль Падилья и @prasanth, верно, респект   -  person warmachine    schedule 08.01.2020

Ответы (1)


arrow_upward
5
arrow_downward

props не передается обработчику onClick (передается синтетический объект события React). Просто удалите параметр из списка параметров getToken, чтобы он закрылся поверх переданного в LoginModal:

const getToken = () => {
// −−−−−−−−−−−−−−^^
    axios.post('http://localhost:8000/api/token/', {
        username: emailInput.current.value,
        password: passwordInput.current.value
      })
      .then(function (response) {
        props.closeModalHandler();
      })
      // *** Handle errors here -- you probably have to close the modal even
      // when things go wrong...
}
person T.J. Crowder    schedule 08.01.2020