Vue.js 将Vuex数据从API传递到表

因此，我的HTML中有一个引导Vue表，我想将配方名称传递给我的字段

我想在recipeItems:[]中加载数据并将其传递到我的表中。但我一直得到空Id作为错误响应

...mapState({
    recipeName: (state) => state.recipe.name,
    recipeId: (state) => state.recipe.id
})

...mapActions({ 
fetchRecipe: "recipe/fetch"
      setId: "recipe/setId"
 })

mounted() {
   this.setId(this.recipeItems);
    this.fetchRecipe().then(() => {
      this.recipeItems = this.recipeName
      })
}

setId（{commit}，id）{
提交（设置_ID，ID）；
},
获取（{commit，state}）{
返回api.recipes.get（state.id）.then（{data}）=>{
提交（SET_NAME，data.NAME）；

[设置名称]（状态、名称）{
state.name=名称；
},
[设置ID]（状态，ID）{
state.id=id；
},

发生了什么错误？我收到了这个错误

GEThttp://localhost:8001/recipes/null 422

但我发现我必须添加

这个.setId（）；

，但它仍然不起作用，因为我需要在此中传递参数。setId，我不知道传递什么。我用代码编辑了帖子您需要导入

setId

它在我的mapActions

setId:“recipe/setId”