I am trying to use this gem:
http://kyleamathews.github.io/react-component-gallery/
So I installed it using npm
npm install react-component-gallery
And I created a React component like this:
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/nike.com-black@2x.png" />
<img src="https://storage.googleapis.com/relaterocket-logos/gopro.com-black@2x.png" />
</ComponentGallery>
);
}
});
However I am getting this error:
JSX value should be either an expression or a quoted JSX t
ext (10:11)
Where line 10 is this:
margin=10
Why is this occurring?
JSX is XML-like. Your attribute values need to be quoted strings, expressions, or other JSX elements. In your case, eg
margin="10"
noMarginBottomOnLastRow={true}
(The second could be "true"
, just giving an example of an expression.)
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.