如何在Vue Metronic template Axios中使用我的自定义API

Question

我在使用Template Metronic Vue (演示7)时遇到了麻烦。我很难使用登录/注册默认的Metronic模板，所以我想使用Laravel MIX API创建我的自定义登录/注册和另一个方法CRUD，但当我使用Axios请求API时，请求总是捕捉到错误。

在Metronic templates中访问自定义API有什么特殊的方法吗？

在这段代码中，我想尝试使用console.log()。这是代码：

<b-form class="form" @submit.stop.prevent="onSubmit">

    <b-form-input
    class="form-control form-control-solid h-auto py-5 px-6"
    type="email"
    v-model="this.form.email"
    ></b-form-input>

    <b-form-input
    class="form-control form-control-solid h-auto py-5 px-6"
    type="password"
    v-model="this.form.password"
    ></b-form-input>

    <button type="submit" class="btn btn-primary font-weight-bold px-9 py-4 my-3 font-size-3">
    Sign In
    </button>
</b-form>

<script>
import axios from 'axios'

export default {
    name: 'login',
    data() {
        return {
            form: {
                email: '',
                password: ''
            }
        }
    },
    methods: {
        onLogin() {
        axios.post('http://localhost:8000/api/getUser')
            .then(response => 
            console.log(response)
            })
            .catch(error => {
            console.log('error created')
            console.log(error)
            })
        }
    }
}
</script>

postman console

Answer 1

要使用此代码，您应该删除两项内容：

1. 从main.js

中删除MockService initialization

// Remove this to disable mock API
MockService.init();

1. 从main.js

中删除API初始化

// API service init
ApiService.init();