1
Talk, you guys, baby?
Can anyone give me a help? I have the following folder structure:
As my application is simple, I am not doing anything connected to bank, I will directly consume a JSON file that will have the information to popular my screens!
In the case of my Cases.Vue file, I have a v-for that populates the information of my data/cases.json, but I’m not able to print the images from the information of that json, someone can help me?
{
"cases": [{
"behance": "https://www.globo.com",
"bg_box": "bg_case_grandeshistorias",
"logo": "./assets/images/cases/logos/uirapuru.png",
"alt": "Colégio Uirapuru",
"name": "Colégio Uirapuru",
"description": "Grandes histórias começam aqui",
"background": "../assets/images/cases/bg/grandeshistorias-bg.jpg"
}, {
"behance": "https://www.terra.com.br",
"bg_box": "bg_case_building",
"logo": "../assets/images/cases/logos/flir.png",
"alt": "FLIR Systems",
"name": "FLIR - Building Store",
"description": "A melhor solução estrutural",
"background": "../assets/images/cases/bg/building-bg.jpg"
}]
}
<template>
<div class="container-fluid p_top_header relative">
<div style="" class="bg_cases"></div>
<div class="row relative">
<div class="col-xs-12 col-sm-6 col-md-4" v-for="case in records.cases">
<a :href="case.behance" target="_blank" class="box_cases" data-bg="#case_pump">
<div class="img_case" :class="case.bg_box"></div>
<div class="content_cases">
<div class="d_table h_full">
<div class="d_table_cell">
<img :src="case.logo" :alt="case.alt">
<h4>{{ case.name }}</h4>
<span>{{ case.description }}</span>
</div>
</div>
</div>
</a>
</div>
</div>
</div>
</template>
<script>
export
default {
name: 'Cases',
data() {
return {
records: require('../data/cases.json')
}
}
}
</script>
In this case this is my Cases.Vue file and my cases.json!
Does anyone know how to guide me to print the logo(<img :src="case.logo" :alt="case.alt">
) for example?
As it stands it makes the following mistake:
1 GET http://localhost:8080/assets/images/cases/logos/empresa.png 404 (Not Found)
The problem is that I can’t definitely figure out the actual path of my image to put correctly in my json! But in my physical structure is in src/Assets/images/cases/logos/logo.png.
If anyone can help me I’d be grateful!
Thank you!