React报错Unexpected template string expression no-template-curly-in-string 求助

你的代码报错原因是模板字符串使用了单引号包裹，ESLint的no-template-curly-in-string规则会禁止在普通字符串里出现${}语法——只有用反引号`包裹的模板字符串，才能解析${props.id}这种变量插入逻辑。

修正后的代码：

<Link to={`/product/${props.id}`}><button>Product Details</button></Link>

如果视频里的代码能正常运行，大概率是视频中用了反引号你没留意，或者视频的开发环境没有启用这个ESLint规则。替换成反引号后，既能正确生成带id的路径，也能消除报错。

内容的提问来源于stack exchange，提问作者Ajmal