390885 (23) [Avatar] Offline
How to understand <span>{[<span>©—“</span>]}</span>?
In section 3.10.1, the paragraph is talking about how to render special characters with variables.
If I want to do so, I need to do something special.
And one of the approaches is to break into multiple strings by outputting an array.
The code example is:

Please tell me how to understand the code example and what is the relationship between the code and variables to output.
I feel a little dizzy about that.

If I want to render this span element, browser will display a warning:
Warning: Each child in an array or iterator should have a unique "key" prop. Check the top-level render call using <span>. See https://fb.me/react-warning-keys for more information.

390885 (23) [Avatar] Offline
How to understand &lt;span&gt;{[&lt;span&gt;&copy;&mdash;&ldquo;&lt;/span&gt;]}&lt;/span&gt;?
I add key attribute to the span element so that I can avoid the warning.
The code becomes
<span>{[<span key='spanKey'>&copy;&mdash;&ldquo;</span>]}</span>
Azat Mardan (41) [Avatar] Offline
How to understand &lt;span&gt;{[&lt;span&gt;&copy;&mdash;&ldquo;&lt;/span&gt;]}&lt;/span&gt;?
JSX can output arrays, so you make it an array with special chars inside of an element.


Azat, author of React Quickly