React.js TypeScript Conditional Props - Props that depend on other Props

Published: 30 March 2021
on channel: Bruno Antunes

26,857

1.2k

Conditional props are props that depend on other props values/types. In this video we will look into conditional properties while using react and TypeScript.

This is very useful when we have a prop that should only be set when another prop has a specified value. This can also be used to restrict the type/value of a property depending on another prop.

------
GitHub repository: https://github.com/bmvantunes/youtube...
------
Documentation:
TypeScript Generics: https://www.typescriptlang.org/docs/h...
Discriminating Unions - https://www.typescriptlang.org/docs/h...
Union Types: https://www.typescriptlang.org/docs/h...
Differences Between Type Aliases and Interfaces: https://www.typescriptlang.org/docs/h...
------

Timestamps:
00:00 Introduction
04:06 (1) Discriminating Unions - https://www.typescriptlang.org/docs/h...
10:54 (2) Only one property or the other, not both!
13:30 (3) Panel - prop defaultCollapsed can only be used when collapsable is set
18:12 (4) Dropdown - label and value prop only available when data is an array of objects. Label and Value props have autocomplete for the properties passed in data.

#typescript #react #reactjs
----
Follow me on:
Twitter: / bmvantunes
Dev.to: https://dev.to/bmvantunes
Website: https://brunoantunes.net
GitHub: https://github.com/bmvantunes
LinkedIn: / bmvantunes

Watch video React.js TypeScript Conditional Props - Props that depend on other Props online without registration, duration hours minute second in high quality. This video was added by user Bruno Antunes 30 March 2021, don't forget to share it with your friends and acquaintances, it has been viewed on our site 26,857 once and liked it 1.2 thousand people.