Errata

Vue.js: Up and Running

Errata for Vue.js: Up and Running

Submit your own errata for this product.

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
ch2
1/4 scroll


Where it reads:
The number passed to the display-number component is increasing by one every second (remember, the create function is ran when the instance is created), and so the prop is changing once a second. Vue is clever enough to know this, and so it updates the page.

It should read "the created function" instead of "the create function".

Ps:
You should improve this form for safari books readers: we don't have page numbers, and it's not practical to count the paragraph number.

Thank you.

 Ivan Bodnar  Jan 28, 2018 
Chapter 6
Subchapter 'Getters', second code block

The getter "unreadFrom" has a mistake:
The javascript function "filter" is called on the state object but the state object doesn't have a filter function. The messages property of the state object should be used instead.

Current code block (excerpt):
unreadFrom: (state) => state
.filter((message) => !message.read)
.map((message) => message.user.name)


Should be:
unreadFrom: (state) => state.messages
.filter((message) => !message.read)
.map((message) => message.user.name)

 Sandro  Feb 16, 2018 
Appendix B. Vue from React
Subchapter "Getting started", seconds paragraph

"You can also build you own templates to use with vue-cli."

Should be "... build your own ..."

 Sandro  Feb 16, 2018 
Printed all over

Still waiting for the code examples.

 Anonymous  Nov 03, 2018 
Ch 5
Last paragraph of "Programmatic Navaigation" section

Sentence reads: "and to go forward 10 records, you’d use router.go(1)."

It should be, "and to go forward 10 records, you’d use router.go(10)."

 Andrew Brown  Nov 19, 2018 
Ch 6
Second code block in "Promises and Actions" section

The template should be changed to refer to 'updating' rather than 'loading', since that is the name of the data element defined in the component:

template: `<p>
Messages: {{ messages.length }}
<span v-if="loading">(updating…)</span>
<a v-else @click.prevent="handleUpdate">(update)</a>
</p>`

should be changed to:

template: `<p>
Messages: {{ messages.length }}
<span v-if="updating">(updating…)</span>
<a v-else @click.prevent="handleUpdate">(update)</a>
</p>`

 Andrew Brown  Nov 19, 2018 
Appendix B
First code block in "Reactivity" section

In the React code example, there is a reference to counterInterval, but that variable was not previously defined.

 Andrew Brown  Nov 20, 2018 
Printed Page 1-2
jquery example


var $noItemss = $('li')

the code is wrong, it should be var $noItems = $('<li>')

page 2 has the same code, please check them and modify the wrongs.

Thank you.

 gatesakagi  Dec 11, 2018 
Mobi Page 1%
@ Using Cose Examples

The link for the code examples points to github. The repository is present, but contains only the .md file. The "files" folder is empty, except for the git control file. There is another complaint about this in the unconfirmed errata table, from 2 years ago!!

Seems like ORielly doesn't care much about the readers experience once they have paid for the book.

 Anonymous  Jun 19, 2020 
ePub Page 2
Scoped Slots

In Chapter 2. Components in Vue.js, section "Scoped Slots", the example given isn't working:

<div>
<user-data slot-scope="user">
<p v-if="user">User name: {{ user.name }}</p>
</user-data>
</div>

It worked after the following changes.

<div>
<user-data>
<p slot-scope="slotProps">User name: {{ slotProps.user.name }}</p>
</user-data>
</div>

 Shiva YB  Dec 26, 2018 
PDF Page 10
3rd paragraph

The following Vue template
<div v-show="true">one</div>
<div v-show="false">two</div>
results in the following output:
<div>one</div>
<div style="display: none">one</div>

at result the following output will be:
<div>one</div>
<div style="display: none">two</div>

that element style display:none will be two not one.

thank you.

 Mohammad Zare  Dec 07, 2019 
PDF Page 18
2nd paragraph code example

The text talks about v-model, but the code uses v-bind

It says:

It’s important to note that when you use v-model , if you set the value , checked , or selected attributes, they will be ignored. If you want to set the initial value of the input, set it in the data object instead. See the following example:
<div id="app">
<input type="text" v-bind:value="inputText" value="initial value">

So the example should be:

<div id="app">
<input type="text" v-model="inputText" value="initial value">

 Maria Vilaró  Apr 04, 2019 
Printed Page 22
second to last paragraph

"if we push a new item to basketItems, the code inside basketTotal is"
should be
"if we push a new item to numbers, the code inside numberTotal is"

 Jan Voges  Aug 21, 2018 
Printed Page 25
1st code example

"watchers:" should be "watch:"

 Jan Voges  Aug 21, 2018 
ePub Page 48
Chapter 1 / Reactivity / Caveats / Setting items on an array

There is a single quote missing in the following code sample:

vm.dogs.splice(2, 1, 'Bob);

It should be instead:

vm.dogs.splice(2, 1, 'Bob');

 David Dieulivol  May 15, 2020 
ePub Page 53
Chapter 1 / Computed Properties

The first example of this section does not work, as it's missing a "this":

return numbers.reduce((sum, val) => sum + val);

should become

return this.numbers.reduce((sum, val) => sum + val);



Tested with Vue.js v2.6.11

 David Dieulivol  May 15, 2020 
Printed Page 131
3rd paragraph

"and run npm init" should be "and run vue init"

Jan Voges  Aug 22, 2018