1 | initial version |
State management in React can be achieved using either useContext or EventEmitter.
Example code:
const MyContext = React.createContext();
function MyProvider(props) {
const [state, setState] = useState(initialState);
const updateState = (newValue) => {
setState(newValue);
};
return (
<MyContext.Provider value={{ state, updateState }}>
{props.children}
</MyContext.Provider>
);
}
function MyComponent() {
const { state, updateState } = useContext(MyContext);
return (
<div>
<p>Current state: {state}</p>
<button onClick={() => updateState(newState)}>Update state</button>
</div>
);
}
Example code:
// Import EventEmitter from events module
import { EventEmitter } from "events";
// Create an instance of EventEmitter
const myEventEmitter = new EventEmitter();
// Define events and listeners
myEventEmitter.on("updateState", (newState) => {
// update the state
});
// Emit events from components
function MyComponent() {
return (
<div>
<button
onClick={() => {
myEventEmitter.emit("updateState", newState);
}}
>
Update state
</button>
</div>
);
}