Nicc Nicc - 9 months ago 76
React JSX Question

Syntax React single-quote/double-quote <Link to=></Link>

I've used the following code with the usual quotes ' ' or " ".

<Link to={'/view/${post.code}'}>

In the URL it was passing /view/$%7Bpost.code%7D rather than the item ID which not what i wanted

Then using the other single-quote, the URL was returning the correct item ID such as /view/itemID

<Link to={`/view/${post.code}`}>

how comes the usual single-quote or double-quote did not work and i had to use the "other" quotes where the code is exactly the same ?


Because the "other" quotes aka back tick is for template literals which allows embedded expressions.

More here.

Whatever is inside ${} will be interpolated.


var name = "World";
console.log(`Hello ${name}`); \\ will be evaluated to "Hello World";

In your case it remained "/view/${post.code}" when you used single or double quotes and the URL was encoded hence brackets became %7B & %7D and post.code remained un-interpolated.