将nl2br移植到Javascript/React -如何手动转义文本?
在Javascript/React中,可以使用一些方法手动转义文本,包括将换行符转换为HTML的<br>标签。下面是一种常见的方法:
const text = "这是一段带有换行符的文本。\n这是第二行文本。";
const escapedText = text.replace(/(?:\r\n|\r|\n)/g, '<br>');
console.log(escapedText);
输出结果为:
这是一段带有换行符的文本。<br>这是第二行文本。
import React from 'react';
const text = "这是一段带有换行符的文本。\n这是第二行文本。";
const escapedText = text.replace(/(?:\r\n|\r|\n)/g, '<br>');
function MyComponent() {
return <div dangerouslySetInnerHTML={{ __html: escapedText }} />;
}
export default MyComponent;
这样,组件中的文本将被正确地转义并显示为带有换行的文本。
需要注意的是,使用dangerouslySetInnerHTML属性时要谨慎,确保转义后的文本是可信的,以防止XSS攻击。
以上是将nl2br移植到Javascript/React的一种方法,通过手动转义文本,可以实现将换行符转换为HTML的<br>标签。
没有搜到相关的沙龙
领取专属 10元无门槛券
手把手带您无忧上云