Как дать свойство изображению в ReactDOM?

Question

[embiid]

Как компоненту задать свойство для изображения, так же как и дал свойство name.

<script type="text/babel">
            var TeamCard = React.createClass({
                render: function () {
                    return  (
                        <article class="open hidden">
                            <img class="article-img" src="svg/charlotte-hornets.svg" alt={this.props.name} />
                                <h1 class="article-title">
                                    <a href="">{this.props.name}</a>
                                </h1>
                        </article>
                    )
                }
            })

            ReactDOM.render(
                <div>
                    <TeamCard image-path="svg/charlotte-hornets.svg" name="Charlotte Hornets"/>
                    <TeamCard image-path="svg/charlotte-hornets.svg" name="Charlotte Hornets"/>
                </div>,
                document.getElementById("cards")
            )
        </script>

Answer 1

[Владимир Проскурин]

Также, только не разделяйте название свойств дефисом или подчеркиванием.

<script type="text/babel">
            var TeamCard = React.createClass({
                render: function () {
                    return  (
                        <article className="open hidden">
                            <img className="article-img" src={this.props.imagePath} alt={this.props.name} />
                                <h1 className="article-title">
                                    <a href="">{this.props.name}</a>
                                </h1>
                        </article>
                    )
                }
            })

            ReactDOM.render(
                <div>
                    <TeamCard imagePath="svg/charlotte-hornets.svg" name="Charlotte Hornets"/>
                    <TeamCard imagePath="svg/charlotte-hornets.svg" name="Charlotte Hornets"/>
                </div>,
                document.getElementById("cards")
            )
        </script>

PS: вместо class пишите className, такая особенность jsx