[英]srcset not working on img
I have a React SimpleImage component which uses srcSet
to use the srcset property on the img.我有一个React SimpleImage 组件,它使用
srcSet
来使用 img 上的 srcset 属性。
The component has the code:该组件具有代码:
const image = (<img
{...imageStyle}
src={src}
srcSet={srcsetStr}
alt={alt}
width={width}
height={height}
role="presentation"
onLoad={onLoad}
onError={onFail}
/>);
The image is placed in a div
:图像放置在
div
中:
return (<div {...wrapperStyle}>
{statusIndicator}
{image}
</div>);
The wrapperStyle is defined as: wrapperStyle 定义为:
const mainWrapperStyle = style({
backgroundColor: 'white',
backgroundSize: 'contain',
backgroundRepeat: 'none',
boxSizing: 'border-box',
position: 'relative',
width,
height,
}
The width on the div is the same as the width on the img
.. div 上的宽度与
img
上的宽度相同。
I get an error in the generated markup's srcsert
property which looks like this:我在生成的标记的
srcsert
属性中收到一个错误,如下所示:
<img
srcset=" https://webkit.org/demos/srcset/image-src.png 1x
https://webkit.org/demos/srcset/image-2x.png 2x
https://webkit.org/demos/srcset/image-3x.png 3x
https://webkit.org/demos/srcset/image-4x.png 4x" width="800px"
height="800px" role="presentation"
src="https://webkit.org/demos/srcset/image-src.png"
data-css-44fijj="[* + *]"
>
I have an error here:我这里有一个错误:
DOMPropertyOperations.js?17f3:142 Failed parsing 'srcset' attribute value since it has an unknown descriptor.
Use srcSet
instead of srcset
: 使用
srcSet
而不是srcset
:
<img
srcSet=" https://webkit.org/demos/srcset/image-src.png 1x
https://webkit.org/demos/srcset/image-2x.png 2x
https://webkit.org/demos/srcset/image-3x.png 3x
https://webkit.org/demos/srcset/image-4x.png 4x" width="800px"
height="800px" role="presentation"
src="https://webkit.org/demos/srcset/image-src.png"
data-css-44fijj="[* + *]"
>
import meal1x from '../images/meal.jpg';
import meal2x from '../images/meal@2x.jpg';
import meal3x from '../images/meal@3x.jpg';
<img
className='meal'
src={meal1x}
srcSet={`${meal1x} 1x, ${meal2x} 2x, ${meal3x} 3x`}
/>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.