我刚开始使用 React,所以这可能是一个非常简单的错误,但我们开始吧。我的 html 代码非常简单:
<!-- base.html -->
<html>
<head>
<title>Note Cards</title>
<script src="http://<url>/react-0.11.2.js"></script>
<!-- <script src="http://<url>/JSXTransformer-0.11.2.js"></script> -->
<script src="http://code.jquery.com/jquery-1.10.0.min.js"></script>
{% load staticfiles %}
<link rel="stylesheet" type="text/css" href="{% static "css/style.css" %}">
<script src="{% static "build/react.js" %}"></script>
</head>
<body>
<h1 id="content">Note Cards</h1>
<div class="gotcha"></div>
</body>
</html>
注意我这里使用的是Django的加载静态文件。 (我的 JavaScript 有点复杂,所以除非有人要求,否则我不会在这里全部发布。)这是错误的行:
React.renderComponent(
CardBox({url: "/cards/?format=json", pollInterval: 2000}),
document.getElementById("content")
);
之后我收到“目标容器不是 DOM 元素错误”,但似乎 document.getElementById("content") 几乎肯定是 DOM 元素。
我看了this stackoverflow 帖子,但它似乎对我的情况没有帮助。
有人知道为什么我会收到该错误吗?
最佳答案
我想通了!
看完this blog post我意识到这一行的位置:
<script src="{% static "build/react.js" %}"></script>
错了。该行必须是 <body>
中的最后一行部分,就在 </body>
之前标签。将线向下移动可以解决问题。
我对此的解释是 React 正在寻找 <head>
之间的 id标签,而不是在 <body>
中标签。因此它找不到 content
id,因此它不是真正的 DOM 元素。
关于javascript - react 错误 : Target Container is not a DOM Element,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26416334/