Vue: ax ios: ответ 404 не найден: пока страница существует - PullRequest
0 голосов
/ 29 мая 2020

У меня есть файл GetAnimal.vue, содержащий это:

<template>
    <div>
        <form v-on:submit.prevent="getAnimal()">
            <textarea v-model = "animal"
                name = "animal" type="animal" id = "animal"
                placeholder="Enter your animal here">
            </textarea>

            <button class = "custom-button dark-button"
                type="submit">Get animal</button>
        </form>


        <button class="custom-button" v-on:click = "goTo('/viewanimal')">
            View animal
        </button>
    </div>
</template>

<script>
    import axios from 'axios';

    export default {
        data: function () {
            return {
                name: 'defaultAnimal',
                animal: {
                    name: 'Cat',
                    furColor: 'red',
                    population: '10000',
                    isExtinct: false,
                    isDomesticated: true
                }

            }
        },
        methods: {
            goTo: function(path)  {
                // alert(path);
                this.$router.push({ path });
            },
            getAnimal: function () {
                alert("animals");
                this.info = {
                    "fur-color": "yellow", "population": '51000', "isExtinct":
                        false, "isDomesticated": true
                };

                axios({
                    method: 'get',
                    url: 'http://localhost:8080/getanimal',
                    data: {
                        animal: this.animal
                    }
                });
            }
        }
    }

</script>

внутри маршрутизатора. js он отображается следующим образом:

{
            path: "/getanimal",
            component: () => import('./views/GetAnimal.vue')
}

Когда я от go до http://localhost:8080/getanimal в браузере, я вижу следующее:

enter image description here

(имеет некоторые стили, унаследованные от App.vue)

Когда я нажимаю кнопку Get Animal, отображается предупреждение animal, а затем я вижу это в консоли:

enter image description here

Почему я не могу отправить запрос axios на ту самую страницу, на которой я сейчас нахожусь? Почему я получаю ошибку 404 и как ее исправить?

...