Vue requests to change the background-image, because it takes a long time to render, and the background color is white for a period of time.

clipboard.png
Click the button to show that (Bing"s daily wallpaper) is successful, and then when the background of the page changes, it takes time to render, and there will be a white background color. How to solve this?

Feb.26,2021

give a placeholder, replace it after the request is completed


it is recommended not to use background, style to rewrite it with Image, and dynamically change src


in Image onload.

is it possible to give a setTimeout ? Don't assign the value until the request is finished? Try

setTimeout(() => {
    this.img = imgurl
},1000)

Image loading is completed and then assigned

var my_image = new Image();
my_image.src = imgurl;
my_image.onload = () => {
    this.imgUrl = imgurl;
    my_image = null;
}

this space is occupied by a dynamic diagram of loading. Remove the dynamic graph after loading

Menu