Using data from a Vue loop?

Question

Vue.js

How to use data from v-for in h1 (category)?
Even I don’t understand, tell me pliz
maybe I need to somehow write them into a variable, then when I get it I can transfer them to other components
Code:

<div class="categories">
            <div class="wrapper">
              <ul>
                <li v-for="(category, i) in categories" :key="i">
                  <a :href="category.link">{{ category.text }}</a>
                </li>
              </ul>
            </div>
          </div>
          <div class="wrapper">
            <div class="heading">
              <h1>  {{category.text}} </h1>
            </div>
          </div>

Answer 1

While it looks like this, it should be two different components... Into which the desired category value is either taken or propped through the store

Answer 2

This is meaningless code.

<div class="categories">
          <div class="wrapper">
            <div class="heading">
              <h1>  {{category.text}} </h1>
            </div>
          </div>

Answer 3

https://jsfiddle.net/cdofhteu/