when html2canvas intercepts an element,
cannot be intercepted when the background-size value of the element background is contain./ / the style of div I set, where the value of backgroundSize is contain
const noDataStyle = {
width: "100%",
height: "calc(100% - 2.2rem)",
backgroundImage: `url(${require("../../../images/noData.png")})`,
backgroundRepeat: "no-repeat",
backgroundPosition: "center",
backgroundSize: "contain"};
< div style= {noDataStyle} > < / div >
in this case, canvas, can be generated but canvas is empty
/ / if background is changed to img, for example:
css:
.noDataStyle {
width: 100%;
height: calc(100% - 2.2rem);}
.noDataStyle > img {
width: 100%;
height: 100%;
object-fit: contain;}
html:
< div className= "noDataStyle"} >
<img src={`${require("../../../images/noData.png")}`}/>< / div >
in this case, canvas, can be generated and the picture is in canvas, but the object-fit:contain of the picture is invalid