patterntypescriptreactCritical
Set types on useState React Hook with TypeScript
Viewed 0 times
typescriptwithsetusestatereacttypeshook
Problem
I'm migrating a React with TypeScript project to use hooks features (React v16.7.0-alpha), but I cannot figure out how to set typings of the destructured elements.
Here is an example:
I want to force
But I'm sure there is a better way. Also,
Also, worth noting that using
Here is an example:
interface IUser {
name: string;
}
...
const [user, setUser] = useState({name: 'Jon'});I want to force
user variable to be of type IUser. My only successful trial, is doing it in two phases: Typing, then initializing:let user: IUser;
let setUser: any;
[user, setUser] = useState({name: 'Jon'});But I'm sure there is a better way. Also,
setUser should be initialized as a function that takes a IUser as input, and returns nothing.Also, worth noting that using
const [user, setUser] = useState({name: 'Jon'}); without any initialization works fine, but I would like to take advantage of TypeScript to force type checking on init, especially if it depends on some props.Solution
Use this
See the Corresponding Type in DefinitelyTyped
const [user, setUser] = useState({name: 'Jon'});See the Corresponding Type in DefinitelyTyped
Code Snippets
const [user, setUser] = useState<IUser>({name: 'Jon'});Context
Stack Overflow Q#53650468, score: 693
Revisions (0)
No revisions yet.