# React--透過props傳送setstate至其他component ###### tags: `react` `props` 在使用react寫登入介面時遇到的問題,送出帳密資訊之後如何透過usestate刷新頁面。 後來發現是我沒有傳送props到所有會通過的components。 ```javascript=20 /*Login.js*/ const Login=(props)=>{/*接收props*/ const {setCurrentPage} = props;/*從props取出setCurrentPage*/ return( <main> <LoginHeader/> <LoginForm setCurrentPage={setCurrentPage} /> </main> ) } const Home = () => { const [currentPage, setCurrentPage] = useState('Login'); return ( <main> {currentPage === 'Login' && (<Login setCurrentPage={setCurrentPage} /*傳送setCurrentPage到Login*/ />)} <Footer/> </main> ); } export default Home; ``` 要讓`LoginForm`能夠調用`setCurrentPage`需要把`setCurrentPage`先傳送到`Login`才能引用。 ```javascript=9 /*Login.js*/ const LoginForm=(props)=>{ const {setCurrentPage} = props; function processFormData() { const Account = document.getElementById("Account"); const Password = document.getElementById("Password") } return ( <Container className="justify-content-md-center"> <Button variant="primary" onClick={processFormData}>登入</Button> </Container> ); }; export default LoginForm; ```
×
Sign in
Email
Password
Forgot password
or
By clicking below, you agree to our
terms of service
.
Sign in via Facebook
Sign in via Twitter
Sign in via GitHub
Sign in via Dropbox
Sign in with Wallet
Wallet (
)
Connect another wallet
New to HackMD?
Sign up