没有从 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

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

   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'));
}

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

Not getting any data from api controller into vue component

laravel

vue.js

laravel-8

vuejs3

laravel-mix-vue3