Поэтому я пытаюсь получить свой ответ axios в массиве, и я не знаю, как это сделать

#javascript #vue.js

Вопрос:

Поэтому я пытаюсь получить свой ответ axios со страницы загрузки spring в массив vuejs, и я не знаю, почему, но, очевидно, я не могу использовать split здесь. Я довольно новичок в vue.js так что, пожалуйста, полегче со мной.

Vue.js код:

 // JavaScript source code

new Vue({
    el: '#app',
    data() {
        return {
            urls: [],
            url: ""
        }
    },
    mounted() {
        axios
            .get("http://localhost:91/all/URL")
            .then(response => (this.url = response.data, this.urls = this.url.split(",")))
    }
})
 

HTML:

 <!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <script src="https://cdn.jsdelivr.net/npm/vue@2.6.12/dist/vue.js"></script>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
    <meta charset="utf-8" />
    <title>Home</title>
</head>
<body>
    <div id="app">
        <ul v-for="url in urls">
            <li> {{ url }} </li>
        </ul>
    </div>
    <script src="Script.js"></script>
</body>
</html>
 

консоль выдает следующую ошибку:

 Script.js:14 Uncaught (in promise) TypeError: this.urlfound.split is not a function
    at Script.js:14
 

Комментарии:

1. Каков response.data результат?

2. Также какие ошибки возникают в консоли инструментов разработки браузера (если таковые имеются)?

3. Ошибка указывает this.urlfound , что это не массив. В чем заключается ценность this.urlfound ? Где этот код в вашем вопросе? (Это просто переименование this.url ?)

Ответ №1:

Существует конфликт между именами переменных, в шаблоне у вас есть URL-адрес от v-for, а также в данных определен один и тот же URL-адрес.