如何在Axios + Vue Component + Laravel中設置根目錄以修復javascript中的404 POST

Question

我正在遵循一個教程來學習Vue + Laravel，並在Vue組件腳本的這些行上將Axios用於Ajax請求。 導致我悲傷的錯誤是在控制台日志上：

    POST http://localhost/favorite/2 404 (Not Found)

我的網站在wamp上的本地文件夾中，看起來像問題所在。 我無法使用常規的laravel“ Url（''）幫助器函數來獲取路由目錄。因此，我將如何在javascript中進行此操作，而只是對本地主機站點進行硬編碼，而這對於將其推送到真實服務器中是沒有好處的。未來，謝謝！

http：// localhost / laravel / public /

        methods: {
        favorite(post) {
            axios.post('/favorite/'+post)
                .then(response => this.isFavorited = true)
                .catch(response => console.log(response.data));
        },

        unFavorite(post) {
            axios.post('/unfavorite/'+post)
                .then(response => this.isFavorited = false)
                .catch(response => console.log(response.data));
        }
    }

Answer 1

安裝組件后，創建一個新的axios實例：

mounted() {
    this.axios = axios.create({
        baseURL: 'http://localhost',
    });
}

您甚至可以將基本uri存儲在data屬性中：

data() {
    baseUri: 'http://localhost',
},

mounted() {
    this.axios = axios.create({
        baseURL: this.baseUri,
    });
}

然后，在以后的方法中，您可以使用this.axios 。 請參閱文檔以供參考。

干杯!