在模板vue中循环内部循环

我有这样的JSON:

我在迭代记录,而在循环中,我试图迭代文章。记录。我是这样做的:

<div class="authors__container">
    <b-row class="record"
           v-for="n in authors"
           :key="n.id">
        <b-col sm="3"
               :class=" { 'order-2': n.id % 2 !== 0 } ">
            <img :src="n.image_link" class="author__image" alt="">
        </b-col>
        <b-col sm="9" class="order-1">
            <div class="h2-heading authors__name text-center">
                <h3>
                    {{ n.name }}
                </h3>
            </div>
            <div>
                <b-tabs>
                    <b-tab title="O mnie">
                        <p>
                            {{ n.description }}
                        </p>
                    </b-tab>
                    <b-tab title="Moje artykuły">
                        <ul>
                            <li v-for="i in n.articles" :key="i.id">
                                {{ i.title }}
                            </li>
                        </ul>
                    </b-tab>
                </b-tabs>
            </div>
        </b-col>
    </b-row>
</div>

其中authors只是上面截图中分配给这个JSON的变量。

它正确地在第一条记录上循环,然后在内部循环 <ul> 第二个循环似乎不起作用,它只显示了一个点,没有任何标题。当我代替 {{ i.title }} 仅写入 {{ i }} 它向我展示了:

[{“id”:“10”,“title”:“Narodowa frakcja teatrologw amatorw”},{“id”:“18”,“title”:“Co z symbolik?”},{“id”:“23”,“title”:“O negacji panstwa”},{“id”:“28”,“title”:“O Bibliotes”},{“id”:“49”,“title”:“同性恋骄傲”}]

我也可以这样访问标题 {{ i[0].title }} 但它当然只显示了第一个。如何做到这一点?我想打印文章的每个标题。记录在单独的列表元素中。