使用Vue + Axios创建编辑表单-将数据库中的动态值添加到表单输入

<template>
  <div>
    <input v-model="formData.name" type="text" placeholder="姓名" />
    <input v-model="formData.age" type="number" placeholder="年龄" />
    <!-- 其他表单输入项 -->

    <button @click="submitForm">提交</button>
    <button @click="editForm">编辑</button>
  </div>
</template>

<script>
import Vue from 'vue';
import Axios from 'axios';

export default {
  data() {
    return {
      formData: {
        name: '',
        age: '',
        // 其他表单输入项
      },
      dynamicValue: {
        name: '',
        age: '',
        // 其他动态值
      },
    };
  },
  created() {
    Axios.get('/api/dynamic-values') // 替换为实际的API接口地址
      .then(response => {
        this.dynamicValue = response.data;
      })
      .catch(error => {
        console.error(error);
      });
  },
  methods: {
    submitForm() {
      // 提交表单数据的逻辑
    },
    editForm() {
      this.formData = this.dynamicValue; // 将动态值赋给表单数据
    },
  },
};
</script>