正确的方法(如果可能的话)将JSX代码存储到Javascript变量中

前端之家收集整理的这篇文章主要介绍了正确的方法(如果可能的话)将JSX代码存储到Javascript变量中前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我使用ReactJs的JSX语法编写了以下代码
import { Link } from 'react-router';

class SidebarMenuItem extends React.Component {

render() {

    var href = (this.props.submenu ? 'javascript:' : {<Link to="mod/admin" + this.props.link />};

    return ( 

        <a href={href} onClick={this.selected}>
            <i className={'fa ' + this.props.icon} />
            <span>{this.props.title}</span>
        </a>

    )
  }
}

但它发现我无法将直接JSX代码存储到变量中,因为我收到以下错误

Module build Failed: SyntaxError: D:/9. DEV/client/components/App/SidebarMenuItem.js: Unexpected token,expected,(41:52)

  40 | 
> 41 |      var href = (this.props.submenu ? 'javascript:' : {<Link to="mod/admin" + this.props.link />};
     |                                                        ^

链接组件存储在href变量中的正确方法是什么?

解决方法

你只需编写简单的jsx,在你的情况下你需要删除jsx周围的括号,然后在“mod / admin”this.props.link部分周围包括括号,就像你在render方法中写一样.
var href = this.props.submenu ? 'javascript:' : <Link to={"mod/admin" + this.props.link} />

猜你在找的JavaScript相关文章