<ul>
<li v-for="(skill, i) in skills" :key="skill.name">
<p>
{{i+1}}. {{ skill.name }}-
<span v-if="skill.experience<4">Beginner</span>
<span v-else-if="skill.experience<6">Proficient</span>
<span v-else Expert</span>
</p>
</li>
</ul>
<h1 v-if="awesome">Vue is awesome !</h1>
<h1 v-else-if="sowSow">Vue is not very nice !</h1>
<h1 v-else>Vue is baaaad !</h1>
<div v-if="Math.random() > 0.5">
Now you see me
</div>
<div v-else>
Now you don't
</div>
<div id="app">
<p id="A" v-if="showMessageA">A</p>
<p id="B" v-else-if="showMessageB">B</p>
<p id="C" v-else>C</p>
</div>
<h1 v-if="variable">Vue is awesome!</h1>