不能 post 它总是说该值为空

Question

我似乎不知道如何制作 POST 或连接到后端 (Laravel 8)。我正在研究 Quasar 和 Laravel。我有两个单独的文件夹，一个在后端，一个在前端。

我运行他们两个分开（左：Laravel，右：类星体）

我已经在类星体代理中制作了devServer来获取后端。

 devServer: {
  https: false,
  port: 8080,
  open: true,
  proxy: {
    // proxy all requests starting with /api to jsonplaceholder
    "/api": {
      target: "http://localhost:8080/", //tried this one also http://127.0.0.1:8000
      changeOrigin: true,
      pathRewrite: {
        "^/api": ""
      }
    }
  }}

这是我的 Vue 文件。

      <!-- Dialog  -->
  <q-dialog
    v-model="addProductForm"
    transition-show="slide-up"
    transition-hide="slide-down"
  >
    <q-card style="width: 700px; max-width: 80vw;">
      <q-card-section>
        <div class="text-h6">Add Category</div>
      </q-card-section>
      <div class="q-pa-md">
        <q-input outlined v-model="categoryName" label="Category name" />

        <div class="q-ma-md float-right">
          <q-btn label="Cancel" />
          <q-btn
            class="q-ml-md "
            label="Create"
            color="primary"
            @click="createCategory"
          />
        </div>
      </div>
    </q-card>
  </q-dialog>
  <!-- Dialog (END) -->
</q-card></q-page>

<script>
import axios from "axios";

export default {
  data() {
    return {
      addProductForm: true,
      categoryName: "Shoes",
      categories: []
    };
  },
  methods: {
    createCategory() {
      this.$axios
        .post("http://127.0.0.1:8000/api/createCategory", this.categoryName)
        .then(response => {
          // this.categories.unshift(response.data);
          console.log(response.data);
        })
        .catch(() => {
          this.$q.notify({
            color: "negative",
            position: "top",
            message: "Unable to save category name",
            icon: "report_problem"
          });
        });
    }
  }
  // mounted() {
  //   console.log(this.categories);
  // }
};
</script>

而且每次我都做了 post。它总是说 categoryName 是空的。

这是我的api.php

我的分类控制器。

任何人都可以知道如何让它工作吗？确实说categoryName是空的。

Answer 1

是axios post数据格式的问题

axios post 请求应该包含如下数据部分

{categoryName: this.categoryName}

不能 post 它总是说该值为空

Cannot post it always say the value is empty

laravel

vue.js

quasar-framework