Yêu cầu thg 8 14, 2021 5:42 CH 110 0 1
  • 110 0 1
+2

Hỏi về loading image trong ReactJS

Chia sẻ
  • 110 0 1

Mọi người cho em hỏi ô Shopee tại sao lúc image chưa load xong lại làm được quả hình như này ạ và làm sao để biết được hình ảnh load xong để mình show hình ảnh lên và ẩn cái ảnh default đi ? Mọi người có thể share cho em key để tham khảo được không ? image.png

1 CÂU TRẢ LỜI


Đã trả lời thg 8 15, 2021 7:39 SA
Đã được chấp nhận
+1

Keyword là lazy loading nha bạn.

Cụ thể cách trang shopee thực hiện ở đây là họ tạo 1 div chồng lên ảnh gốc, trong div này họ set thuộc tính backgroung-image với 1 ảnh nhỏ loại svg nên chắc chắn sẽ ko mất bao nhiêu ms để load ảnh này vào div, sau khi ảnh gốc được load xong thì chỉ việc xóa div này đi. Bước xóa div được xử lý trong sự kiện onload của thẻ <img />.

Chia sẻ
Avatar Thế Anh Bùi @BuiTheAnh
thg 8 15, 2021 10:17 SA

Mình cảm ơn bạn nhiều nhé ❤️

Viblo
Hãy đăng ký một tài khoản Viblo để nhận được nhiều bài viết thú vị hơn.
Đăng kí