개발/React
[React] react render 함수에서 a태그의 href값을 동적으로 변경하고 싶을때 .
sungho88
2018. 8. 31. 11:51
render{
const {datas} = this.props;
return (
<ul>
{
this.props.datas.map(data => {
return <li key={data.id}><a href='/url/' + {data.id}>{data.title}</a></li>
}
}
</ul>
);
}
<a href='/url/' + {post.id}>
이 부분을 map 함수 실행되는 동안 고유의 값(id)으로 변경하면서 링크를 생성하고 싶다.
아무리 href속성에서 +를 쓰려해봐도 에러나고, 어떻게 값을 문자열로 변경하여 붙일 수 있을까?
href={'/url/' + data.id}
이렇게 하면 된다.
{} 한 뒤에 그 안에 문자열 + data.id로 작성하면 문자열로 변환되어 map함수로 실행하면 정상적으로 작동된다.