在做react项目中，遇到传参的链接无法发生跳转，现场如下
<li key={index}>
<Link to={'details/${newsItem.uniquekey}'} target="_blank">
{newsItem.title}
</Link>
</li>
后来在cmd中，打开node，验证是否是参数传递的语法上出了问题，发现果然是语法问题，自己把反引号（``）写成了英文状态下的单引号('')
image.png
真的是非常粗心了，难怪去搜索相关问题都搜索不到，原来自己是犯了一个低级错误。
不过借此问题，我们来学习一下ES6中的模板字符串~
传统的JS，输出模板通常是这个样子的：
$('#result').append(
'There are <b>' + basket.count + '</b> ' +
'items in your basket, ' +
'<em>' + basket.onSale +
'</em> are on sale!'
);
这样子的写法，需要敲击N个单引号，非常不方便。于是ES6就引入了模板字符串：
$('#result').append(`
There are <b>${basket.count}</b> items
in your basket, <em>${basket.onSale}</em>
are on sale!
`);
一对反引号，从到到位搞定一串输出模板。
【注意】
1、如果要在模板字符串中用使用反引号，需要用反斜杠线转义：
let greeting = `\`Yo\` World!`;
2、如果要在模板字符串中嵌入变量，需要将变量名写在${}之中。变量如果是一个函数的话，可以用${func()}的形式进行调用。
3、如果模板字符串中有多行字符，所有的空格和缩进都会保留在输出之中
$('#list').html(`
<ul>
<li>first</li>
<li>second</li>
</ul>
`);
4、如果你不想保留模板字符串中的空格和换行，可以在反引号外使用trim方法消除它
$('#list').html(`
<ul>
<li>first</li>
<li>second</li>
</ul>
`.trim());
