使用“`”的es6 jsx语法错误

Question

const { module } = this.props;

return(
    <div className="Card">
        <Link to=`/${module}/detail`></Link>
    </div>
 )

以上语法有什么问题？我得到 JSX value should be either an expression or a quoted JSX text

的错误

Answer 1

在 JSX 中使用 javascript 时，您需要将其用大括号括起来。您在 Link 组件的 to 属性值中使用的模板文字需要大括号。

return (
    <div className="Card">
        <Link to={`/${module}/detail`}></Link>
    </div>
 );

es6 jsx syntax error using "`"