反应Javascript显示/解码unicode字符

Question

我有一个unicode字符串,我需要转换.我需要用\ u00f3渲染字符串到ó.这是一个例子,它应该与所有其他类型的角色一起发生,á,í,ú......

我有以下基本代码:https: //jsfiddle.net/dddf7o70/

我需要转换

<Hello name="Informaci\u00f3n" />

成

Información

Answer 1

只需将其作为JS字符串传递:

<Hello name={'Informaci\u00f3n'} />

无需进行任何手动处理(容易出错).

小提琴:https://jsfiddle.net/dddf7o70/5/

Answer 2

如果你必须处理那些由于某种原因\u....而在那些代码中的字符串而不是真正的字母,然后将它们转换为数字,然后使用String.fromCharCode()将这些数字转换成真实的字母.我们可以使用regexp替换为处理函数:

function convertUnicode(input) {
  return input.replace(/\\u(\w\w\w\w)/g,function(a,b) {
    var charcode = parseInt(b,16);
    return String.fromCharCode(charcode);
  });
}

var Hello = React.createClass({
  getInitialState: function() {
    return {
      name: convertUnicode(this.props.name)
    };
  },
  render: function() {
    return <div>Hello {this.state.name}</div>;
  }
});

React.render(
  <Hello name="Informaci\u00f3n" />,
  document.getElementById('container')
);

小提琴:https://jsfiddle.net/dddf7o70/4/

Answer 3

React使用危险的SetInnerHTML属性自动转换unicode 。

请参阅更多信息：https : //reactjs.org/docs/dom-elements.html

export default class Hello extends Component {

render() {
    return (
        <div>
            <div dangerouslySetInnerHTML={{ __html: this.props.name}}></div>
        </div>
    );
  }
}