Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
const initial = {
firstName: '',
lastName: '',
info: ''
};
function exampleReducer(state, action) {
switch (action.type) {
case 'update_firstName':
return {
...state,
firstName: action.value,
};
case 'update_lastName':
return {
...state,
lastName: action.value,
};
case 'update_info':
return {
...state,
info: action.value,
};
default:
return {
...state,
};
}
}
export function ComponentOne() {
const [state, reactDispatch] = useReducer(exampleReducer, initial);
return (
<>
<div id="inputcontainer">
<label>First Name</label>
<input
label="firstName"
onChange={(e) => { reactDispatch({ type: 'update_firstName', value: e.target.value }); }}
/>
</div>
<div id="inputcontainer">
<label>First Name</label>
<input
label="firstName"
onChange={(e) => { reactDispatch({ type: 'update_lastName', value: e.target.value }); }}
/>
</div>
<div id="inputcontainer">
<label>First Name</label>
<input
label="firstName"
onChange={(e) => { reactDispatch({ type: 'update_info', value: e.target.value }); }}
/>
</div>
</>
);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment