Navigation Mixin with If statements

Question

I have a task where I need to create LWC that has two if statements and NavigationMixin. The logic is if the account has account number and it's revenue is not less than $1000, then open a window with a new account that has some predefined values. Please, see attached code.

import { LightningElement, api, track, wire } from 'lwc';
import { NavigationMixin } from 'lightning/navigation';
import getAccounts from '@salesforce/apex/accountAura.getAccounts';
import { encodeDefaultFieldValues } from 'lightning/pageReferenceUtils';
import { ShowToastEvent } from 'lightning/platformShowToastEvent';

export default class HelloWorld extends NavigationMixin(LightningElement)  {
    @api recordId;

    @track activeStatus='';
    @track accNumber=0;
    @track accRevenue=0;
    @track error=undefined; 
   
    //accessing fields and assigning them to variables
    @wire(getAccounts, {accountID:'$recordId'})
     wiredRecord(result) {
       
       if (result.data) {
         this.error = undefined;
         
         this.activeStatus = result.data.Active__c;
         this.accNumber = result.data.AccountNumber;
         this.accRevenue=result.data.AnnualRevenue;
         
       } else if (result.error) {
         this.error = result.error;
         console.log(result.error);
         this.dispatchEvent(
           new ShowToastEvent({
               title: 'error',
               message: result.error.body.message,
               variant: 'error'
           })
       );     
       }
     }
     
 
     //fire event when user push the button 
     connectedCallback(){
 
         if (this.accNumber==null)
   {
     this.dispatchEvent(
         new ShowToastEvent({
             title: 'error',
             message: 'Account Number cant be null',
             variant: 'error'
         })
     );  
        
     return;    
   }  
 
   else if (this.accRevenue<1000){
    
     this.dispatchEvent(
         new ShowToastEvent({
             title: 'error',
             message: 'You cant submit because Account Revenue is less than $1,000',
             variant: 'error'
         })
     );  
      
     return;  
     
 
   }
   
     else { 
 
           navigateToNewContactWithDefaults();
    
          }
 
   }
 
     //function with default values
     navigateToNewContactWithDefaults() {
         const defaultValues = encodeDefaultFieldValues({
             AccountNumber: this.accNumber,
             AnnualRevenue: this.accRevenue,
             Active__c: 'Yes'
         });
 
         console.log(defaultValues);
 
         this[NavigationMixin.Navigate]({
             type: 'standard__objectPage',
             attributes: {
                 objectApiName: 'Account',
                 actionName: 'new'
             },
             state: {
                 defaultFieldValues: defaultValues
             }
         });
     }
}

For some reason, the LWC ignores if statements and open the window anyway.

Can I use NavigationMixin and if statements in one LWC? How can I fix this issue?

Thank you, in advance.

Answer 1

The connectedCallback() lifecycle hook fires when a component is inserted into the DOM.

@Wire Adapter is called after connectedCallback() lifecycle invoked.

Update your code to check the condition inside the wire response.