<Hello name={'\u4ed8\u52a0\u4fa1\u5024\u7a0e# IE9834481A'}></Hello>
class Hello extends Component {
render() {
return (
<div>
{this.props.name}
</div>
);
}
}
上面的两个代码片段工作正常&给出了预期的结果,即转义序列被转换为相关的unicode字符。
现在考虑一下,有一个数组(动态填充),数组的值将是输入标记的默认值&这个数组包含unicode转义序列。
例如:<input value={array[i]}></input>
我试过做<input value={<Hello name={array[i]}></Hello>}></input>
但o/p是对象对象。
如果我在input标记中硬编码字符串,o/p将如预期的那样为<input value={<Hello name={'\u4ed8\u52a0\u4fa1\u5024\u7a0e'}></Hello>}></input>
我应该如何解决这个问题,最终我想用包含unicode转义序列的数组值预先填充输入标记(在转换为unicode字符之后)。
发布于 2020-01-08 15:35:42
console.log(JSON.parse('"\u4ed8\u52a0\u4fa1\u5024\u7a0e# IE9834481A"'));
发布于 2020-01-08 16:29:43
不允许将React Node传递给输入值。这是一个预期的字符串。如果需要Hi
,可以使用函数。
const hello = (name) => `Hi ${name}`;
ReactDOM.render(
<input value={hello('\u4ed8\u52a0\u4fa1\u5024\u7a0e')}></input>,
document.getElementById('root')
);
https://stackoverflow.com/questions/59641168
复制相似问题