Adonis 컨트롤러를 사용하여 만들어진 경로에서 Vue 구성 요소에서 axios 요청을 만들려면 어떻게 합니까?

Adonis 컨트롤러를 사용하여 만들어진 경로에서 Vue 구성 요소에서 axios 요청을 만들려면 어떻게 합니까?

나는 있습니다WidgetController.js데이터베이스에서 CRUD 작업을 수행하는 파일입니다.이 컨트롤러에는 다음이 있습니다.* create (request, response)위젯 특성을 포함하는 응답을 기본적으로 반환하고 데이터베이스에 행을 추가하는 메서드/메소드widgets표. 경로는 다음과 같이 정의됩니다.Route.any('widgets/create', 'WidgetController.create').as('widgets.create').middleware('auth');.나는 되고 싶다.create프론트 엔드의 버튼 클릭으로 트리거되었으며 Vue에서 일반 가져오기를 시도했습니다.

<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>

그러나 Adonis에만 한정되어 있고 Vue에 정의되어 있지 않은 종속성과 함수 때문에 작동하지 않습니다.나는 그것을 배웠습니다.axios내가 원하는 것을 할 수 있을지도 모릅니다.어떻게요?

클라이언트 측에서는 서버 측의 js 파일을 가져오거나 액세스할 수 없습니다.vue.js에서 도니스의 WidgetController.js를 가져오려고 할 때

당신은 'createWidget' 함수에서 HTTP 요청을 하고 WidgetController.create 메서드를 가리켜야 합니다.

Vue의 구성 요소 파일:

<template>
    <div> 
        <button @click="createWidget">Click me</button>
    </div>
</template>

<script type="text/javascript">

    export default{
        name: 'widget',
        data () {
            return{
                WidgetCtrl: WidgetController                
            }
        },
        methods: {
            createWidget () {
                axios.get('/url-point-to-WidgetController.create')
                     .then(response => {
                         // do other stuff
                      });
            }
        }
    }
</script>

Adonis의 WidgetController.js:

'use strict'

class WidgetController {

    * create(request, response) {
       // save widget...
    }

}

module.exports = WidgetController

언급URL : https://stackoverflow.com/questions/45131896/how-do-i-make-an-axios-request-in-a-vue-component-from-a-route-made-using-an-ado