如何使用渲染JSON數據做出反應成分

我渲染上得到一個頁面，並通過一個JSON對象，有了它，就像這樣：如何使用渲染JSON數據做出反應成分

/* GET home page. */ 
router.get('/', (req, res, next) => { 
    const message = req.session.message; 
    res.render('index', { data: message }); 
});

這是我index.ejs查看：

<!DOCTYPE html> 
<html> 
    <head> 
    <title>My Title</title> 
    <link rel='stylesheet' href='/stylesheets/style.css' /> 
    </head> 
    <body> 
    <div id='react-app'> Loading &hellip;</div> 
    </body> 
    <script src="/javascripts/build.js"></script> 
</html>

多數民衆贊成所呈現的頁面是index.js：

import React from 'react'; 

import { AppContainer } from 'react-hot-loader'; 
import { Provider } from 'react-redux'; 
import { render } from 'react-dom'; 

import 'bootstrap/dist/css/bootstrap.min.css'; 
import './css/msha.scss'; 

import Store from './store'; 
import TemplateContainer from './components/TemplateContainer'; 

const renderApp = (Component) => { 
    render(
    <AppContainer> 
     <Provider store={Store}> 
     <Component /> 
     </Provider> 
    </AppContainer>, 
    document.querySelector('#react-app'), 
); 
}; 

renderApp(TemplateContainer); 

if (module && module.hot) { 
    module.hot.accept('./components/TemplateContainer',() => { 
    renderApp(TemplateContainer); 
    }); 
}

所呈現的頁面包含一個反應成分。如何在反應組件中訪問這些數據？

來源

2017-08-08 Ansjovis86

你用什麼模板引擎？並顯示你的'索引'查看代碼。 – alexmac

我剛加了我的index.ejs。 – Ansjovis86

我想說最簡單的方法是製作一個快速路由，將數據作爲json返回，而不是試圖通過渲染引擎傳遞它。然後在你的反應應用程序做一個阿賈克斯調用它時，它加載 – azium

的方法之一是將一個對象添加到全球範圍，從組件使用它：

<!DOCTYPE html> 
<html> 
    <head> 
    <title>My Title</title> 
    <link rel='stylesheet' href='/stylesheets/style.css' /> 
    </head> 
    <body> 
    <div id='react-app'> Loading &hellip;</div> 
    <script> 
     window.data = <%- JSON.stringify(data) %>; 
    </script> 
    <script src="/javascripts/build.js"></script> 
    </body> 
</html>

來源

2017-08-08 21:59:16 alexmac

是的，這確實有效。 – Ansjovis86

如何使用渲染JSON數據做出反應成分

回答

相關問題