2
respostas

Vue-resource não funciona

import Vue from 'vue'
import App from './App.vue'

import VueResource from 'vue-resource'

Vue.use(Vue.resource);

new Vue({
  el: '#app',
  render: h => h(App)
})

Diz que o é delcarado mas nunca é lido, por conta disto meu código não funciona.

<template>
  <div id="app">
    <h1> {{ titulo }} </h1>

    <ul>
      <li v-for-key ="foto in fotos"> 
          <img :src="foto.url" :alt="foto.nome">
      </li>

    </ul>


  </div>
</template>

<script>
export default {
  name: 'app',
  data(){
    return{
      titulo: 'Photos Manager',

      fotos:[
      ]
    }
    },

    created() {
      let promise = this.$http.get("http://localhost:3000/v1/fotos");
      promise
      .then(res =>  json())
      .then(fotos => this.fotos - fotos);   
  }
}
</script>

<style lang="scss">

</style>
2 respostas

Oi Maria tudo certo ?

Quando vamos registrar o módulo no global view, tem um ponto ali:

Vue.use(Vue.resource);

O correto seria:

Vue.use(VueResource);

Boa tarde,

O seu código possui 2 erros, como o amigo acima falou o correto é:

Vue.use(VueResource);

Mas também tem um erro na sua promise, está escrito da seguinte maneira:

    created() {
      let promise = this.$http.get("http://localhost:3000/v1/fotos");
      promise
      .then(res =>  json())
      .then(fotos => this.fotos - fotos);   
  }

Entretanto, deveria ser:

    created() {
      let promise = this.$http.get("http://localhost:3000/v1/fotos");
      promise
      .then(res => res.json())
      .then(fotos => this.fotos = fotos);   
  }