我是React的新手,所以也许某位专家会很快发现问题。这是我的router.js
:
define(["backbone", "react", "jsx!view/todoList"], function(Backbone, React, ReactDOM, TodoList) {
return Backbone.Router.extend({
routes : {
"" : "index"
},
index : function() {
console.log("hello world");
var todos = new Backbone.Collection([
{
text: 'Dishes!',
dueDate: new Date()
}
]);
React.render(<TodoList todos={todos} />, document.body);
}
});
});
我在控制台中收到以下错误:VM7282:19 Uncaught TypeError: TodoList is not a function
。
也许问题在于弃用的JSXTransformer(https://facebook.github.io/react/blog/2015/06/12/deprecating-jstransform-and-react-tools.html)。建议使用Babel代替(在我的情况下代替jsx!view / todoList来使用babel!view / todoList)。我有一个问题是从哪里导入babel.js。这里http://facebook.github.io/react/docs/displaying-data.html他们导入https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.23/browser.min.js但是当我做同样的babel时!view / todoList无效。
答案 0 :(得分:1)
这可能比React更像是一个Backbone问题。我不熟悉Backbone,但就React而言,这通常是因为你试图使用一些尚未正确导入或定义的组件。
例如,您可能正在尝试:
React.render(<TodoList todos={todos} />, document.body);
未正确导入var TodoList = require('./TodoList')
或实际创建组件。
var TodoList = React.createClass({
render: function() {
// code code code code
}
})
我认为这很可能是问题所在: https://medium.com/react-tutorials/react-backbone-router-c00be0cf1592#.q4bsdqqgr