Как я могу использовать значение v-for для ссылки на nuxt?

Question

У меня есть al oop, который проходит по ассоциативному массиву с текстом со ссылками

links: {'Amount' : '/about', 'Contact' : '/contact'}

Как я могу использовать значение из моего для l oop в моей nuxt-ссылке? Так что = "значение"?

  <ul class="link">
      <li v-for="(link, text) in links" :key="text" :value="link">
          <nuxt-link to=link>{{key}}</nuxt-link>
      </li>
  </ul>

Answer 1

Попробуйте это:

<ul class="link">
    <li v-for="(link, index) in links" :key="index">
        <nuxt-link :to="link"> {{ index }}</nuxt-link>
    </li>
</ul>

Answer 2

Ваш код почти правильный. Чтобы использовать JavaScript объекты, вам просто нужно использовать привязку модели, как показано ниже.

  <ul class="link">
      <li v-for="(link, text) in links" :key="text" :value="link">
          <nuxt-link :to="link">{{key}}</nuxt-link>
      </li>
  </ul>

Обратите внимание на :to="link".