Description
In the Guide about Conditional Renderering, we have a section where we explain the need to use key to control reusable elements:
https://vuejs.org/v2/guide/conditional.html#Controlling-Reusable-Elements-with-key
This principle applies to componnents as well:
<template v-if="loginType === 'username'">
<label>Username</label>
<my-input placeholder="Enter your username" key="username-input"></my-input>
</template>
<template v-else>
<label>Email</label>
<my-input placeholder="Enter your email address" key="email-input"></my-input>
</template>...and it comes with the additional caveat that component re-use means that its props may be updated, by local state will be preserved, which can leade to unexpected behaviour.
Judging from the flow of the guide, it's logical that we don't talk about it here, because we haven't talked about components yet, at all - That chapter comes later.
The same is true for the section about using key with v-for:
https://vuejs.org/v2/guide/list.html#key
And in the API docs, we don't mention components either:
We also don't come back to this topic in the "Components" chapter (in its current form as well as the upcoming refactor in #1482).
I think we have to make the effect on components more clear in the docs, otherwise it will continue to catch more users by suprise, like in vuejs/vue#7863