React 的问题（刚开始学习）答案

【问题标题】：Troubles With React (Barely Starting to Learn It)React 的问题（刚开始学习）
【发布时间】：2020-02-06 07:45:32
【问题描述】：

所以我试图用下面的代码在 Scrimba 中创建一个列表：

import React from "react"
import ReactDom from "react-dom"

ReactDom.render(
  <ul>
    <li>Goanar</li>
    <li>Lam-Ruthadel</li>
    <li>Rambang</li>
 </ul>,
)
document.getElementbyId("root")

但它显示“不变违规：目标容器不是 DOM 元素。(/node_modules/fbjs/lib/invariant.js:42)”

我做错了什么？这可能是我编写代码的方式吗？我被卡住了

【问题讨论】：

标签： javascript reactjs

【解决方案1】：

你很可能放错了右括号：

import React from "react"
import ReactDom from "react-dom"

ReactDom.render(
  <ul>
    <li>Goanar</li>
    <li>Lam-Ruthadel</li>
    <li>Rambang</li>
 </ul>,
 document.getElementbyId("root")
)

目标元素是ReactDom.render() 的第二个参数。

【讨论】：

【解决方案2】：

ReactDom.render 是一个带有两个参数和一个可选回调的方法，请在此处查看此方法的 React 文档： ReactDom.render

所以，在这种情况下，如果方法如下所示：

ReactDOM.render(element, container[, callback])

element 将是您的 <ul>...</ul>，container 是文档“根”元素：document.getElementbyId("root")

总之，它应该看起来像：

import React from "react"
import ReactDom from "react-dom"

ReactDom.render(
  <ul>
    <li>Goanar</li>
    <li>Lam-Ruthadel</li>
    <li>Rambang</li>
 </ul>,
 document.getElementbyId("root")
)

您现在应该已成功安装和渲染。希望这会有所帮助

【讨论】：