v-if and v-else on same element has inconsistent (or undocumented) behaviour
Bl00D4NGEL opened this issue · 1 comments
Bl00D4NGEL commented
Vue version
3.4.23 (or earlier) - 3.5.13
Link to minimal reproduction
Steps to reproduce
Reproduction link already shows the issue at hand.
Using v-else and v-if on the same component does not result in what I would consider expected behaviour.
What is expected?
In a case of a v-else and v-if on the same component I would expect either:
- An (compiler?) error when rendering the component
- If the condition in the
v-ifis true / truthy it should not "fall-through" to the else block
What is actually happening?
In case of v-else and v-if being on the same component it will ignore the condition in v-if if there is a component after it that has a v-else block.
System Info
System:
OS: Linux 6.8 Ubuntu 22.04.5 LTS 22.04.5 LTS (Jammy Jellyfish)
CPU: (16) x64 12th Gen Intel(R) Core(TM) i5-12500H
Memory: 14.36 GB / 31.02 GB
Container: Yes
Shell: 5.1.16 - /bin/bash
Binaries:
Node: 20.15.0 - ~/.nvm/versions/node/v20.15.0/bin/node
Yarn: 1.22.22 - ~/.yarn/bin/yarn
npm: 10.8.2 - ~/.nvm/versions/node/v20.15.0/bin/npm
pnpm: 9.7.1 - ~/.local/share/pnpm/pnpm
bun: 1.0.2 - ~/.bun/bin/bun
Browsers:
Chrome: 133.0.6943.53Any additional comments?
No response
edison1105 commented
Don't use v-else and v-if on the same element. This is incorrect usage. Please refer to the documentation for the correct use of v-if/v-else.