2016-12-06 3 views
0

У меня есть React SimpleImage component, который использует srcSet, чтобы использовать свойство srcset на img.srcset не работает на img

Компонент имеет код:

const image = (<img 
    {...imageStyle} 
    src={src} 
    srcSet={srcsetStr} 
    alt={alt} 
    width={width} 
    height={height} 
    role="presentation" 
    onLoad={onLoad} 
    onError={onFail} 
    />); 

изображение помещается в div:

return (<div {...wrapperStyle}> 
    {statusIndicator} 
    {image} 
    </div>); 

В wrapperStyle определяется как:

const mainWrapperStyle = style({ 
    backgroundColor: 'white', 
    backgroundSize: 'contain', 
    backgroundRepeat: 'none', 
    boxSizing: 'border-box', 
    position: 'relative', 
    width, 
    height, 
} 

Ширина на DIV такая же, как ширина на img ..

Я получаю сообщение об ошибке в 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="[* + *]" 
> 

У меня есть ошибка здесь:

DOMPropertyOperations.js?17f3:142 Failed parsing 'srcset' attribute value since it has an unknown descriptor. 

ответ

0

Использование 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="[* + *]" 
> 

More info in the react docs.

+0

Я использовал 'srcSet' в моем компоненте, атрибут' srcset' в сгенерированной разметке вызывает isssue: https://github.com/vamsiampolu/css-in-js-test/blob/glamor/app/SimpleImage. JS – vamsiampolu

Смежные вопросы