JSX에서 어떻게 className을 string + {prop}로 설정합니까?

JSX에서 어떻게 className을 string + {prop}로 설정합니까?

---

나는 React에 조금 익숙하고 className을 string + prop으로 설정하려고합니다. 그러나 나는 그것을하는 방법과 그것이 모범 사례인지 확실하지 않습니다.

그래서 내가하려는 것은 분명히 작동하지 않습니다.

<a data-featherlight='string' + {this.props.data.imageUrl}>

이 글을 어떻게 쓸까요?

---

문자열 연결을 사용할 수 있습니다.

<a data-featherlight={'string' + this.props.data.imageUrl}>

또는 Template strings새로운 ES2015 기능 사용

<a data-featherlight={ `string${this.props.data.imageUrl}` }>

---

시도해 볼 수도 있습니다.

<a data-featherlight={'string1' + this.props.data.imageUrl + 'string2'}>

또는

<a data-featherlight={ `string1 ${this.props.data.imageUrl} string2` }>

Link 구성 요소를 사용하는 경우 다음과 같이 연결할 수 있습니다.

<Link to={`getting-started/${this.props.message}`}>
     <h1>Under {this.props.message}/-</h1>
</Link>

참고 URL : https://stackoverflow.com/questions/35148695/in-jsx-how-do-i-set-a-classname-as-string-prop