webpack - not - vue loader

VUE JS 2+WEBPACK No se puede leer la propiedad ''get'' de undefined VUE RESOURCE

Question

Me siento perdido.

He usado vue-cli para mi proyecto. He vuerouter instalado. Todo está bien. Quiero usar view resource en un componente vue pero no puedo encontrar por qué no funciona.

Este es mi main.js (estoy usando el paquete web)

import Vue from ''vue''
import VueRouter from ''vue-router''
var VueResource = require(''vue-resource'')
Vue.use(VueRouter)
Vue.use(VueResource)
const router = new VueRouter({
routes: [{
path: ''/'',
component: require(''./components/index.vue'')
},
{
path: ''/products/stock'',
component: require(''./components/stock.vue'')
},
{
path: ''/products/seo'',
component: require(''./components/seo.vue'')
},
{
path: ''/settings'',
component: require(''./components/settings.vue'')
}
]
})
new Vue({
el: ''#app'',
router,
data: {
message: ''Hello Vue!''
},
mounted: () => {
console.log("APP MOUNTED")
},
render: h => h(require(''./App.vue''))
})

cuando voy a / # / product / seo, aparece el código:

<template>
<div id="app">
Seo tabs du fastmanager {{ message }}
<input type="text" name="" v-model="message">
</div>
</template>
<script>
export default {
data: () => {
return {
message: "Hello buddy"
}
},
mounted: () => {
console.log("SEO MOUNTED")
this.$http.get(''/'').then((response) => {
// success callback
}, (response) => {
// error callback
});
}
}
</script>
<style lang="css">
</style>

Tengo este error en la consola JS.

seo.vue? 468d: 18Tipo de error capturado: no se puede leer la propiedad ''get'' de undefined (...)

El recurso Vue funciona bien en main.js.

Entonces, creo que es porque la vista se carga antes que la aplicación. No se como hacer Lo siento por el mal inglés.

Answer 1

Ok, he encontrado IT.

en mi seo.vue pongo esto:

<template>
<div id="app">
Seo tabs du fastmanager
<textarea type="text" name="" cols="40" rows="10" v-model="message"></textarea>
<button type="button" v-on:click="test" name="button">Test</button>
</div>
</template>
<script>
var Vue = require(''vue'')
export default {
data: () => {
return {
message: "Coucou"
}
},
mounted: function()
{
console.log(this)
},
methods: {
test: function(){
Vue.http.get(''https://jsonplaceholder.typicode.com/posts/1'').then((response) => {
console.log("SUCCESS",response);
this.message = response
}, (response) => {
console.log("ERROR",response);
// error callback
});
}
}
}
</script>
<style lang="css">
</style>

Un dit funciona bien.