没有从 api 控制器获取任何数据到 vue 组件中

Question

我在 vue 3 中有一个名为 index 的组件，它获取用户表单数据并将其传递到 laravel 中的 api 控制器。

async submitForm() {
  try {
    await axios.post(
      "/api/show",
      {
        firstname: this.form.firstname,
        email: this.form.email,
      },
    );
  } catch (error) {
    console.error("error");
  }
 
},

我试图通过以下方法将发送到控制器的数据获取到另一个名为 show 的组件上，我得到的只是空字符串，我不明白原因。任何指南将不胜感激。

   loadProductDetails() {
    axios.post("api/show")
    .then(({data}) => (this.products = data));
    
},

Answer 1

解决了问题。这是因为我试图从两种不同的路线中获得响应，但是第一个路由已经在获取后响应数据，第二个路由是返回空字符串并替换我已经从响应中收到的数据。

   try {
    axios
      .post("/api/show", {
        firstname: this.form.firstname,
        email: this.form.email,
        selectedAnswer: this.form.selectedAnswer,
        selectedCategory: this.form.selectedCategory,
      })
      .then((res) => {
        localStorage.setItem("show", JSON.stringify(res.data));
      });
  } catch (error) {
    console.error("error");
  }

只需将响应数据保存到本地存储中，然后从另一个组件中获取问题就可以解决问题。

loadProductDetails() {
    this.products = JSON.parse(localStorage.getItem('show'));
}