通过ID 查询数据库数据返回到页面，但是页面不知道如何获取值，对已经双向绑定的form表单数据进行回显

Question

通过ID 查询数据库数据返回到页面，但是页面不知道如何获取值，对已经双向绑定的form表单数据进行回显？
后端代码：

请求成功说明已经获取数据：

但是前端不知道如何获取后端返回的数据：

用data获取就不行？：

Answer 1

引自免费微信小程序：皆我百晓生

看起来你在尝试从后端获取数据并将其显示在前端Vue.js应用中的表单中。根据提供的信息，问题可能在于如何正确地处理异步请求的结果，并将数据绑定到Vue组件的实例上。

首先，检查一下你的Reform变量是否应该写为companyInfo，因为你在模板中引用的是companyInfo。然后，确保你的Vue组件中有一个名为companyInfo的数据属性。让我们先修复这个问题：

// 在你的script部分
export default {
  data() {
    return {
      // 其他数据属性...
      companyInfo: {}, // 添加这个对象用于存储从后端获取的数据
    };
  },
  // ...
};

接下来，你需要更新getda()方法，确保将数据正确地绑定到Vue实例上：

// 更新getda()方法
async getda() {
  this.companyId = '001'; // 如果需要动态设置公司ID, 这里可以修改
  try {
    const response = await this.$http.get(`/company/${this.companyId}`);
    this.companyInfo = response.data; // 将服务器返回的数据赋值给companyInfo
    alert('审批请求发送成功!');
    console.log(response.data); // 可选：在控制台查看返回的数据
  } catch (error) {
    console.error('请求出错：', error);
  }
},

然后，在你的HTML模板中，你应该可以使用v-model指令双向绑定表单字段。例如，假设你有一个输入框用于显示公司名称，你可以这样操作：

<!-- 假设你有一个名为companyName的输入框 -->
<input type="text" v-model="companyInfo.postName">

这样，当companyInfo.postName的值改变时，它会自动反映在输入框中，反之亦然。

如果仍然存在问题，请检查浏览器的开发者工具（F12），看看是否有其他错误提示，这可能会提供更多的线索。同时，确保你的axios库已经被正确地安装和配置了。