react-usestateful-value v1.0.1

use stateful value (✨)

useState with stateful default value reflect to component changes using the useEffect

Getting Started (✅)

• Installation (⏬)

  • npm install react-usestateful-value

• Importing (⚙️)

  • import useStatefulValue from "react-usestateful-value";

• How to use (❓)

import * as react from "react";
import useStatefulValue from "react-usestateful-value";

class Component extends react.Component {
	state = {
		message: "hi",
	};

	renderFunctionComponent = () => {
		const [message, setMessage] = useStatefulValue<string>(this.state.message);

		const onblur = () => {
			this.setState({
				message
			});
		};

		return (
			<div>
				<input type="text" value={message} onChange={(e) => setMessage(e.target.value)} onBlur={onblur}/>
			</div>
		);
	};

	render() {
		return (
			<div>
				<p>{this.state.message}</p>
				<this.renderFunctionComponent/>
			</div>
		);
	}
}

The End (💘)