当前位置: 首页 > 面试题库 >

jsx和React中的动态标签名称

慎星纬
2023-03-14
问题内容

我尝试编写一个React组件。对于html标题标签(h1,h2,h3等),其中标题优先级根据我们在道具中定义的优先级动态变化。

这是我尝试做的。

<h{this.props.priority}>Hello</h{this.props.priority}>

预期输出:

<h1>Hello</h1>

这是行不通的。有什么可能的方法可以做到这一点?


问题答案:

无法就地执行此操作,只需将其放在变量中(首字母大写):

const CustomTag = `h${this.props.priority}`;

<CustomTag>Hello</CustomTag>


 类似资料:
  • 我试着为html标题标签(h1,h2,h3等)写一个React组件,其中标题优先级根据我们在props中定义的优先级动态变化。 这就是我要做的。

  • 问题内容: 我正在尝试根据组件的类型动态呈现组件。 例如: 那给我一个编译时的错误(使用browserify进行gulp)。我使用数组语法的地方应该是XML。 我可以通过为每个组件创建一个方法来解决此问题: 但这将意味着为我创建的每个组件提供一种新方法。必须对此问题有一个更优雅的解决方案。 我很乐意提出建议。 问题答案: 编译为,它期望将字符串(HTML标记)或函数(ReactClass)作为第一

  • 我正在寻找渲染基于字符串的组件。本质上,我希望找到相当于JavaScript动态函数名能力的JSX()。 所以,如果我有一个字符串,比如

  • 问题内容: 我正在尝试在JSX内部使用pre标签。当您在JSX中使用pre标签时,它根本不格式化。为什么?为了使用pre标签,我需要执行以下操作: 为什么? 问题答案: 使用模板文字 模板文字允许使用多行字符串,以保留前导/尾随空格和换行符。

  • 我有一个组件文件夹。它们用一个文件公开,如下所示: 我有一个名为Status的JSX组件,如下所示: 它的任务是加载命名组件的行。 然后我有一个名为的组件,看起来像这样: 从'react'导入React 通过

  • 问题内容: 我正在使用Jersey和JAXB构建简单的RESTful Web服务,我将HashMap从’String’转换为’Integer’: 我需要生成一个如下所示的XML响应: 用JAXB生成动态标签名的最佳方法是什么? 问题答案: 您可以使用-annotated属性并将元素返回为s: 这种方法很丑陋,但比它产生的XML丑陋。