0
私はDjangoとReactを使用しています。未知の不変の違反:_registerComponent(...):対象のコンテナはDOM要素ではありません
私は、このhtmlファイルを表示したい:<script src="{%static "public/bundle.js"%}" type="text/javascript">
:
{% load staticfiles %}
<html>
<head>
<meta charset="utf-8">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"
integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS"
crossorigin="anonymous">
</script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"
rel="stylesheet" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7"
crossorigin="anonymous">
<link href="{%static "css/rankingStyle.css"%}" rel="stylesheet" type="text/css"/>
<link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Raleway" />
<title>Some title</title>
</head>
<body>
<div id="app" />
<script src="{%static "public/bundle.js"%}" type="text/javascript"></script>
</body>
</html>
このファイルには、js
ファイルを参照します。
js
ファイルは、このリアクトファイルから取得されました:
import React from 'react';
import {render} from 'react-dom';
import Criteria from './Criteria.jsx';
import { Button } from 'react-bootstrap';
var App = React.createClass({
getInitialState: function() {
return {showRest: false};
},
toggleShowRest: function() {
this.setState({showRest: !this.state.showRest});
},
render: function() {
return (
<div className="container">
<div className="text-center">
<h1> Title</h1>
<button onClick={this.toggleShowRest} type="button" className="btn btn-primary btn-circle btn-xl">Go</button>
</div>
{this.state.showRest
?
<Criteria />
:
null}
</div>
);
}
});
React.render(<App url="/api/comments"/>, document.getElementById('app'));
ブラウザで、私はこのエラーを取得しています:
:ライン593の前に領域がこのコンテンツを持っているbundle.js:593 Uncaught Invariant Violation: _registerComponent(...): Target container is not a DOM element.
var DOMChildrenOperations = {
dangerouslyReplaceNodeWithMarkup: Danger.dangerouslyReplaceNodeWithMarkup,
これまでのところ、私はここで見ました:Invariant Violation: _registerComponent(...): Target container is not a DOM elementとすべての答えを試しました。
しかし、動作しませんでした。私はこの問題がDjango固有の何かによって引き起こされたと思います。
を 'ReactDOM.render()'メソッド呼び出しの行を投稿してください。 ところで、 'div'は自己閉じの要素ではないので、'
'を使うべきです。これが問題の原因となる可能性があります。 – pawel'ReactDOM.render()'メソッド呼び出しはありません。私は 'React.render()'を使っています。 – octavian
これはReactのバージョンによって同じことです。あなたは分かち合うつもりですか?あなたはdivを閉めようとしましたか? – pawel