首页 > 解决方案 > 如何将反应组件呈现为纯文本

问题描述

对不起愚蠢的问题。

我有反应应用程序。为我的组件编写文档。而且我想将我的组件作为纯文本插入,但我找不到方法。前任:

import Input from "../components/input";
function DocumentationPage () {
  return (<div>
    Input:
    usage:
    <code> <Input type='login' label={'Login'} value={value} onChange={onChange}></Input></code>
    <Input type='login' label={'Login'}></Input>
  </div>)
}

所以我希望代码标签内的 <Input...> 呈现为纯文本。

标签: reactjs

解决方案


尝试<Input type='login' label={'Login'} value={value} onChange={onChange}></Input>用括号和引号括起来以将其呈现为字符串,如下所示:

import Input from "../components/input";
function DocumentationPage () {
  return (<div>
    Input:
    usage:
    <code>{'<Input type='login' label={'Login'} value={value} onChange={onChange}></Input>'}</code>
    <Input type='login' label={'Login'}></Input>
  </div>)
}

推荐阅读