reactjs - 将部分文本作为链接。( react - 本地化)

Question

我需要将部分文本标记为链接。就像是: “请使用您的电子邮件登录...”。该文本必须稍后本地化。 我需要“登录”部分作为链接。

当我在渲染方法中执行类似的操作时:

var link = React.DOM.a({
                    href: this.makeHref('login')
                },
                'log in'
            );// or React.createElement or
//var link = <a href={this.makeHref('login')}>
//   'log in'</a>;
<div>{'Please '+ link + ' with your email...'}</div>

它将输出:

Please `[object Object]` with your email...

没有环绕文本，我收到了预期的结果。换句话说:如何让React渲染HTML而不是对象。

这是一个简化的示例 - 我需要插入带有格式标记 {0} 的链接文本，就像在 C# 中一样 - 或任何其他可行的解决方案。

感谢您的帮助!

Answer 1

如果你想在另一个元素中使用一个元素，只需使用花括号，如下所示:

var Component = React.createClass({
  render: function() {
    var link = <a href={this.makeHref('login')}>log in</a>;

    return <div>Please {link} with your email.</div>;
  }
};

您可以在这里看到一个工作 fiddle :https://jsfiddle.net/jrunning/fencjn4x/

如果您打算在未来某个时候对您的应用程序进行国际化，我建议 a) 当您遇到问题时就跨过那座桥，b) 使用像 React Intl 这样的解决方案。而不是尝试通过字符串连接构建自己的解决方案。