Javascript 如何在ReactJS中动态设置元素名

如何在reactjs中动态设置元素名？我用这个来显示加密货币图标作为一个列表。使用该库，我们可以获得比特币图标，如

等。假设我已经将加密货币名称数组（Btc、Eth、Sc等）定义为状态调用

crypto

。使用

map

函数如何动态设置元素名称

render(){
 return(
  <div>
   {this.state.crypto.map( crypto => {
    <h3>{crypto}</h3>
    <{crypto} />
   }
  </div>
 )
}

render（）{
返回(
{this.state.crypto.map（crypto=>{
{crypto}
}
)
}

您可以使用

React.createElement

函数动态设置名称。JSX只是对

createElement

函数的合成糖化

render() {    
 return (
  <div>
   {this.state.crypto.map(crypto => {
      const cryptoElement = React.createElement(crypto)
      return <div>
        <h3>{crypto}</h3>
        {cryptoElement}
      </div>
    })}
  </div>
 )
}

render（）{
返回(
{this.state.crypto.map（crypto=>{
const cryptoElement=React.createElement（加密）
返回
{crypto}
{cryptoElement}
})}
)
}

小提琴：

在这里您可以找到有关它的文档：

---

您可以使用

React.createElement

函数动态设置名称。JSX只是对

createElement

函数的合成糖化

render() {    
 return (
  <div>
   {this.state.crypto.map(crypto => {
      const cryptoElement = React.createElement(crypto)
      return <div>
        <h3>{crypto}</h3>
        {cryptoElement}
      </div>
    })}
  </div>
 )
}

render（）{
返回(
{this.state.crypto.map（crypto=>{
const cryptoElement=React.createElement（加密）
返回
{crypto}
{cryptoElement}
})}
)
}

小提琴：

在这里您可以找到有关它的文档：

---

您可以简单地使用变量作为标记：

render（）{
返回(
{this.state.crypto.map（crypto=>(
{crypto}
))}
)
}

您可以简单地使用变量作为标记：

render（）{
返回(
{this.state.crypto.map（crypto=>(
{crypto}
))}
)
}

这给了我一个错误。

对象作为React子对象无效（找到：[object Crypto]）。如果要呈现子对象的集合，请使用数组。在h3（位于currency_main.js:44）中的div（位于currency_main.js:43）中的div（位于currency_main.js:41）中的CryptoList（位于App.js:10）中的div（位于App.js:9）在应用程序中（位于index.js:8）

只有当数组包含类型列表（也称为组件）而不是名称字符串时，此操作才有效。@Omets在您的情况下，它的行为相同，除了传递之外没有其他解决方法functions@pwolaq对，我的错：）因此，@pwolaq如果我使用的是字符串数组，我就不能使用它吗？这给了我一个错误。

对象作为React子对象无效（找到：[object Crypto]）。如果你想呈现子对象集合，请使用数组。在h3中（currency_main.js:44）在div中（currency_main.js:43）在div中（currency_main.js:41）在App（index.js:8）中的div（App.js:9）中的CryptoList（在App.js:10）中

只有当数组包含类型列表（也称为组件）时，这才有效，而不是名称字符串。@在您的情况下，它的行为将是相同的，除了传递之外，没有其他解决方法functions@pwolaq正确，我的错误：）那么，@pwolaq如果我使用的是字符串数组，我就不能使用它吗？嘿，我签入了JSFIDLE，它工作得很好。但是当我将它添加到代码中时，它会给我一个错误，说

警告：正在使用大写HTML。始终在React中使用小写HTML标记。警告：此浏览器无法识别标记。如果要呈现React组件，请以大写字母开头其名称。

为所有数组元素提供此错误，因为它们以大写字母开头（元素也应如此）。无论如何，通过使用使用CSS类的独立库解决了我的问题。好的，如果你想以任何方式解决上述问题，请发布更多的代码。最好是发布一篇文章。嘿，我签了JSFIDLE，它工作得很好。但是当我将它添加到我的代码中时，会出现一个错误，说

警告：正在使用大写HTML。始终是我们React中的小写HTML标记。警告：该标记在此浏览器中无法识别。如果要呈现React组件，请以大写字母开头其名称。

为所有数组元素提供此错误，因为它们以大写字母开头（元素也应如此）。无论如何，通过使用单独的库解决了我的问题，该库使用CSS类。好的，如果您想以任何方式解决上述问题，请发布更多的代码。最好是发布一篇文章。