This repository was archived by the owner on Nov 15, 2022. It is now read-only.
-
Couldn't load subscription status.
- Fork 87
This repository was archived by the owner on Nov 15, 2022. It is now read-only.
use hookrouter with react-redux #166
Copy link
Copy link
Open
Description
//reducer to change open-close flag and message
const initState = {
open:false,
message:""
}
const snackBarReducer =(state = initState,action)=>{
switch(action.type){
case snackBarActionType.ACTION_OPEN:
return {...state,...action.payload}
case snackBarActionType.ACTION_CLOSE:
return initState
default :
return state
}
}
//first level router
const routes = {
'/': () => <Login />,
'/Main': () => <Main />,
'/Register*':() => <Register /> //this use * to match second level router!!!!!!!!!
};
function App() {
const routeResults = useRoutes(routes) //use hookrouter
const dispatch = useDispatch();
const snackflag = useSelector(state=>state.snackBarReducer) //react-redux to controll public snackbar open-close flag and snackbar message
return (
<div id ='App'>
{routeResults || <NotFind/>} //use router to controll which page to show
<Snackbar //snackbar(component in material-ui,like Toast in Android)
autoHideDuration = {1000}
message={snackflag.message} //message property to controll message to show
open= {snackflag.open} //open property to cotroll open-close flag
onClose = {()=>dispatch({type:snackBarActionType.ACTION_CLOSE,payload:{}})}
>
</Snackbar>
</div>
);
}
//second level router in Register page
const a = {
'/' :()=><MailRegister/>, //error occur in this page
'/PasswordSet' :()=> <PasswordSet/>,
'/BaseInfo' :()=> <BaseInfo/>
}
//code in MailRegister
<button className ={`${classes.btnBase} ${classes.validateBtnCss}`}
onClick={()=>**sendValidate()**}>Sendvalidata</button>
sendValidate method:
const sendValidate = ()=>{
//send request to behind and show message
validataSend(mailBox).then((res)=>{
//change value of snackBarReducer to open snackbar
dispatch({type:snackBarActionType.ACTION_OPEN,payload:{open:true,message:res.data.message}})
})
}
at this time,error occur,when snackbar show,the content in inputbox was cleared,not one inputbox but all inputbox,
so i think this page was re-render,but at this page ,i do not use content of snackBarReducer, i guess, first level router
- and current path is different??? i am confuse,please help me,thank you,sorry to disturb you。
Metadata
Metadata
Assignees
Labels
No labels

