将部分文本设为 link.(react - localization)

Question

我需要将部分文本标记为 link。就像是： "Please log in with your email..."。稍后必须本地化此文本。我需要 "log in" 部分成为 link.

当我在渲染方法中做这样的事情时：

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...

没有环绕文字，我得到了预期的结果。换句话说：How to make react render HTML not object.

这是一个简化的示例 - 我需要插入 link 带有格式标记 {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 这样的解决方案而不是尝试使用字符串连接构建您自己的解决方案。

将部分文本设为 link.(react - localization)

Make part of the text as link.(react - localization)

reactjs