Question

我有一个对象调用它＆＃34;文章＆＃34;来自API调用，我使用v-for循环来显示它们。

现在，当用户点击其中一篇文章时，我想检索ID，以便我可以使用它来$ router.push查询字符串。

问题是，由于文章是一个数组，我需要正确的索引来检索ID。如何实现这一目标？

以下是HTML示例：

        <article  v-for="(article, index) in articles" v-
        on:click="displayArticle" :index="index">
            <h4>{{ article.title }}</h4>
            <p>{{ article.text }}</p>
        </article>

以下是vue.js代码示例

export default {
data () {
    return {
        articles: []
    }
},
// here I avec a create() that make an API call and push the json in articles.

methods : {
    displayArticle: function() {
    // I don't know ho to retrieve the index 

    // The router part would be something like this
    this.$router.push({ path: '/app/?article_id=', query : {article_id: articleId}}
    }
}

我尝试使用ref，但我只是得到另一个数组。

感谢您的帮助

Answer 1

v-on:click="displayArticle(index)" - 只需将索引传递给您的函数。

如果每篇文章的ID不等于数组中的位置（我认为它不是），那么您应该将每篇文章的ID包含在服务器发送的数据中（以及article.title， article.text应该有article.id）。

Answer 2

非常感谢，我在函数中传递了这篇文章，然后用

检索它

this.articles.indexOf(article);

谢谢，祝你有个美好的一天

在vue.js中的v-for循环中检索id

2 个答案: