#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-адрес.