上次我们使用axios给项目搞上了网络请求，从此项目数据不再是静态的。对于后端返回的值如何赋值给data里面的变量并且赋予数据响应式，写此日记记录踩坑过程。

1. axios返回的项目数据无法通过函数返回值返回，如何获取返回值呢？

<script>
import {  defineComponent, reactive, onMounted, toRefs, ref } from "vue";
import { getProjectDetailAPI } from "@/api/api";
export default defineComponent({
  setup() {
    //这里定义一个结构体，用来保存项目信息
    var Data = reactive({
      projectData: [],
      projectDetailData: [],
    });
    function GetProjectDetail(obj) {
      const pid = obj.pid;
      getProjectDetailAPI({ ProjectID: pid })
        .then((result) => {
          /*Data.projectDetailData这个变量是我们定义的reactive对象
          所以你打印出来他是一个数据代理的实例，并非array(),所以想要把
          获取的报文数据复制到里面，需要使用深拷贝*/
          Data.projectDetailData = JSON.parse(JSON.stringify(result.data));
        })
        .catch((err) => {
          console.log(err);
        });
    }
    //挂载后调用函数获取项目数据
    onMounted(() => {
      GetProjectData();
    });
    return {
      //解构Data结构体，让模板可以直接调用Data里面的对象
      ...toRefs(Data),
    };
  },
});
</script>