I am facing a challenge in establishing communication between the API and the Interface. To explain further: I send a JSON file from the API, but I am unable to retrieve it and display it in the Interface. The JSON structure is simple: {"name": "joe"}
My code for the API can be found at (http://localhost:8080/route1)
const jsontest = require('../models/test');
.
.
router.post('/', (req, res) => {
res.send(jsontest);
});
module.exports = router;
On the interface side (http://localhost:8081/)
<template>
.
.
<v-btn x-large color="grey" class="d-flex align-start flex-column mb-6" @click="getData"
>Start</v-btn>
<div v-if="todos">
<li>{{todos}}</li>
</div>
</template>
Continued with:
<script>
import axios from 'axios';
const WorkersURL = 'http://localhost:8080/route1';
export default {
data() {
return{
drawer: false,
todos:''
}
},
methods: {
getData: function()
{
axios.post(WorkersURL)
.then(response => {
console.log(response.data);
this.todos = response.data.name;
})
.catch(e => {
this.errors = e
});
}
},
mounted() {
this.getData;
}
}
</script>
Any assistance on this issue would be highly appreciated.