sou novo no javascript e pensei em fazer alguns testes com algumas ferramentas (o Vue.js e nuxt.js) para aprender algo novo. Então fazendo um teste que me mandaram (Que se resume em fazer uma página de vagas de emprego) encontrei uma questão que não consigo resolver, que seria:
Eu tenho um array em json de varias vagas de emprego e quais suas requisições para a mesma, porem elas tem algumas inconsistências, como por exemplo:
{
vaga: 'Progamador(a) PHP',
nome_empresa: 'xxxxxxxxx',
url_banner: 'https://yyyyyy.com/hhh.png',
valor: 1500,
area: 'Desenvolvimento',
senioridade: 'Pleno',
tags: [],
cidade: 'São Paulo',
id: '1'
},
Como temos acima, o valor de tags esta vazio, porem ainda é um array, que deveria ser assim:
{ vaga: 'Progamador(a) PHP', nome_empresa: 'xxxxxxxxx', url_banner: 'https://yyyyyy.com/hhh.png', valor: 1500, area: 'Desenvolvimento', senioridade: 'Pleno', tags: ['PHP', 'Laravel', 'MySQL', 'Pleno', 'Bootstrap'], cidade: 'São Paulo', id: '1' },
Para que eu exiba essas informações na tela...
<div class="modal-body">
{{ job.nome_empresa }} está contratando {{ job.vaga }} {{ job.senioridade }}, para trabalhar na área de {{ job.area }} <div v-if="">É preferivel skills em:
<ul>
<li v-for="(tag, i) in job.tags" :key="i" v-if="tag"> {{ tag }} </li>
</ul>
</div>
</div>
Desse jeito, ou seja, eu não quero exibir o que está após o <div v-if="">É preferivel skills em:
quando não tiver nenhuma skill requerida...
Desde já obrigado, e como sou inciante nessa área, se tiverem algum tipo de estudo / vídeo para recomendar, ficaria muito grato também!
v-for="(tag, i) in job.tags"
no<ul>
?