如何调用返回）VAR（

我可以创建使用return()两种显示2个const包含数字作为值输出：如何调用返回）VAR（

return (
    <div> 
    <span>{const_one}</span> {const_two} 
    </div> 
)

如果随机布尔var statement = true我要输出

return (
    <div> 
    {const_one} 
    </div> 
)

每当我在return()内使用if()函数时，都会出现错误。我怎样才能做到这一点？我试图创建一个const检查状态并创建另一个const，包括输出：

const statement = false; 
// or 
const statement = true; 

let customOutput = '<span>{const_one}</span> {const_two}'; 

if (statement === true) customOutput = const_one; 

return (
    <div> 
    {customOutput} 
    </div> 
)

在这个例子中const_one或const_two标签显示为HTML文本，而不是显示它们的值（这实际上是数字）：

<span>{const_one}</span> {const_two}而不是<span>24</span> 36。

如何更改标记以显示内部的{customOutput}

来源

2016-07-22 Marian Rick

您可以使用此三元运营商const值：

return (
    <div> 
    {statement 
     ? const_one 
     : <span><span>{const_one}</span> {const_two}</span>} 
    </div> 
);

来源

2016-07-22 11:49:28 amann

有没有在你的代码中的语法错误？我收到了一个错误，并将其应用于我的更复杂的代码中，该代码表示“解析错误：意外的令牌”。它的写法如下：'{pastDate ？数据： {item.teams &&（item.teams.length）}/ {data}}' –

它像在你的例子中那样在'span'中包装整行时起作用。为什么会出现这种情况，因为整个语句被封装在'div'中，并且'const_one'在没有被封装的情况下工作？ –

这是JSX的限制。如你所知，在浏览器能够执行之前，JSX必须被编译为'React.createElement'调用。如果删除外部跨度，则生成的JavaScript代码将包含错误。你可以在这里阅读更多关于它的信息：https：//facebook.github.io/react/docs/jsx-in-depth.html – amann

如何调用返回）VAR（

回答

相关问题