The `as` Prop with Defaults
Here we start with the a similar setup to what we had at the end of the last exercise.
This time instead of a Wrapper we have a Link component with some different behavior.
If you don't pass in an as prop, the component will default to an a:
export const Link = <TAs extends
Transcript
00:00 We're starting with the setup that we had at the end of the last video, except that we changed the name of the component from Wrapper to Link. Why have we done that? Well, we've introduced a bit of a change into the behavior of the component. If you don't pass an Asprop there, it's going to default to A.
00:19 And this is expected on the outside too. So it's expected that you shouldn't be able to pass things that don't exist to Link here. And also, this E should be inferred as a React.mouseEvent.html anchor element. So it's expecting that the props here, if you don't pass an As, are supposed to be an A there.
00:39 Now, there is a relatively simple way to get this working. And if you find that relatively simple way, I want you to check if this is still autocompleting for you. So if the Asprop is still working there. I will show you the simple solution,
00:57 and there is a more complicated solution to get it working even despite that. Quite a complex solution, actually. So for this, you will need to make use of, or it will be useful to know about, definitely default generics, or default type arguments in these generics. Conditional types as well.
01:17 And if you don't find this, don't feel too bad. I kind of just want to walk you through what I found that works here. So anyway, with that, good luck. I think you can do it. See you on the other side.
