javascript - How to create dynamic href in react render function? -
i rendering list of posts. each post render anchor tag post id part of href string.
render: function(){ return ( <ul> { this.props.posts.map(function(post){ return <li key={post.id}><a href='/posts/'{post.id}>{post.title}</a></li> }) } </ul> );
how do each post has href's of /posts/1
, /posts/2
etc?
use string concatenation:
href={'/posts/' + post.id}
the jsx syntax allows either use strings or expressions ({...})
values. cannot mix both. inside expression can, name suggests, use javascript expression compute value.
Comments
Post a Comment