@LehaRybkoha

Как менять определённый атрибут при отрисовке списка во vue.js?

Я только начинаю изучать vue и появился вопрос:
Вот к примеру можно отрисовать список с помощью v-for"item in items", а что если в этом теге li есть тег a с атрибутом href, который при каждой отрисовке должен менять свое значение?
<nav class="nav">
	<ul class="nav__list">
	  <li class="nav__item" v-for="item in items":key="item.message">
			<a href="/financeProducts.html" class="nav__item-link">{{ item.navOption }}</a>
		</li>
	</ul>
	<div class="logo">
		<a href="/index.html" class="logo-link">
			<img src="/img/logo.png" alt="Logotip" class="logo-link-pic">
		</a>
	</div>
</nav>
  • Вопрос задан
  • 97 просмотров
Решения вопроса 1
@HikariNoSekai
Middle Front-end Developer at Visata Systems LLC
LehaRybkoha Ну для начала , стрёмная конструкция
href="/financeProducts.html"

Я бы предложил так
<nav class="nav">
  <ul class="nav__list">
    <li class="nav__item" v-for="item in items":key="`${item.id}-navlink`">
      <router-link :to="item.link" class="nav__item-link">{{ item.navOption }}</router-link>
    </li>
  </ul>
  <div class="logo">
    <router-link to="/" class="logo-link">
      <img src="/img/logo.png" alt="Logotip" class="logo-link-pic">
    </router-link>
  </div>
</nav>


И почитайте наконец-то документацию https://router.vuejs.org/ru/api/#router-link
Вы все таки делаете SPA, а не стандартный сайт
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы