我正在使用 broswerify 来翻译我的 jsx 代码。但是，在将 Django 模板变量转换为 javascript 后，如何插入它来响应代码？例如：
在我的 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 代码。
您应该将“ReactDOM.render”内容移动到单独的“index.jsx”文件或您的反应应用程序的入口点。''{{hello}}'' 变量应该放在 window 对象上，以便反应组件可以访问它
| 归档时间： |
|
| 查看次数： |
4861 次 |
| 最近记录： |