Question

我正在创建一个项目，其中react无法在Django本地主机上呈现任何内容

index.html

<!DOCTYPE html>
<html lang="en">
    <head></head>
    <body>
        <div id="App">
            <!---all will be define in App.js-->
            <h1>Index.html </h1>
        </div>
    </body>
    {% load static%}
    <script src="{% static "frontend/main.js" %}"></script>
</html>

app.js

import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import Header from './layout/header';

class App extends Component {
    render() {
        return (
        <h1>App.JS</h1>
        )
    }
}

ReactDOM.render(<App />, document.getElementById('app'));

这是我的项目结构：

在运行npm run dev和python manage.py runserver之后，这是一切正常的状态，直到这里：

Answer 1

更改此源代码：

document.getElementById('app')

...对此：

document.getElementById('App')

Answer 2

这是因为您的元素的ID为“ App”，但是您试图将react app钩在元素“ app”上。区分大小写。

Answer 3

document.getElementById区分大小写

React.Js未在Django项目中渲染

3 个答案: