TTC
Theo's Typesafe Cult•8mo ago
Mr.T 🐻⛓

Why do I have to check if function is null inside an if?

Hello everyone, sorry for the very generic question, but I can't seem to find an answer and I'm a bit confused, let's see with an example: 
          
{props.showForm && (
          <DropdownMenuItem onClick={() => props.showForm()}>
            <span>Log result</span>
        </DropdownMenuItem>
  )}
          
{props.showForm && (
          <DropdownMenuItem onClick={() => props.showForm()}>
            <span>Log result</span>
        </DropdownMenuItem>
  )}
Does anyone know why this has an error Cannot invoke an object which is possibly 'undefined' even though I've made the check inside the if? Thanks in advance!
Solution:
It’s because you’re making an arrow function that relies on accessing props.showForm() off of the object From the time props.showForm is check and called it could become undefined because it exists on an object, to try this out below that line set props.showForm to undefined and see what happens To fix it, assign showForm to a constant variable and check the variable instead, then call the variable...
Jump to solution
3 Replies
whatplan
whatplan•8mo ago
this is impossible to answer without more code what if statement?
Solution
Rhys
Rhys•8mo ago
It’s because you’re making an arrow function that relies on accessing props.showForm() off of the object From the time props.showForm is check and called it could become undefined because it exists on an object, to try this out below that line set props.showForm to undefined and see what happens To fix it, assign showForm to a constant variable and check the variable instead, then call the variable const showForm = props.showForm …
Mr.T 🐻⛓
Mr.T 🐻⛓•8mo ago
Smart! Thanks for your help!
Want results from more Discord servers?
Add your server
More Posts
Uploading Files in T3-StackI have a question , I got a project from someone that used T3-Stack to upload files to the database Unable to reduce bundle sizeHi, I'm using webpack to reduce the final bundle size but node module size is too big (screenshot), Selfhostable object storage for ct3a (next, trpc)I've been building an app with ct3a for school project. I need image uploads but everything needs toCall Next api route handlers in from RSC?Is it possible to call an api route from an RSC in Next? (assuming you're NOT using SSG) Tim's commT3 Turbo : Error: Cannot find module 'autoprefixer'I am coming back to t3 for dev testing. I cloned the t3 turbo repo and am getting an error when runnHas anyone had any success unit testing components which use tRPC apis?I'm having a difficult time wrapping my head around testing react components that use trpc apis. AnNestjs not returning the body of the request using @Body decoratorThis code @Post('signup') signup(@Body() dto: AuthDto) { console.log('Received DTO + :', dto); T3 - How to create a User record on Clerk signin (i.e. proper way of keeping track of user info)Hello, is there a way to creat/upsert a User into a User schema when someone logs into your app viaReact hook form context zodWhy is the error in Input not showing after submitting form? It looks like context breaks a subscripUsing CloudFormation with NextJSI've been recently looking into using AWS CDK / Cloud Formation (still a bit confused?). However to