Skip to content

Case when v-if v-else throws error and breaks app #4393

@kamax1

Description

@kamax1

Here is an example https://jsfiddle.net/h6azrhhz/

Template:

  <section>
    <template v-if="false">
    </template>
    <template v-else>
      <div v-if="condition" class="my-class">I'm loading</div>
      <div v-else>I'm loaded</div>
    </template>
  </section>

If v-if v-else block nested into another v-if, it produces error

VM205 vue.js:427TypeError: Cannot read property 'attrs' of undefined

when switching value of condition.

As i researched, need 3 conditions to reproduce the issue

  1. Class attr (or another attribute) must be presented presented in nested element
  2. Nested v-else must be presented
  3. v-if v-else must be nested into another v-if v-else

Workaround is to use v-if="condition" and v-if="!condition" instead of v-else

Thanks

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions