vue3如何把请求到的数据添加到另外一个const中？

Question

问题遇到的现象和发生背景

vue3都是 setup() { } 怎么把请求到的内容传到另外一个const中

问题相关代码，请勿粘贴截图

import Schart from "vue-schart";
import { ref, reactive } from "vue";
import { fetchtj } from "../api/index";
export default {
  name: "dashboard",
  components: { Schart },

  setup() {
    const query = reactive({});
    const tableData = ref([]);

    const getData = () => {
      fetchtj(query).then((res) => {
        tableData.value = res;
      });
    };
    getData();

    const name = localStorage.getItem("ms_username");
    const role = name === "admin" ? "超级管理员" : "普通用户";

    const data = reactive([]);

    const options = {
      type: "bar",
      title: {
        text: "当前两周签到总数",
      },
      xRorate: 25,
      labels: ["周一", "周二", "周三", "周四", "周五", "周六"],
      datasets: [
        {
          label: "2019",
          data: [235, 100, 270, 190, 230, 198, 278, 270, 190, 230],
        },

        {
          label: "2020",
          data: [100, 100, 270, 190, 230, 198, 278, 270, 190, 230],
        },
      ],
    };
    const options2 = {
      type: "line",
      title: {
        text: "直播课参加人数",
      },
      labels: ["周一", "周二", "周三", "周四", "周五", "周六", "周日"],
      datasets: [
        {
          label: "直播课",
          data: [1, 2, 3, 4, 5, 5, 5, 5, 5],
        },
      ],
    };

    const todoList = reactive([
      {
        title: "今天要修复100个bug",
        status: false,
      },
      {
        title: "今天要修复100个bug",
        status: false,
      },
      {
        title: "今天要写100行代码加几个bug吧",
        status: false,
      },
      {
        title: "今天要修复100个bug",
        status: false,
      },
      {
        title: "今天要修复100个bug",
        status: true,
      },
      {
        title: "今天要写100行代码加几个bug吧",
        status: true,
      },
    ]);

    return {
      name,
      data,
      options,
      options2,
      todoList,
      role,
      tableData,
    };
  },
};

运行结果及报错内容

我的解答思路和尝试过的方法

我尝试了两种方法，第一种是, 不行

     labels: [tableData.agin, "周二", "周三", "周四", "周五", "周六"]

第二种是返回数据时push

  const getData = () => {
      fetchtj(query).then((res) => {
        tableData.value = res;
    options.datasets[0].data.push(res.agin);
      });
}
    

但是报以下错误
Uncaught (in promise) TypeError: reduce of empty array with no initial value
不过console看实际已经添加上去了

我想要达到的结果

树状图可以用请求返回的数据显示出来！

Answer 1

问题已解决，感谢 @mrjimin 大佬提供两种解决方案

第一种这个加个value
...
第二种，options用reactive包起来， const options = reactive(...);