Задать вопрос
andreys75
@andreys75
vue

Почему Vue не обновляет HTML?

Решил попробовать поработать с vue, но что-то застопорился на простейшем поведении. Никак не могу понять, почему не обновляется внешний вид страницы. Есть вот такой код:

<html>
    <header>
		<script src="https://unpkg.com/vue"></script>
	</header>
	<body>
		<div id="card">
			<div>{{cardData[0]}}</div>
			<div>{{cardData[1]}}</div>
		</div>
		<script>
			var data ={
					cardData:["1","2"],
					showType:true
				};
				
			var app = new Vue({
				el:"#card",
				data: data
				})
		</script>
	</body>
	
</html>

На странице все выводится правильно,
Затем в консоли пишу data.cardData[0]='jgvv', но на странице ничего не меняется:

9f120880f7b747f98f66b7b174c8de4d.png
Что я делаю неверно?
  • Вопрос задан
  • 512 просмотров
Комментировать
Подписаться 1 Оценить Комментировать
Решения вопроса 3
0xD34F
@0xD34F Куратор тега Vue.js
Vue не может отследить прямую установку значения по индексу.

Используйте set: Vue.set(data.cardData, 0, 'hello, world!!');.
Или splice: data.cardData.splice(0, 1, 'fuck the world');.
Ответ написан
Комментировать
Комментировать
@Arik
А если
data.cardData = [123, 321];
Ответ написан
Комментировать
Комментировать
Omashu
@Omashu
#TODO
Vue просто устал

А по теме, просто так data.cardData[0] делать нельзя
Ответ написан
Комментировать
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
Вакансии с Хабр Карьеры
Frontend-разработчик VUE (Senior, Middle+)
SOFT DIVISION • Ярославль
от 150 000 до 300 000 ₽
Fullstack-разработчик (Python, Vue, Nuxt)
Finder
от 200 000 до 300 000 ₽
Fullstack разработчик (Laravel+Vue)
Данафлекс • Казань
от 120 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Автопостинг на вордпрессе
18 мая 2024, в 22:58
3000 руб./за проект
Отрисовать иллюстрацию
18 мая 2024, в 21:07
5000 руб./за проект
Анализ приложения на Flutter
18 мая 2024, в 20:58
5000 руб./за проект
Ещё заказы