未捕获的TypeError：无法读取未定义-ReactJS的属性“checked”
我试图在ReactJS中创建一个简单的TODO列表应用程序。我的基本反应不是很清楚，所以我被困在这里。
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>React TODO</title>
<script src="../../build/react.js"></script>
<script src="../../build/react-dom.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.24/browser.min.js"></script>
</head>
<body>
<div id="example"></div>
<script type="text/babel" lang="ja">
var TodoList = React.createClass({
Checked: function(e) {
alert("Checked");
},
render: function() {
var createItem = function(item) {
return <li key={item.id}>{item.text}<input type="checkbox" onChange={this.Checked} /></li>;
};
return <ul>{this.props.items.map(createItem)}</ul>;
}
});
var TodoApp = React.createClass({
getInitialState: function() {
return {items: [], text: ''};
},
onButtonClick: function(e) {
this.setState({text: e.target.value});
},
handleSubmit: function(e) {
e.preventDefault();
var nextItems = this.state.items.concat([{text: this.state.text, id: Date.now()}]);
var nextText = '';
this.setState({items: nextItems, text: nextText});
},
render: function() {
return (
<div>
<h3>TODO</h3>
<TodoList items={this.state.items} />
<form onSubmit={this.handleSubmit}>
<input onChange={this.onButtonClick} value={this.state.text} />
<button>{'Add #' + (this.state.items.length + 1)}</button>
</form>
</div>
);
}
});
ReactDOM.render(<TodoApp />, document.getElementById('example'));
</script>
</body>
</html>每生成一个列表，都会给它分配一个复选框。如果没有onChange事件to复选框，代码工作正常。但是当“checked”函数被分配给它时，就会产生错误。
共有1个答案
您需要为.map设置this（您可以通过.map中的第二个参数来完成此操作）
return <ul>{this.props.items.map(createItem, this)}</ul>;
示例
因为现在在CreateItem中，这个引用全局（在浏览器中它将是窗口)得分（或者如果您使用Strict模式这个将是未定义)
var createItem = (item) => {
return <li key={item.id}>
{item.text}<input type="checkbox" onChange={this.Checked} />
</li>;
};
return <ul>{this.props.items.map(createItem)}</ul>;
示例
-
问题内容： 如果这个问题已经回答，我深表歉意。我尝试搜索解决方案，但找不到适合我的代码的任何解决方案。我还是jQuery新手。 对于两个不同的页面，我有两种不同类型的粘滞菜单。这是两者的代码。 我的问题是，底部粘性菜单的代码不起作用，因为第二行代码会引发错误，提示“未捕获的TypeError：无法读取未定义的属性’top’”。实际上，除非将第二行以下的其他jQuery代码放在第二行之上，否则根本不
-
问题内容： 我收到此错误，它源自jquery框架。当我尝试在文档准备好加载选择列表时，出现此错误。我似乎找不到我为什么收到此错误的信息。 它适用于change事件，但是尝试手动执行功能时出现错误。 未捕获的TypeError：无法读取未定义的属性’toLowerCase’-> jquery-2.1.1.js：7300 这是代码 问题答案： 当您调用DOMReady时，的上下文将不是元素。 您可以通
-
问题内容： 我有一些JavaScript代码会给出此错误 码 这个错误是什么意思？ 问题答案： 好像您的值之一，属性键为“值”是未定义的。在执行if语句之前测试，和是否已定义：
-
我刚开始使用D3，在我的演示脚本中出现了以下错误- firstd3.jsp:31未捕获的TypeError：无法读取未定义的属性“linear” 我的演示代码如下 是什么导致了这个错误？以及如何解决
-
我发现很多回答的问题与我的问题相似，但所有这些元素实际上都是“未定义的”。就我而言，它是存在的。 我的代码按预期工作。基本上，它将eventListener添加到作为锚的所有模式解除按钮中。关闭函数是找到最外层的modal div，并为其提供“hidden”类，该类将其显示设置为none。 它正确地关闭了模态，但在模态关闭后，该错误就会出现。 约会。js:61未捕获类型错误：无法读取未定义的属性“
-
我遵循这一点，使用DataTables插件启用多个表（在同一页上）。对于手动表，它可以工作，但对于动态创建的表，它显示以下错误： 未捕获的TypeError:无法读取未定义的属性“mData” 我的页面srcipt: 我的超文本标记语言第一个表： 第二张表： 知道怎么修吗？ 注意：我也阅读了这个未回答的问题，相同的错误，但我的标准不同，因此它不是重复的。