如何使用户的个人资料页面可编辑，我想在编辑后保存这些数据（vue.js + laravel）

Posted 2023-02-22

【中文标题】如何使用户的个人资料页面可编辑，我想在编辑后保存这些数据（vue.js + laravel）

【英文标题】：How to make the profile page editable for users and i want to save those data after editing (vue.js + laravel)

【发布时间】：2019-11-27 00:58:44

【问题描述】：

我正在为一家公司制作一个 Web 应用程序，在个人资料页面中，我希望用户编辑详细信息并添加更多详细信息并保存它们。我尝试了很多方法，但它们都不起作用

我希望用户编辑这些我们在登录后从数据库中获取的名字和姓氏

      <v-dialog v-model="dialog">
        <v-card>
          <v-card-title>
            <span class="headline">Edit User</span>
          </v-card-title>

          <v-card-text>
            <v-container grid-list-md>
              <v-layout wrap>
                <v-flex xs12 sm6 md4>
                  <v-text-field v-model="user.firstName" label="First Name"></v-text-field>
                </v-flex>

                <v-flex xs12 sm6 md4>
                  <v-text-field v-model="user.lastName" label="Last Name"></v-text-field>
                </v-flex>
              </v-layout>
            </v-container>
          </v-card-text>

          <v-card-actions>
            <v-spacer></v-spacer>

            <v-btn color="blue darken-1" flat>Cancel</v-btn>

            <v-btn color="blue darken-1" flat>Save</v-btn>
          </v-card-actions>
        </v-card>
      </v-dialog>

【问题讨论】：

您能否提供更多关于为什么它不起作用的信息？例如响应代码。如果您使用 vue.js 发布此数据，您是否将其发布到带有某种令牌的 api 路由以绕过 csrf 验证？

不，我 dont have an idea to do it. i searched in the internet also i was failed to do it. yes im 通过 api 路由传递

【参考方案1】：

我们必须向后端发送一个 http 请求并使用响应保存数据。有关更多详细信息，请参阅本教程。 vuejs.org/v2/cookbook/using-axios-to-consume-apis.html

我已经用这个方法做了

【参考方案2】：

创建一个form，它将一个 POST 请求发送到某个端点并根据用户所写的内容更新数据。

【讨论】：

我在这里使用了一个对话框