Home > Software design >  Change CSS with Nullish Coalescing operator in JavaScript
Change CSS with Nullish Coalescing operator in JavaScript

Time:11-09

*New to Javascript

The code below is a section that changes the image source to the saved one.

Desired result: When there is no source for the image I want to display a 'default.jpg' image.

Perhaps, is there another way to write this logic out as a simple(r) condition?

Attempt

  set_image({
    image_data_url: items.image_data_url ?? "",
    image_filename: items.image_filename ?? image.src = './assets/default.jpg',
  });

Current

  set_image({
    image_data_url: items.image_data_url ?? "",
    image_filename: items.image_filename ?? "No Image",
  });

CodePudding user response:

Is this what you want?

set_image({
  image_data_url: items.image_data_url ?? "",
  image_filename: items.image_filename ?? './assets/default.jpg',
});

CodePudding user response:

i think you want to show default image for "No image found" Please comment if any query.

for this

1) First Option : - use one rror

<img id="currentPhoto" src="https://www.ccrharrow.org/Images/content/953/741209.pg" one rror="this.src='https://www.unesale.com/ProductImages/Large/notfound.png'" alt="">

2)use addeeventlistner,

img.addEventListener('error', function handleError() {

    const defaultImage =
      'https://bobbyhadz.com/images/blog/javascript-show-div-on-select-option/banner.webp';

    img.src = defaultImage;
    img.alt = 'default';
  });

3)use alt fot just text if you want to show text then use alt attribut for img tag.

4)Nullish Coalescing operator is a logical operator that returns its right-hand side operand when its left-hand side operand is null or undefined

    var defaultImage = 'image1.png';
    var noimage = 'noimagefound.png';
    img.src = defaultImage ?? noimage;
    
  
  • Related