4
我使用broswerify翻譯我的JSX代碼。但是，我怎樣才能插入Django模板變量來反應代碼後，它已被轉換爲JavaScript？例如：如何使用Django模板ReactJS
在我的Django views.py：
def index(request):
return render(request, 'index.html', {"hello":"hello"})
在component.jsx
var React = require('react')
var ReactDOM = require('react-dom');
var Component = React.createClass({
render: function(){
return (
<div>{this.props.content}</div>
);
},
});
然後使用browserify -t [ babelify --presets [ react ] ] component.jsx -o bundle.js來component.jsx轉換爲bundle.js。
index.html中：
<html>
...
<body>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.7/react.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.7/react-dom.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.23/browser.min.js"></script>
<div id="container"></div>
<script src="bundle.js"></script>
<script type="text/babel">
ReactDOM.render(
<Component content={{hello}} />,
document.getElementById('container')
);
</script>
</body>
<html>
的問題是，index.html中，瀏覽器抱怨<Component>未定義因爲browserify已JSX轉化爲原始的JavaScript代碼。