Javascript 如何在for循环中获取id并插入函数vue.js

我需要能够抓取id才能发出api请求。目前，我已经尝试了以下方法，但每当我运行此程序时，整个页面都无法引导。如果我删除

配方

，它将重新开始工作

如何将id插入v-for循环中的函数中

{{inf.Id}
{{inf.IngredientCategory}
{{inf.IngredientName}
{{inf.carries}
配方

vue中的函数

     new Vue({
            el: '#app',
            data: {
                info: [],
                IngredientCategory: '',
                IngredientCategory1: '',
                Error: null,
            },
            methods: {
                getFormValues: function() {
                    console.log("test " + this.IngredientCategory);
                    axios
                        .get("https://localhost:44331/api/Api/ShowRecipes/" + this.$refs.IngredientCategory.value + "/" + this.$refs.IngredientCategory1.value)
                        .then(
                            response => this.info = response.data,
                            this.Error = null
                        )
                        .catch(error =>  this.Error = error)
                },
                showRecipe: function (id) {
                    console.log(id)
                }
            }
        });

---

您只需将

id

作为参数传递，而不进行任何插值，然后向单击事件添加

prevent

修饰符，以防止页面重定向：

<a v-on:click.prevent="showRecipe(inf.Id)">Recipe</a>

配方

您只需将

id

作为参数传递，而无需进行任何插值，然后向单击事件添加

阻止

修改器，以防止页面重定向：

<a v-on:click.prevent="showRecipe(inf.Id)">Recipe</a>

配方

您需要从单击处理程序中的函数调用中删除mustache语法。因此，您需要从单击处理程序中的函数调用中删除mustache语法，而不是

。因此，您需要的不是

，而是

您是否尝试过使用

showRecipe（inf.Id）

…您是否尝试过使用

showRecipe（inf.Id）

。。。