The errata list is a list of errors and their corrections that were found after the product was released.
The following errata were submitted by our customers and have not yet been approved or disproved by the author or editor. They solely represent the opinion of the customer.
Color Key: Serious technical mistake Minor technical mistake Language or formatting error Typo Question Note Update
Version |
Location |
Description |
Submitted by |
Date Submitted |
Other Digital Version |
1
1 |
I couldn't submit this report without entering page and paragraph numbers, but I saw the error in a web page.
I was trying to use the code snippets from the taster chapter of this oreilly book:
https://www.oreilly.com/library/view/what-react-is/9781491996744/ch01.html
1. What Is React? - What React Is and Why It Matters [Book]
Chapter 1. What Is React? React is a library for helping developers build user interfaces (UIs) as a tree of small pieces called components. A component is a mixture of … - Selection from What React Is and Why It Matters [Book]
www.oreilly.com
But there's a typo in the code snippet that stops it from working.
The supplied code looks like this (I just copied and pasted individual snippets from the web page to a single js file):
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
/**
* An individual ToDo item
* @param {Object} props
* @param {String} props.todoItem A ToDo
*/
const Todo = ({ todoItem }) => (
<li>{ todoItem.text }</li>
);
/**
* A todoList with a Todo for each item in todoListData
* @param {Object} props
* @param {Array.<String>} props.todoListData A List of ToDos
*/
const TodoList = ({ todoListData }) => {
const todoListItems = todoListData
.map(todo => <Todo todo={todo} />);
return <ul>{todoListItems}</ul>;
};
const todos = [
{ text: "Go for a run" },
{ text: "Cook dinner at home" },
{ text: "Call Dentist" }
];
const app = <TodoList todoListData={todos} />;
const targetDOMElement = document.getElementById("root");
ReactDOM.render(app, targetDOMElement);
But that code produces an error:
TypeError: Cannot read properties of undefined (reading 'text')
Todo
T:/Development/Sandbox/React/ReactASPCrud/ReactASPCrud/react-ui-crud/src/index.js:11
8 | * @param {String} props.todoItem A ToDo
9 | */
10 | const Todo = ({ todoItem }) => (
> 11 | <li>{ todoItem.text }</li>
| ^ 12 | );
In order to get rid of the error you have to change one line to this, so todo= becomes todoItem=
.map(todo => <Todo todoItem={todo} />);
And then the sample works correctly:
Go for a run
Cook dinner at home
Call Dentist
I'd like to use this OReilly book, but I'm put off by having non-working sample code in the very first chapter. Would you fix this typo?
|
Brian THOMAS |
Oct 27, 2021 |
Other Digital Version |
25
3rd and 4th rows |
"For companies that develop for legacy intranet platforms or those that need to be well supported in places like China or Africa, where computers are not always as up-to-date, React may not be an option. "
I am from China, China is developing very fast. As I know, nowadays, computers are mostly up-to-date in China. This information mentioned in book need to be updated. I suggest not to mention in which country specifically.
|
Wenfei Wang |
Oct 12, 2019 |