My WidgetController.js file is responsible for handling CRUD operations on the database. Within this controller, there is a method/generator called * create (request, response) which returns widget attributes in a response and also inserts a new row into the database's widgets table. The corresponding route is defined as
Route.any('widgets/create', 'WidgetController.create').as('widgets.create').middleware('auth');create method by clicking a button on the frontend, so I attempted to import it within my Vue template:
<template>
<div>
<button @click="createWidget">Click me</button>
</div>
</template>
<style></style>
<script type="text/javascript">
import WidgetController from '/path/to/WidgetController.js';
export default{
name: 'widget',
data () {
return{
WidgetCtrl: WidgetController
}
},
methods: {
createWidget () {
return this.WidgetCtrl.create();
}
}
}
</script>
However, this approach did not work due to dependencies and functions that are specific to AdonisJS and not available in Vue. I have heard about using axios to achieve similar functionality. How can I implement this?