在React組件中使用Django靜態文件

Question

下面我在我的Django應用程序中有一個非常基本的反應結構示例。我將如何引用React組件中的靜態文件？我試圖做出反應的頭，並想知道是否有可能從組件內顯示圖像。

Logo.jsx

import React from "react" 

export default class Logo extends React.Component { 
    render() { 
    return (
     <a href="{% url 'index:landing_index' %}"><img src="{% static "img/logo.png" %}"></a> 
    ) 
    } 
} 

NavBarContainer.jsx

import React from "react" 
import Logo from "../components/Logo" 

export default class NavBarContainer extends React.Component { 

    render() { 
     return (
      <Logo /> 
    ) 
    } 
} 

NavBar.jsx

import React from "react" 
import { render } from "react-dom" 

import NavBarContainer from "./containers/NavBarContainer" 

class NavBar extends React.Component { 
    render() { 
    return (
     <NavBarContainer /> 
    ) 
    } 
} 

render(<NavBar />, document.getElementById('navbar')) 

Answer 1

您將需要手動添加靜態路徑或經由一個發送路徑java腳本標記變量。

<script> 
var static_root = {{ STATIC_URL }} 
</script>