Skip to content

Commit 09217c9

Browse files
authored
Add new option for generic forwardRefs (#710)
* Add new option for generic forwardRefs * update README * format
1 parent 4d6be66 commit 09217c9

File tree

2 files changed

+32
-0
lines changed

2 files changed

+32
-0
lines changed

README.md

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1730,6 +1730,22 @@ function ClickableListInner<T>(
17301730
export const ClickableList = forwardRef(ClickableListInner);
17311731
```
17321732

1733+
##### Option 3 - Call signature
1734+
1735+
```ts
1736+
// Add to `index.d.ts`
1737+
interface ForwardRefWithGenerics extends React.FC<WithForwardRefProps<Option>> {
1738+
<T extends Option>(props: WithForwardRefProps<T>): ReturnType<
1739+
React.FC<WithForwardRefProps<T>>
1740+
>;
1741+
}
1742+
1743+
export const ClickableListWithForwardRef: ForwardRefWithGenerics =
1744+
forwardRef(ClickableList);
1745+
```
1746+
1747+
Credits: https://stackoverflow.com/a/73795494
1748+
17331749
#### More Info
17341750

17351751
- https://medium.com/@martin_hotell/react-refs-with-typescript-a32d56c4d315

docs/basic/getting-started/forward-create-ref.md

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -129,6 +129,22 @@ function ClickableListInner<T>(
129129
export const ClickableList = forwardRef(ClickableListInner);
130130
```
131131

132+
### Option 3 - Call signature
133+
134+
```ts
135+
// Add to `index.d.ts`
136+
interface ForwardRefWithGenerics extends React.FC<WithForwardRefProps<Option>> {
137+
<T extends Option>(props: WithForwardRefProps<T>): ReturnType<
138+
React.FC<WithForwardRefProps<T>>
139+
>;
140+
}
141+
142+
export const ClickableListWithForwardRef: ForwardRefWithGenerics =
143+
forwardRef(ClickableList);
144+
```
145+
146+
Credits: https://stackoverflow.com/a/73795494
147+
132148
## More Info
133149

134150
- https://medium.com/@martin_hotell/react-refs-with-typescript-a32d56c4d315

0 commit comments

Comments
 (0)