Handle null in getter method in LWC

Question

I am creating one UI which populate values from js getters. But I am getting null text in UI when the field is empty in UI.

@wire(..)
case;
 get contactName() {
        return `${getFieldValue(this.case.data, Contact_First_NAME)} ${getFieldValue(this.case.data, 
                  Contact_Last_Name)}`;
      }

HTML UI>

<div> {contactName} </div>

** this is showing below outout if suppose first name is blank in last name is "Test" Output: nullTest****

How to handle this?

Answer 1

Try this.

get contactName() { 
    return `${ getFieldValue(this.case.data, Contact_First_NAME) || "" } ${ getFieldValue(this.case.data,  Contact_Last_Name) || "" }`;
}