Question: Typescript narrowing between script and "HTML" #13
Comments
|
You could create a new issue in the https://github.com/sveltejs/language-tools/ repo. What I usually do when a type does not match is to create a function that casts the type. SOmething like this: <script lang="ts">
export let partner: Partner | undefined = undefined;
if (!partner) {
partner = new Partner();
}
+ const castPartner = (partner: Partner | undefined) => partner as Partner
</script>
-<span>{ partner.id }</span>
+<span>{ castPartner(partner).id }</span>Or in your specific case you don't need a cast at all: <script lang="ts">
- export let partner: Partner | undefined = undefined;
+ export let partner: Partner = new Partner();
- if (!partner) {
- partner = new Partner();
- }
</script>
<span>{ partner.id }</span>You can also create an internal representation of that param: <script lang="ts">
export let partner: Partner | undefined = undefined;
+ $: _partner = partner || new Partner();
</script>
-<span>{ partner.id }</span>
+<span>{ _partner.id }</span> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Trying to figure something out and I found your documentation but it doesn't address my question. So I was hoping you could answer it and maybe update the docs.
I'm trying to narrow down a variable. My IDE (VS Code) understands that the variable is narrowed in the script (
<script lang="ts">) but not in the "HTML" code outside of the script. Basically, I'm doing this inside of a component:Inside of the script, after the
ifblock, typescript accurately understands that partner is nowPartner.However, I get an error within the --
partner: Partner | undefined -- 'partner' is possibly 'undefined'.My expectation is that since Partner has been narrowed at the end of the script block it'll be narrowed within the HTML as well.
Am I doing something wrong? Is there a workaround?
The text was updated successfully, but these errors were encountered: