我在组件挂载时从后端 api 获取数据并且可以成功完成,但我的 React 应用程序不断向服务器发送请求,导致它变慢。我使用了 useEffect 钩子,但我在不使用钩子的情况下得到了相同的结果。
useEffect(() => {
axios.get('http://127.0.0.1:8000/food_category/')
.then(response => {
setFoodCategory(response.data);
console.log(response.data);
})});
Run Code Online (Sandbox Code Playgroud)
我究竟做错了什么?
我想在使用 axios 获取数据后访问 props 中的函数,但出现错误:
期望赋值或函数调用,却看到了一个表达式 no-unused-expressions
我可以在 jsx 中访问相同的函数,但是当我尝试从函数 / 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? …Run Code Online (Sandbox Code Playgroud)