2016-04-07 3 views
1

Я пытаюсь использовать этот драгоценный камень:Реагировать импорта компонент не признал

http://kyleamathews.github.io/react-component-gallery/

Так что я установил его с помощью npm

npm install react-component-gallery 

И я создал Реагировать компонент, как это:

var Gallery = React.createClass({ 

    render: function() { 
    return (

    <ComponentGallery 
    className="example" 
    margin=10 
    noMarginBottomOnLastRow=true 
    widthHeightRatio=3/5 
    targetWidth=250> 
     <img src="https://example.com/pic1.jpg" /> 
     <img src="https://example.com/pic2.jpg" /> 
     <img src="https://example.com/pic3.jpg" /> 
     <img src="https://example.com/pic4.jpg" /> 
     <img src="https://example.com/pic5.jpg" /> 
     <img src="https://example.com/pic6.jpg" /> 
     <img src="https://storage.googleapis.com/relaterocket-logos/[email protected]" /> 
     <img src="https://storage.googleapis.com/relaterocket-logos/[email protected]" /> 
    </ComponentGallery> 
    ); 
    } 

}); 

Однако я получаю эту ошибку:

JSX value should be either an expression or a quoted JSX t 
ext (10:11) 

Где линия 10 это:

margin=10 

Почему это происходит?

ответ

1

JSX является XML-подобным. Значения ваших атрибутов должны быть указаны в строках, выражениях или других элементах JSX. В вашем случае, например.

margin="10" 
noMarginBottomOnLastRow={true} 

(Второй может быть "true", просто дает пример выражения.)

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