如何获得 - 在插值时显示为em破折号

Posted 2021-03-30

在我正在处理的页面上，我正在尝试将博客文章的标题读作Sleep—It's frustratingly Important.，其中Sleep和It's之间存在冲突。以前我把这个硬编码为

<h2 class="post-title"><router-link to="/posts/1">Sleep&#8212It's frustratingly Important. </router-link></h2>

哪个工作正常。我想概括一下，所以在我的Rails后端我将帖子标题存储为Sleep&#8212It's frustratingly Important.。但是当我通过插值插入帖子标题时

<h2 class="post-title"><router-link to="/posts/1"> {{ this.posts[0].title }} </router-link></h2>

它不会插入em破折号。它显示为“睡眠＆＃8212令人沮丧的重要。”

为什么html不能识别＆＃8212应该改成em破折号？我该如何解决这个问题？

答案

{{和}}之间的内容预计将以纯文本形式解析。它被转换为文本节点。它不会被视为HTML。

如果你想要一个em-dash，那么使用真正的em-dash：—。

你也可以看一下dangerouslySetInnerHTML，但它的命名方式是有原因的。