[英]Concatenate a string and HTML Inside JSX Expression
我正在尝试在 JSX 表达式中连接字符串和 HTML,但我似乎无法正确执行此操作。 我的渲染函数中的代码如下所示:
<span>
{'preferred string' || `Other string ${<a target="_blank" href={someVariable}>text inside link</a>}`}
</span>
我希望它呈现的是:“链接内的其他字符串文本”
它实际呈现的是“其他字符串[对象对象]”
我尝试了几种不同的策略,但没有运气。 任何意见是极大的赞赏。
你想要一些类似的东西:
<span>
{'preferred string' || <p>Other string <a target="_blank" href={variable}>text inside</a></p>}
</span>
关键是添加了段落标签。 在您的代码中,React 正在努力同时解释多种不同的语言。
请记住,此解决方案将与您提供的代码类似,仅在“首选字符串”为空或空时才显示第二个结果,并且按原样进行硬编码以具有某些值,因此后半部分的 or 语句永远不会显示。
编辑:如果您的字符串实际上是变量,那么您需要再次退出“其他字符串”,如下所示:
<span>
{ stringVariable || <p>{otherStringVariable}<a target="_blank" href={variable}>{insideTextVariable}</a></p> }
</span>
如果您只想将字符串与标签连接起来,您可以尝试这种简单的方法:
<>
preferred string || Other string <a target="_blank" href={someVariable}>text inside link</a>
</>
或者,像这样:
<span>
{'preferred string' || <span>Other string <a target="_blank" href={someVariable}>text inside link</a></span>}
</span>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.