ReactJs：如何从 props 中转义 <p> 封闭数据渲染

Question

我如何转义 <p> 包含来自 props 后端的数据。我想显示我的文本而不用 <p> 在文本周围包含标签。

例如：

props {
 explain: "`<p>`!! Check-in `</p>`"
}

如何将其显示为

`props.explain` as "!! Check-in"

有什么建议

Answer 1

如果您的道具名称为 explain，您可以使用正则表达式： explain.replace(/<p[^>]*>|<\/p[^>]*>/g, "");

所以在反应代码中你可以使用：

render() {
  const { explain } = this.props
  return (
    { explain.replace(/<p[^>]*>|<\/p[^>]*>/g, "") }
  )
}```

Answer 2

正确的方法是从后端删除 html 标签。但是，如果您不能这样做：

myVariable.replace(/<[^>]*>/g, "")

它将删除给定字符串中的所有 html 标签。

ReactJs: How to escape <p> enclosing data rendering from props