反应客户端渲染与Django

问题描述：

我正在整合reactjs与我的django，我已经完成设置，甚至能够呈现从服务器页面，但在客户端，当涉及到渲染和事件处理和附加，我得到错误“未捕获的ReferenceError：MainContainer未定义”。我完全迷失在这里，请帮助我。反应客户端渲染与Django

<html> 
    <head> 
     <link rel="stylesheet" type="text/css" href="static/src/css/bootstrap.min.css"/> 
     <link rel="stylesheet" type="text/css" href="static/src/css/style.less"/> 
    </head> 

    <body> 
     <script> 
        // var INITIAL_DATA = JSON.parse('{{ serialized_value|safe }}') 
        var INITIAL_DATA = {{ serialized_value|safe }} 
     </script> 
     <div id="app">{{ rendered|safe }}</div> 
     <script type="text/javascript" src="static/build/index_webpack.js"></script> 
     <script> 
      // ReactDOM.render(React.createFactory(MainContainer)({isOpen: false, props: {'freeShipping': free_shipping_message_new,'navigationBar': [loose_leaf_content]}}), document.getElementById('app')); 
      ReactDOM.render(MainContainer({isOpen: false, props: {'freeShipping': free_shipping_message_new,'navigationBar': [loose_leaf_content]}}), document.getElementById('app')); 
     </script> 
    </body> 
</html>

'MainContainer'大概是一个阵营的组成部分。组件在'index_webpack.js'中声明或导入了吗？如果是这样，该文件是否正确加载？如果不是，您需要以某种方式将组件导入窗口。 – ChidG

我检查了我的index_webpack.js，组件导入那里，但不知何故，Idk为什么我得到错误！，但如果它不适合我，你能告诉我如何导入窗口？ – Prashant

通常，我会在webpack捆绑包中包含整个javascript（包括您的'ReactDOM.render'行）。这样你就知道它在一个地方。 index_webpack.js是否成功加载？ – ChidG

答

你可能会使用django-webpack-loader，以帮助您的WebPack包集成到Django模板会更好。对于我们来说，将webpack与django一起放置需要花费很多心血。现在，我们没有在所有想到的WebPack，它只是坐在那里，并自动生成所有我们的应用程序，我们可以在包刚刚融入我们的模板与

{% render_bundle 'react_app' %}

反应客户端渲染与Django

相关推荐