2
ReactJSでコーディングを開始したばかりで、todoアプリケーションをビルドする必要があります。 APIコールから受信したToDo項目を表示する際に問題が発生しました。これは私が取得エラーです：マップが未定義のReactJSコードtodoリストapp
キャッチされない例外TypeError：未定義
のプロパティ 'マップ' を読み取ることができませんこれはコードです：
TodoList.js
import React from 'react';
import $ from 'jquery';
import TodoItem from './TodoItem';
class TodoList extends React.Component {
constructor() {
super();
this.state = {
todos: [
{id: 0, title: "", completed: false}
]
};
}
componentDidMount() {
this.loadTodos();
}
loadTodos(event) {
let component = this;
$.getJSON(`https://whispering-thicket-55256.herokuapp.com/todos.json`, function(data) {
console.log(data);
component.setState({
todos: data.todos
});
});
}
renderTodos(todo, i) {
return (
<TodoItem
key={todo.id}
id={todo.id}
title={todo.title}
completed={todo.completed}
createdAt={todo.created_at}
updatedAt={todo.updated_at} />
);
}
render() {
let todos = this.state.todos
return (
<div>
<ul>
{todos.map(this.renderTodos.bind(this))}
</ul>
</div>
);
}
}
export default TodoList;
TodoItem.js
import React from 'react';
import jQuery from 'jquery';
class TodoItem extends React.Component {
componentDidMount() {
this.setState({
id: this.props.id,
title: this.props.title,
completed: this.props.completed,
createdAt: this.props.createdAt,
updatedAt: this.props.updatedAt
})
}
render() {
console.log(this.props);
return (
<li>{this.props.title}</li>
);
}
}
export default TodoItem;
ここで間違っていることはわかりません。誰かが私を助けてくれることを願っています。私が達成したいのは、リスト内の.json URLのすべてのToDo項目を表示することです。 さらにコード（app.js？）が必要な場合は、それも投稿します！
ありがとうございます！