如果url存在，JSX将div包装在<a>标记中
如果url存在，JSX将div包装在<a>标记中
提问于 2019-01-06 20:46:57
如果添加了url，我会尝试在元素(一个svg图标)周围加上标签。我有：
<Fragment>
{ url && (
<a href={ url }>
) }
<FontAwesomeIcon icon={ myIcon } />
{ url && (
</a>
) }
</Fragment>我一直在为</a>获取Syntax error: Unexpected token (170:7)。我做错了什么？
回答 2
Stack Overflow用户
回答已采纳
发布于 2019-01-06 20:52:49
“我做错了什么？”您认为jsx是html字符串。事实并非如此。JSX是简化React.createElement调用的javascript语法扩展。
您可以将内部部分提取到变量中，并使用三元运算符对其进行有条件的包装
const icon = <FontAwesomeIcon icon={ myIcon } />
return (url ? <a href={url}>{icon}</a> : icon)Stack Overflow用户
发布于 2019-01-06 20:50:42
JSX将</a>标记解析为无效语法，因此您需要使用另一种方法：
<Fragment>
{ url? (
<a href={ url }>
<FontAwesomeIcon icon={ myIcon } />
</a>
) : (
<FontAwesomeIcon icon={ myIcon } />
)}
</Fragment>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/54061628
复制相关文章
相似问题
腾讯云开发者
