Lau*_*ung 32 javascript reactjs react-jsx react-rails
我正在尝试将反应连接到我的应用程序中.它是一个使用rails-rails的rails应用程序(虽然我不认为这是问题的一部分).我目前正在使用一个非常简单的1组件设置:
// react_admin.js.jsx
/** @jsx React.DOM */
var CommentBox = React.createClass({
render: function() {
return (
<div className="commentBox">
Hello, world! I am a CommentBox.
</div>
);
}
});
React.render(
<CommentBox />,
document.getElementById('content')
);
Run Code Online (Sandbox Code Playgroud)
我的html文件包含:
<body>
<div id="content"></div>
<script src="/assets/react.js?body=1"></script>
<script src="/assets/react_admin.js?body=1"></script>
</body>
Run Code Online (Sandbox Code Playgroud)
我可以看到rails-react将我的react_admin.js.jsx转换为react_admin.js,如下所示:
/** @jsx React.DOM */
var CommentBox = React.createClass({displayName: 'CommentBox',
render: function() {
return (
React.DOM.div({className: "commentBox"},
"Hello, world! I am a CommentBox."
)
);
}
});
React.render(
CommentBox(null),
document.getElementById('content')
);
Run Code Online (Sandbox Code Playgroud)
然而,chrome在Render.react()调用中引发了''Uncaught TypeError:undefined不是函数',它在"("和"CommentBox(null)"之间显示)
有人能告诉我我做错了什么吗?
ivn*_*ivn 67
在0.14 React移动后ReactDOM.render(),所以如果你更新React,你的代码应该是:
ReactDOM.render(
<CommentBox />, document.getElementById('content'));
Run Code Online (Sandbox Code Playgroud)
但请确保在项目中包含这两者react.js,react-dom.js因为它们现在是分开的.
Seb*_*oli 15
您应该更新到最新的React库.
一些教程已更新为使用React.render()而不是已弃用React.renderComponent(),但作者仍然提供旧版本或React的链接,这些版本没有最新的render()方法.
我对 React 不太熟悉,但看起来你应该使用React.renderComponent而不是React.render
通过在我的浏览器上运行本地生成的代码rails-react并使用该React对象,看起来该render方法不存在。相反,React包含一个renderComponent方法:

如果您将代码更改为使用React.renderComponent而不是React.render,则组件将在 DOM 上呈现。
您可以在这里看到它的工作原理:http://jsfiddle.net/popksfb0/
| 归档时间: |
|
| 查看次数: |
50624 次 |
| 最近记录: |